Question

Hide Submit Button until Radiobutton is selected

Forms

Updated February 1, 2019

asked on January 31, 2019

This may be similar to some other posts out there but could someone please help on how to hide the Submit button until one of the radio buttons has been checked?

I have a starting form with the radio button field with none selected initially.

Until/unless the user selects either A or B, I need the Submit button to be hidden by default. Thank you.

1 0

Replies

replied on January 31, 2019 • Show version history

I've that functionality enabled in one of my processes. The code is:

$(document).ready(function(){
  // hide submit by default
  $('.Submit').hide();

  // apply event handler to radio inputs
  $('.showSubmit input').change(function(){
    // if 1 or more YES selections are found
    if($('.showSubmit input[value="Yes"]:checked').length > 0){
      // show submit button
      $('.Submit').show();
    }
    // otherwise
    else{
      // hide submit button
      $('.Submit').hide();
    }
  });
});

Put showSubmit under the Advanced tab for the radial button, in the CSS class.

It works great.

Thanks,

Michael

3 0

replied on January 31, 2019

This might be what you are looking for

https://answers.laserfiche.com/questions/73949/JavaScript-Tabs-Showing-Submit-button-based-off-of-RadioButton#73968

0 0

replied on February 1, 2019 • Show version history

Thank you both for your input.

I was able to hide the button by default then show once one of the radio buttons was selected;

I added the value to each choice then added the code below; I tried to use the Or statement but somehow it did not work so I repeated this code twice; but I am sure there is a better way.

01
$(document).ready(function(){
02
  // hide submit by default
03
  $('.Submit').hide();
  
04


05
  $("input[value='A']").click(function(){

06
    $(".Submit").show();
07
});
08
});

09
$(document).ready(function(){
10
  // hide submit by default
11
  $('.Submit').hide();
  
12


13
  $("input[value='B']").click(function(){

14
    $(".Submit").show();
15
});
16
});

0 0

replied on February 1, 2019

Try to use the [code] button for your code to make it easier to read.

Insert code here

0 0

replied on February 1, 2019

Is your goal to actually hide the submit button? Or can you just make the field required which would prevent submitting unless A or B is pressed. Using the Forms required setting on the field is safer because JS required can be bypassed by a somewhat sophisticated user. If you just want to make sure this radio button is selected before submit, I'd recommend using the required option.

That said, if you actually want to hide the button...

This code should do it for you, but a couple notes:

This hides the submit button by default unless A or B is clicked
You need to add the showSubmit button class to the radio button in the field options Advanced tab (just type "showSubmit" in the class input)

$(document).ready(function(){
  // hide submit by default
  $('.Submit').hide();

  // apply event handler to radio inputs
  $('.showSubmit input').change(function(){
    // if 1 or more YES selections are found
    if(($('.showSubmit input[value="A"]:checked').length > 0)||($('.showSubmit input[value="B"]:checked').length > 0)){
      // show submit button
      $('.Submit').show();
    }
    // otherwise  
    else{
      // hide submit button
      $('.Submit').hide();
    }
  });
});

2 0

You are not allowed to follow up in this post.

Question

Question

Hide Submit Button until Radiobutton is selected

Replies

Sign in to reply to this post.