What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Can we have a 'calendar' date selector and have count of selected days ?

    Asked by CscProvidence on June 14, 2016 at 12:23 PM

    We're looking to allow users to pick dates from a 'calendar' of allowed dates to then multiply the number of selected days by a value to arrive at a total cost.  Ideally, the user could check one (or none) of two options for each date in which case there would be two totals, one for each option across the calendar.

    Display, ideally, would be a compact month view of some sort ...

     

    I'm currently looking at using the the multiple selection grid widget (lots of limitations), the spreadsheet widget (no documentation on allowed formulae), ...

     

    Not certain JotForm could do this (hopefully easily to program, but especially to use the resulting form).

  • Profile Image
    JotForm Support

    Answered by ashwin_d on June 14, 2016 at 02:08 PM

    Hello CscProvidence,

    I am not sure if I have understood your requirement correctly. It I break your requirement in pieces, this is my understanding and questions:

    #1. Add calendar where you can configure which all dates users can select - POSSIBLE TO ACHIEVE

    #2. Get the count of the days - POSSIBLE TO ACHIEVE but there should be two dates between which you can count the number of days. We need more clarity on this.

    #3. multiply the number of selected days by a value to arrive at a total cost - POSSIBLE TO ACHIEVE

    #4. Ideally, the user could check one (or none) of two options for each date in which case there would be two totals, one for each option across the calendar. - Not sure if I have understood this correctly.

    I would suggest you to please explain your requirement a bit more in detail and with example calculation and that would help us understand your requirement.

    We will wait for your response.

    Thank you!

  • Profile Image

    Answered by CscProvidence on June 14, 2016 at 02:46 PM

    Looks like the Matrix Survey field might actually do what I'm looking for since each cell of a matrix can be a drop down menu and we can assign A calculated value to each "cell".

    So I defined a matrix with 5 rows, 5 columns to simulate a calendar grid and 2 drop down values : "full time (25$)" and "half time (13$)" which get assigned to each cell of the matrix. So far so good as I can pick single values from the drop down of each cell, including empty 'choice'.

    Now to calculate the running total, the key requirement.

    I then assign caculated values to each cell.  It says each row separated by a line, each cell by a ','. BUT how do we separate the values assigned to the drop down choices ?  I need  : 0, 25 and 13 for each cell.

    So I tried ':' as it is used in some widgets for similar function.  NOPE.  In fact, I tried just about any thing to assign calculated values.

     

    I already had used the matrix for a more simple need.  It seemed to pick up the value from column titles (!)  Any character other than '-', '.' and 0 through 9 would be kept (!) while the rest dropped to come up with the value for the cells in that column.  If you have "1/2" in the title, it becomes 12 for the value of all cells in the column !!

    I tried this at the dropdown level.  The drop down choices as stated above. I took out the calculated values from the respective field of the widget definition.  Leaving them didn't seem to do anything...

     

    BINGO !

     

    But why is it not taking calculated values if the field is present in this widget's definition ?  It through me for a loop.  It does not seem to take any calculated values regardless of the format of cells : radio, check, etc.  It only looks at the choice/title for digits to make a value up.

    I snuck some CSS as part of choices : "Plein temps <span style="display:none;"> (25$)</span>" & "Plein temps <span style="display:none !important;">(25$)</span>" - which shows proper effect in editing mode.  However it gets ignored / dropped from the user's perspective.  This seemed to work in other fields.  But the recorded field values carry the extra stuff and becomes ugly fast.

    I would prefer the use of calculated values, not visible to the user, than having to place it as part of the drop down choices or the column titles.  Although in this case it is ok.  I will leave with what I managed to get done so far.

     

    Now for the real trick :  Say in a particular cell I don't want any choices or, tougher, some other choices, can it be done and how ?

    I managed to pull the first one off by adding "visibility:hidden;" to the individual cell's select through the Designer.  Bingo, the cell becomes 'empty'.  I can even apply the CSS to an individual option (a bit tricky as you have to play with 'child' to refer to the option), but it also works.  Sweet, for a geek that is.  It's kind of the long way around and a geeky user could make them visible again ...   In this particular form, he/she would also pay more since making a selection adds to the running total.

     

    Any ways, some questions, a bug (?) and work arounds to consider in the meantime ...

  • Profile Image

    Answered by CscProvidence on June 14, 2016 at 02:59 PM

    My follow up should be clearer, but to reply to your four points :

    #1. Add calendar where you can configure which all dates users can select - POSSIBLE TO ACHIEVE

    Yes, but it is just picking dates, not certain you can disallow certain dates (ex: weekends and holidays, howerver it may be done)

    #2. Get the count of the days - POSSIBLE TO ACHIEVE but there should be two dates between which you can count the number of days. We need more clarity on this.

    The days picked from calendar would be actual dates not a date range.  So it needs to count dates picked, not calculate the number of days in a range.  The later would need to skipped "disallowed" dates anyways, which I doubt the calculation can do.

    #3. multiply the number of selected days by a value to arrive at a total cost - POSSIBLE TO ACHIEVE

    It should, but we need to get the count of picked dates, not the number of days in a range.

    #4. Ideally, the user could check one (or none) of two options for each date in which case there would be two totals, one for each option across the calendar.- Not sure if I have understood this correctly.

    For each date picked, the user could have to select one or more choices from, say, a drop down ... then the 'calculated values' for the selected choices of the selected dates would be totaled.

     

    I figured a workable way using the Matrix Survey element.  Not as 'easy' to get running, but not as bad as I was expecting based on some of the other work arounds suggested in some situations.

     

    Check out my more detailed post (above this one ?)

     

  • Profile Image

    Answered by CscProvidence on June 14, 2016 at 03:01 PM

    I need to get my form up and running before the day is out.  But I'll do a mock up of the 'solution' I came up with to share with others ... by tomorrow morning.

  • Profile Image
    JotForm Support

    Answered by Mike_G on June 14, 2016 at 05:49 PM

    I have read your previous post and I checked the form you're working on. This is the form, https://www.jotform.com/61655096076967, correct? I see that you have found a way to calculate selected days with different values from a drop-down and get its total to a Form Calculation widget.

    We are glad that you have shared the solution you found as this may be used by other users as well. As for the trick you have mentioned above, I will, also, try to look for a workaround to hide the price on each dropdown options and also to hide cells that should not be shown in the matrix.

    Thank you.

  • Profile Image

    Answered by CscProvidence on June 15, 2016 at 05:55 PM

    The form you found is just my 'sandbox' test, but it shows most of the 'solution' found.  I have a separate form, in production for one of our schools using what I described in earlier post.

    To hide the "price" through CSS as part of the text of the individual choices is not "clean", so I'm avoiding it.

    To hide an individual choice or a cell's content can be done, for now, throught custom CSS with a Designer intervention.  Not ideal (one must figure out the ID of the elements), but it works.

    I'll update the 'sandbox' and properly share with the JotForm community in the next few days.

  • Profile Image
    JotForm Support

    Answered by EltonCris on June 15, 2016 at 08:35 PM

    It's good to know.

    Feel free to share us whatever solution or idea you may have. That would definitely benefit other users.

    Regards!

  • Profile Image

    Answered by CscProvidence on June 16, 2016 at 05:39 PM

    So here is the 'documented' and shared as a template pseudo-form :

    https://form.jotform.com/61655096076967

    I threw in some 'weird' stuff like numbering the cells (done manual, but not that difficult and could be any label not just a short number); 'removing' (hide really) some cell content and options. Well, look at the text on the form (the "documentation") as well as the CSS through Designer for more info.

    Make yourself a copy/duplicate and have fun ...  

     

    To use

    I would suggest you :

      - create a grid in your form,

      - find out what ID it has, you really need the number portion of the ID

      - then copy the bulk of the CSS of this template

      - paste it in your form's CSS

      - change the "_4" from the CSS taken from the template to refer to your form's grid element # (this is tedious, don't miss any)

    It should be easier then it sounds.  Give it a shot.  Of course, you will have to take out all of the weird stuff, or adjust the numbering of the cells, blabla ... 

    OR

     - create your grid and pick and choose from the template's CSS to adjust your form's CSS since you won't need all of the 'weird' stuff the template shows possible.

     

    I would really like to see a widget or whatever do this sort of stuff without having to roll up sleeves and dive deep into CSS as it is not for your average form creator. I'm somewhat OCD, so I do this sort of thing, sorry.  ;)

    Have fun folks ...