Hiding or disabling the Submit button

  • Profile Image
    glynnhammond
    Asked on June 21, 2021 at 12:05 AM

    Hi,

    I have a field that asks if the user has authority for the payment.

    If they answer "Yes" the form continues and they end up at a green "Submit" button.

    If they answer "No", the rest of the questions are hidden and the user jumps to a section with some text. There is also a Submit section with a "Save and Continue" button and a "Clear fields" option. I do not want the white "Submit" button (actually showing as "Do nothing")

    None of the conditions allow me to disable the "Do nothing" button.

    How do I achieve this?

    Also, how do I show the "Clear all questions" as a button rather than text?

    Thanks,

    Glynn

  • Profile Image
    gerardw
    Answered on June 21, 2021 at 03:07 AM

    You can use Show/Hide conditions to Hide the Submit button titled "Do Nothing" - https://www.jotform.com/help/316-how-to-show-or-hide-fields-base-on-users-answer

  • Profile Image
    gerardw
    Answered on June 21, 2021 at 03:23 AM

    Please use this CSS code to change all Clear questions texts as buttons:

    .form-submit-reset {

      border: 1px;

      width: 100px!;

      height: 50px;

      font-size: .875em;

      font-weight: 400;

      background-color: #6FB83C;

      padding: 10px;

      margin-left: 2px;

    }

    If you only want to change the last clear text as a button, then use this CSS code:

    #input_reset_35.form-submit-reset {

      border: 1px;

      width: 100px!;

      height: 50px;

      font-size: .875em;

      font-weight: 400;

      background-color: #6FB83C;

      padding: 10px;

      margin-left: 2px;

    }

    You may use the colors as per your requirement. You can get the color codes from this link: https://htmlcolorcodes.com/

    Here is how you can add CSS codes to the form: https://www.jotform.com/help/117-how-to-inject-custom-css-codes

    Do try and let us know if this helps.

  • Profile Image
    glynnhammond
    Answered on June 21, 2021 at 05:04 PM

    Hi Gerard,

    Thank you for the reply. The CSS worked fine and looks good. Is there a code to centre the object? Couldn't find one in my cursory google search.

    The hide fields option hides the whole section that contains the three buttons. I tried this yesterday afternoon and could successfully hide everything. I just want to get rid of the submit button and keep the others.

    See attached image of what I want to achieve.

    Thanks,

    Glynn

    1624309297_60d0fe31e9f42_jotCapture2.PNG


  • Profile Image
    glynnhammond
    Answered on June 21, 2021 at 05:42 PM

    The css (to amend the green clear button) is not saving. It is showing on the build page (see above), but not on the live form.

  • Profile Image
    gerardw
    Answered on June 21, 2021 at 10:55 PM

    If you need to hide only the last "Do Nothin" submit button, then please use this CSS code:

    #input_35.form-submit-button {

     display: none;

    }

    Also, for making the last Clear question text as a button, use this CSS code:

    #input_reset_35.form-submit-reset {

    border: 1px;

    width: 100px!;

    height: 50px;

    font-size: .875em;

    font-weight: 400;

    background-color: #6FB83C;

    padding: 10px;

    margin-left: 2px;

    }

    I tested this on a cloned version of your form and it is working as required.

    Please check this link: https://form.jotform.com/211718912644962

  • Profile Image
    gerardw
    Answered on June 22, 2021 at 04:53 AM

    Hello Glynn,

    Sorry for the trouble caused.

    Please replace the exisitng code that you have used with this one:

    .form-submit-reset {

     border: 1px!important;

     width: 100px!;

     height: 50px!important;

     font-size: .875em!important;

     font-weight: 400!important;

     background-color: #6FB83C!important;

     padding: 10px!important;

     margin-left: 2px!important;

    }

    Do try and let us know.

  • Profile Image
    glynnhammond
    Answered on June 22, 2021 at 04:31 PM

    That works.

    Thank you.