You are viewing limited content. For full access, please sign in.

Question

Question

Hide submit on form if hidden field is blank - Classic Designer

asked on December 3 Show version history

I have a hidden Single Line field that is being auto-populated with a Lookup Rule. If this field is not populated, I want the Submit button hidden. Since it is hidden, I can't use "required" to force this or else it displays an error upon submit instead of simply hiding Submit. I have found code that should work for this, one does not work at all and one hides submit even when the field is populated so I must be coding incorrectly.  Here is the hidden field with the Q # from the JavaScript screen.

0 0

Replies

replied on December 3

I'm curious to know what is keeping you from using the new form designer because as mentioned field rules makes this much easier. But the code you need is here:

const $submit = $('.Submit');
const $hiddenVerification = $('#q64 input');

$hiddenVerification.on('change', function () {
  const val = $hiddenVerification.val();
  if (val === "") {
    $submit.hide();
  }
  else {
    $submit.show();
  }
});

 

2 0
replied on December 3

No luck... allowed me to submit.  There must be something special about this form in some way that is causing the coding not to work. I've messed with several variations ... this is the first one written in this way ... no luck on any though. 

0 0
replied on December 3

Try using this 

$(document).ready(function () {
    // Initially hide the submit button
    $('.Submit').hide();

    // Function to check the value of the field and toggle the submit button
    function checkFieldAndToggleSubmit() {
        var fieldValue = $('#Field6').val();
        if (fieldValue && fieldValue.replace(/\s/g, '') !== '') {
            $('.Submit').show();
        } else {
            $('.Submit').hide();
        }
    }

    // Attach the function to the change event of the field
    $('#Field6').on('change', checkFieldAndToggleSubmit);

    // Initial check when the form loads
    checkFieldAndToggleSubmit();
});

Change out #Field6 with your fieldID.  I couldn't get it to work on the q6 but this did.

1 0
replied on December 3

FYI - if referencing #q6 that it the entire field (labels, helptext, input element, etc.), not just the input element, which is why it acts differently with #Field6 which targets the input element specifically.  Either of these two should work about the same:
$('#Field6').val()
$('#q6 input').val()

1 0
replied on December 3

This does hide the submit button, but once the field populates, it does not show it.  

0 0
replied on December 4

What is populating this field specifically, this is a better version of the code I provided and the only reason it wouldn't work is whatever is setting it is not firing a "change" event. Is it being populated by a lookup or formula? Or is it being populated via JS

0 0
replied on December 4

@████████  By lookup. The user enters their account number then their personal id #. If there is a match in the system of record, a hidden field is populated to indicate said match. I want submit hidden until that hidden fields is populated. I have "unhid" the field to be sure it is populating, and it is, yet the submit button is still missing using Angela's code and it is there from the start using the one you provided.  

0 0
replied on December 3

I'm on Cloud so I apologize if this doesn't work for you, but are you able to hide the Submit button using just field rules as opposed to Javascript in LF 11?

Here is how I would set it up:

0 0
replied on December 3

I am not on cloud and I use the classic designer. Thank you so much for responding though! 

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.