How to remove next button from pages in middle of form

  • grizbomb1126
    Asked on September 18, 2024 at 1:20 PM

    Hello,

    How do I remove the "Next" button on each page? I would like the participant to just "Submit" the form and not go to the next page. The participant "Skips to" a specific page depending on the answer to the first question.

    I understand I can have a "Submit" button on each page but I would like to remove the "Next" button to avoid confusion.

    Thanks!

    Jotform Thread 19143041 Screenshot
  • Mafe_M JotForm Support
    Replied on September 18, 2024 at 2:15 PM

    Hi Austin,

    Thank you for reaching out to Jotform Support. We can apply a custom CSS code on the form to hide the next button. Let me show you how:

    1. In Form Builder, click the Paint Roller icon to open Form Designer.

    How to remove next button from pages in middle of form Image 1 Screenshot 30

    2. Navigate to Styles tab.

    3. Scroll down to find the Inject Custom CSS section and paste the custom CSS code above.

    #form-pagebreak-next_35 {
        background-color: #2e69ff;
        border-color: #2e69ff;
        color: #fff;
        display: none;
    }
    #form-pagebreak-next_12
    {
     background-color: #2e69ff;
        border-color: #2e69ff;
        color: #fff;
        display: none;
    }
    #form-pagebreak-next_17
    {
     background-color: #2e69ff;
        border-color: #2e69ff;
        color: #fff;
        display: none;
    }

    #form-pagebreak-next_20
    {
     background-color: #2e69ff;
        border-color: #2e69ff;
        color: #fff;
        display: none;
    }
    #form-pagebreak-next_24
    {
     background-color: #2e69ff;
        border-color: #2e69ff;
        color: #fff;
        display: none;
    }

    #form-pagebreak-next_30
    {
     background-color: #2e69ff;
        border-color: #2e69ff;
        color: #fff;
        display: none;
    }
    #form-pagebreak-next_37
    {
     background-color: #2e69ff;
        border-color: #2e69ff;
        color: #fff;
        display: none;
    }
    #form-pagebreak-next_40
    {
     background-color: #2e69ff;
        border-color: #2e69ff;
        color: #fff;
        display: none;
    }


    How to remove next button from pages in middle of form Image 2 Screenshot 41


    Give it a try and let us know how it goes.


  • grizbomb1126
    Replied on September 18, 2024 at 4:26 PM

    Wow, it worked! Thank you very much!

    If I add additional pages to the form and I need the same thing done again should I just send another request in for a new custom code?


    Thanks,

  • Mafe_M JotForm Support
    Replied on September 18, 2024 at 4:36 PM

    Hi Austin,

    Yes, you can use the same custom code, but you will need to change field ID's since each next button has its own corresponding field ID. You can also reach out to us again to help with that.

    Reach out again if you have any other questions.


Your Answer