Changing Rating Scale start value to zero

  • LaraFridgant
    Asked on November 4, 2014 at 7:07 PM

    Hi. I really need to create a rating scale with a zero start point. How can this be achieved without embedding into a website? thank you !!

    Lena

  • Charlie
    Replied on November 4, 2014 at 8:57 PM

    Hi Lena,

    Unfortunately, upon checking the Rating Scale, you can also set it up using values 1 and above using the options in the form editor. You do can achieve changing order and values of the scale by getting the form's source code and update it manually there. But as you mentioned, you would like to achieve the change without embedding it on your website, which is not possible if you are editing the source code. 

    If you need further assistance on editing the source code and applying it on your website, we'll be glad to help you.

    We'll wait for your response.

    Thank you.

  • Len
    Replied on November 4, 2014 at 9:13 PM

    Thx  for your quick response. However it is not at all helpful I resolving my question. I already know what is possible. I was asking for a practical work around Soecifically without the embedding of code as I am not working off a website ! 

     

    I look forward to your response with hopefully a useful workaround. 

     

    Kind regards

  • Welvin Support Team Lead
    Replied on November 5, 2014 at 12:52 AM

    Hi Lena,

    Unfortunately, it's not possible in the current Scale Rating settings. You may consider using the following widget:

    http://widgets.jotform.com/widget/numeric_slider

    Thank you!

  • Lena
    Replied on November 6, 2014 at 2:37 AM

    Thanks. Can this be requested as a future  feature please - there are plenty if people who have asked the same question for the same feature. 

    Cheers 

  • gori-mathew
    Replied on November 6, 2014 at 3:40 AM

    Hi Lena,

    You are most welcome. I will send this information to the Dev Team so that they may evaluate it further.

    If further support is needed, please let us know.


    Thank you

  • Charlie
    Replied on November 6, 2014 at 9:41 AM

    Hi,

    I would just like to suggest a possible workaround.

    Although this requires quite a bit of work when a guide will be made, so I cloned your form and did the changes there, you can then clone the form that I edited so that you can have the settings and code that I made from there.

    Here's the form: http://form.jotformpro.com/form/43093039449964?

    You can clone it using this tutorial or guide: http://support.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL 

    Below are the screenshots of a summary of what I did.

    1. I saw the first part of the scale rate that you have, originally 1-4 so I assumed that this is the part you wanted to have the starting value of 0, I made the scale 0-4.

    Changing Rating Scale start value to zero Image 1 Screenshot 70

    2. I changed the scale amount to "5", now I have 5 radio buttons. But how do I start from "0" and end with "4"?

    Changing Rating Scale start value to zero Image 2 Screenshot 81

    3. Edit the form in the Form Designer, we will add the custom CSS code here. 

    Changing Rating Scale start value to zero Image 3 Screenshot 92

    This is the custom CSS code for the question #1

    /**Question 1**/

    #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(2) > label, #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(3) > label, #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(4) > label, #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(5) > label, #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(6) > label {

        visibility : hidden;

    }

    #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(2):after {

        content : "0";

    }

    #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(3):after {

        content : "1";

    }

    #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(4):after {

        content : "2";

    }

    #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(5):after {

        content : "3";

    }

    #cid_38 > table > tbody > tr:nth-child(1) > th:nth-child(6):after {

        content : "4";

    }

    Light Blue Highlight: This code hides the label "1", "2", "3", "4" and "5" of the scale rate.

    Green Highlight: This code replaces the labels that are hidden and adds on their respective positions "0", "1", "2", "3" and "4".

    Now we have a custom scale rate with a "0" as a start. How do we now give it a value?

     

    4. I now add hidden textboxes that will store the original value of the scale (1-5).

    Changing Rating Scale start value to zero Image 4 Screenshot 103

    5. I then add from the "Conditions" setting this rule.

    If Question #1 is filled the result of Question #1 scale rate - 1 will be outputted on Textbox Scale Rate Question 1

    Ex. User choose radio button 1 which originally has value of 1 - 1 [we deduct the value original value by 1 to have a scale rate of 0-4 rather than 1-5], the answer or result will then be '0'.

    Changing Rating Scale start value to zero Image 5 Screenshot 114

     

    6. I then go to the Email Alerts setting and replace the field forms there the value of the hidden textboxes.

    Changing Rating Scale start value to zero Image 6 Screenshot 125

     

    I hope this helps. Let us know if you need further assistance on this. 

    Thank you.