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

    How to remove the word "EUR" in the price list of of sub products?

    Asked by roel_heerema on June 02, 2016 at 11:00 AM
    Also: as you can see (encircled in blue) the prices are with the € sign, as well as the word EUR (same in American-English: $ sig and USD). Is it possible to use ONLY the € sign?
    EUR
  • Profile Image
    JotForm Support

    Answered by Charlie on June 02, 2016 at 12:10 PM

    If you would like to remove the word "EUR" in the list of prices in the sub products. Then you can use this custom CSS code:

    /*Hide all default pricing on the sub products*/

    .form-product-child-table > tbody > tr > td:nth-child(2) > span {

        display: none !important;

    }

     

    /*Format the next text under the price column in the sub product list*/

    .form-product-child-table > tbody > tr > td:nth-child(2):after{

        font-size: 0.786em;

        font-weight: bold;

        font-style: italic;

        font-family: "Lucida Grande", sans-serif;

    }

     

    /*First product group*/

    #input_3_1005_subproducts > tbody > tr:nth-child(2) > td:nth-child(2):after {

        content: "€ 3,50";

    }

    #input_3_1005_subproducts > tbody > tr:nth-child(3) > td:nth-child(2):after {

        content: "€ 3,70";

    }

    #input_3_1005_subproducts > tbody > tr:nth-child(4) > td:nth-child(2):after {

        content: "€ 3,70";

    }

    #input_3_1005_subproducts > tbody > tr:nth-child(5) > td:nth-child(2):after {

        content: "€ 3,90";

    }

     

    /*Second Product Group*/

    #input_3_1006_subproducts > tbody > tr:nth-child(2) > td:nth-child(2):after {

        content: "€ 4,00";

    }

    #input_3_1006_subproducts > tbody > tr:nth-child(3) > td:nth-child(2):after {

        content: "€ 4,80";

    }

    #input_3_1006_subproducts > tbody > tr:nth-child(4) > td:nth-child(2):after {

        content: "€ 4,90";

    }

    #input_3_1006_subproducts > tbody > tr:nth-child(5) > td:nth-child(2):after {

        content: "€ 4,10";

    }

    #input_3_1006_subproducts > tbody > tr:nth-child(6) > td:nth-child(2):after {

        content: "€ 6,40";

    }

    #input_3_1006_subproducts > tbody > tr:nth-child(7) > td:nth-child(2):after {

        content: "€ 3,30";

    }

    #input_3_1006_subproducts > tbody > tr:nth-child(8) > td:nth-child(2):after {

        content: "€ 3,70";

    }

    #input_3_1006_subproducts > tbody > tr:nth-child(9) > td:nth-child(2):after {

        content: "€ 5,30";

    }

     

    /*Third Product Group*/

    #input_3_1007_subproducts > tbody > tr:nth-child(2) > td:nth-child(2):after {

        content: "€ 5,60";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(3) > td:nth-child(2):after {

        content: "€ 5,70";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(4) > td:nth-child(2):after {

        content: "€ 4,00";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(5) > td:nth-child(2):after {

        content: "€ 6,80";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(6) > td:nth-child(2):after {

        content: "€ 6,30";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(7) > td:nth-child(2):after {

        content: "€ 6,00";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(8) > td:nth-child(2):after {

        content: "€ 5,80";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(9) > td:nth-child(2):after {

        content: "€ 4,90";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(10) > td:nth-child(2):after {

        content: "€ 5,50";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(11) > td:nth-child(2):after {

        content: "€ 5,40";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(12) > td:nth-child(2):after {

        content: "€ 5,90";

    }

    #input_3_1007_subproducts > tbody > tr:nth-child(13) > td:nth-child(2):after {

        content: "€ 4,30";

    }

     

    Here's my cloned form with that CSS code: https://form.jotform.com/61534644356963. This is how it looks like in my end:

    Please do double check if the prices are correct.

    Let us know if that works.

  • Profile Image

    Answered by roel_heerema on June 03, 2016 at 03:21 AM

    Thanks for your solution, but the form I am working on is much longer in the items to be ordered than the one you used (11 subcategories and a total of 74 products).

    Is there a solution that I can change € and EUR to a single € in one modification? that would also be useful when I might add products to my form, because I then do not need to add the extra lines to the CSS.

  • Profile Image

    Answered by Carina on June 03, 2016 at 05:55 AM

    Unfortunately there is not an automatic way of hiding the word Euro. In case of the sign € it is pretty clear and does not need additional explanation, but it is important to understand that with the sign $, it can be connected with many currencies, so additional text is needed. 

    I will still forward a request to our developers, so they might consider the implementation of such an option.

    We'll contact you via this thread if we decide on its implementation.

    Let us know if we can assist you further.   

  • Profile Image

    Answered by roel_heerema on June 18, 2016 at 12:48 PM

    I used a different solution, just in a short CSS Style:

     

    .form-product-details span {

        position: relative;

        margin-right: -27px;

        background-color: white;

    }

     

    The "margin-right: -27px" is found in a trial-and-error way and has (of course) to do with the font and fontsize used.

     

  • Profile Image
    JotForm Support

    Answered by Mike_G on June 18, 2016 at 04:15 PM

    Thank you for the update and for sharing your solution. However, when I tried to apply the CSS codes you provided to a clone version of your form it only changed this part (Please see image below).

    I have found a solution using CSS codes also that may resolve your concern.

    span[id*='input_3_100'][id$='_price']{

        position: relative !important;

        visibility: visible !important;

        left: -10px !important;

    }

    span[id*='input_3_100'][id$='_price']:before{

        content:"€ " !important;

    }

    span.form-product-child-price.form-product-child-label {

        visibility: hidden !important;

    }

    span.freeCurr{

        visibility:hidden !important;

    }

    Here's the form I have used for testing: https://form.jotform.com/61695531752966

    You may also add the codes below to fix the Total.

    .form-payment-price{

        visibility: hidden !important;

    }

    #payment_total{

        visibility: visible !important;

    }

    #payment_total:before{

        content:"€ " !important;

    }

    I hope this helps. Please feel free to let us know if you have any questions with the solution I have provided above. 

    Thank you.

  • Profile Image

    Answered by roel_heerema on June 20, 2016 at 08:20 AM

    Thanks for your solution. I placed your CSS code in my form, but it did not work. Perhaps this has to do with the fact that I cloned and changed my form. I am now using https://form.jotform.com/61541543354351 as my form.

    Could you provide me with the CSS code for this form that would make a solution for the word EUR?

    Thanks!

  • Profile Image
    JotForm Support

    Answered by jonathan on June 20, 2016 at 09:39 AM

    Please try this CSS codes on your form https://form.jotform.com/61541543354351

     

    span[id*='input_3_1008'][id$='_price']{

        position: relative !important;

        visibility: visible !important;

        left: -10px !important;

    }

    span[id*='input_3_1008'][id$='_price']:before{

        content:"€ " !important;

    }

    span.form-product-child-price.form-product-child-label {

        visibility: hidden !important;

    }

    span.freeCurr{

        visibility:hidden !important;

    }

     

    .form-payment-price{

        visibility: hidden !important;

    }

    #payment_total{

        visibility: visible !important;

    }

    #payment_total:before{

        content:"€ " !important;

    }

     

     

    This is my version of the form https://form.jotform.com/61714303320946 . You can check and test it to see the CSS codes work as intended.

    Let us know if still did not work for you.

    Thanks.

  • Profile Image

    Answered by roel_heerema on June 20, 2016 at 10:19 AM

    Alright, but the way you solve it, the notification of prices dissapears completely!

    See image.

  • Profile Image
    JotForm Support

    Answered by jonathan on June 20, 2016 at 10:27 AM

    Thank you for providing the screenshot and I apologize for the mistake.

    I just checked again and I see the problem now as well.

     

    Let me check how it can be fix. I'll get back shortly.

    Thanks.

  • Profile Image
    JotForm Support

    Answered by jonathan on June 20, 2016 at 10:57 AM

    Please check again my test form https://form.jotform.com/61714303320946

     

     

    I cleared the other CSS codes and used only this http://pastie.org/10884169

    I suggest also you clone the form so that we can work on the cloned version without worrying about your live form.

    Let us know how it goes.

    Thanks.

     

  • Profile Image

    Answered by roel_heerema on June 20, 2016 at 11:16 AM

    It is getting better, but your solution only works for a part of my form?
    I cloned the form; the clone is: form 61714829980365.
    As you can see in this cloned form, it works for the first 4 Sub-Categories; after that the price is gone.
    Moreover: there already was a problem with the columns not lining, and now that has become even more!

  • Profile Image
    JotForm Support

    Answered by Charlie on June 20, 2016 at 12:11 PM

    I am not quite sure what kind of text-alignment you would like to have. Based from your form, the product description/name for each sub product is aligned to the right. 

    I cloned your form and made some edits, see if this one works for you: https://form.jotform.com/61715187601959

    If so, you can clone it and copy the CSS code directly there.

    Let us know if that helps.

  • Profile Image

    Answered by roel_heerema on June 20, 2016 at 01:07 PM

    Aha, that's nice! Not exactly, but good enough (I sometimes use a screen measure tool, called Meazure, with which amongst others I can place grid over my screen to see how items are placed).

    I will go on with your solution.

    Thanks for your effort.

  • Profile Image
    JotForm Support

    Answered by Charlie on June 20, 2016 at 01:39 PM

    I'm glad to hear that it worked for you. If you needed some adjustments on it, please do let us know.

    For other concerns or questions, feel free to open a new thread here in the forum.

    Thank you.

  • Profile Image

    Answered by roel_heerema on June 29, 2016 at 06:23 AM

    Thanks again! I finally had the time to implement your code in my form and it worked fine.

    Thanks for your contribution!

  • Profile Image

    Answered by Irshad on June 29, 2016 at 06:44 AM

    You are most welcome, please let us know if you have any other query.