Hide field not working

  • Profile Image
    Asked on May 11, 2014 at 01:03 PM


    First of all great tool!

    In this form http://form.jotformeu.com/form/41256189413354? on page 2:

    The rule is set to 

    if 'Which system are you currenly using in your Back Office' is set to 'Outsourced' then 

    hide the next two questions.

    But it's not working. Am i doing it wrong?


    Second, my client wish to have the 'Back' and 'Next' button to the right of the last question. How do i do that?



  • Profile Image
    Answered on May 11, 2014 at 01:51 PM

    Hello simcorpdk,

    I cloned your form and found out that your condition for the field in question are completely identical. I recreated the condition on my cloned form and set 2 actions to hide the 2 succeeding questions and it worked. See how I did it below:

    You can checked my cloned form HERE. Feel free to clone the form if you wish.


  • Profile Image
    Answered on May 12, 2014 at 05:05 AM

    Hello simcorpdk,

    For some unknown reason, we have received an empty response from you. If you have replied from your email, please click on the following URL to reply again:  http://www.jotform.com/answers/375473-Hide-field-not-working#2

    Thank you!

  • Profile Image
    Answered on May 12, 2014 at 05:12 AM

    Thanks for quick respons!
    I got it working now.

    Here http://form.jotformeu.com/form/41256189413354? i have made a custom NEXT button - ONLY the Next button- 
    Actually just a background image on the div, but i cant hide the button itself, so thats laying over my button. How do i do that?


  • Profile Image
    Answered on May 12, 2014 at 08:30 AM


    Inject the following CSS codes to your form. This will hide the next button and reveal your custom next image. Add it on top of the existing injected CSS codes.

    .form-pagebreak-next {

    background: transparent !important;

    border: none !important;


    color: transparent;

    padding: 11px 20px;

    box-shadow: none;

    filter: none;



    .form-pagebreak-next:before {

    content: " ";

    font-size: 20px;

    padding: 20px 17px;


    button[id*="form-pagebreak-next"] {

    border: none !important;

    box-shadow: none;

    font-size: 0;


    button[id*="form-pagebreak-next"]:hover {

    border: none !important;

    box-shadow: none;



    Demo: http://form.jotformpro.com/form/41313861825958?

    Hope this helps!