disable submit button based on two values

replied on March 26, 2019

This might be a better option.

Add a custom HTML element to the bottom of your page with the following HTML inside of it:

<button type="submit" class="action-btn">Submit</button>

Next, add custom CSS to hide the built-in button

.Submit {
  display:none;
}

Now, just use Field Rules to show or hide the CustomHTML object.

If you want a Disabled button, then you could create another Custom HTML object that just looks like a disabled button and show/hide that as well (I do this on some forms).

The nice thing with this approach is you don't need any JavaScript at all.

1 0

replied on March 26, 2019

Good Afternoon Jason,

Thanks for the reply and this is very interesting approach that I will consider with my future forms for sure!

After much trial and error, I was able to get the correct Javascript to accomplish my goal.

$(document).ready(function() {
    var $submit = $('.Submit');
    
    $(document).on("change", function() {
        if (($("#Field131").val() <1000.01) && ($("#Field138").val() =="No"))  {
            $('.Submit').prop('disabled',false);
        } else {
           $('.Submit').prop('disabled',true);
        }
  }).find('input.Submit').prop('disabled',true);
  
});

1 0

replied on March 26, 2019 • Show version history

You could simplify this a bit. Instead of using an if/else, just set the disabled property equal to the result of that same comparison.

$(document).ready(function() {
    var $submit = $('.Submit');
    
    $(document).on("change", function() {
        $('.Submit').prop('disabled',($("#Field131").val() <1000.01 && $("#Field138").val() =="No"));
    }).find('input.Submit').prop('disabled',true);
});

0 0

Question

Question

disable submit button based on two values

Replies

Sign in to reply to this post.