Question

javascript code to disable submit based on a field value

Laserfiche Forms Version 10 Business Processes How To

Updated April 25, 2020

asked on April 19, 2020

Hi I have a form with a field called COUNT , which i get based on a Lookup Rule.

This is the requirement am trying to achieve:

If COUNT value is 2, the user should be able to complete the form and should see the button to add the second course.

If COUNT value is 1, the user should be able to complete the form, but should not see the button to add the second course.

If COUNT value is 0, user should not be able to complete another form. They should get a message saying they have already maximum COUNT.

Am trying to achieve this on the CSS JavaScript portion. Any help / suggestions appreciated.

0 0

Answer

SELECTED ANSWER

replied on April 21, 2020

Oh! Your function is triggered by a change of q3, but your testing the value of q25, if those don't occur together your code won't work. If the change of q3 changes q25 then trigger off of the change to q25.

1 0

Replies

replied on April 20, 2020

This is what i have and its not giving me the expected result.

If the value of the Course Count field is 2, I need to show a msg “Max Course Count Reached” and hide the Course Selection and Submit button. This is what I have…i used both versions of count and it's not working as expected. Any suggestions?

$(function()

{

var COUNT = $('input[name="Course Count Allowed"]').val();

// I use this format too var COUNT = document.getElementById('Course Count Allowed').val()

if (COUNT == '2')

{

alert('Max Reached');

$("#q4").hide();//hide Course Type

$('.Submit').hide();/hide Submit Button

}

else

{

$("#q4").show();

$('.Submit').show();

}

0 0

replied on April 20, 2020

The following code worked for me in a similar situation.

$(document).ready(function() {

$('#q1 input').focus();

// Disable submit button and display error fields if (#q33) employee folder was found on lookup
// There should be no duplicate SSN or employee number

    $('#q33 input').change(function() {
        if ($('#q33 input').val() == '') {         // if lookup failed
            $('.Submit').prop("disabled", false); // enable submit
            $('#q33').addClass("hidden");          // hide error fields
            $('#q34').addClass("hidden");
        } else {
            $('.Submit').prop("disabled", true);   // disable submit
            $('#q33').removeClass("hidden");       // show error fields
            $('#q34').removeClass("hidden");
        }
    });
});

0 0

View 5 previous replies

replied on April 20, 2020

Thanks for your response. To some extent am able to verify that on page load my alert "Code Works" works. But i still need to alert the user "max count reached" if the COUNT variable in the form has value 2 and hide the submit button.

Based on a specific empid the count value changes.

So when the form loads and when i type in a specific empid the COUNT field autoloads to value 2 (based on a lookuprule)

So when i input empid value in EMPID field, when the COUNT field auto loads value 2, i want the alert to fire "Max count reached" and hide or disable submit button

Below is my code so far.

$(function()
{
alert("Code Works");

//#q3 is the empid field;

//#q25 is the COUNT field with value 2;
$('#q3 input').change(function(){
if ($('#q25 input').val() == '2')
   {
   alert("Max count 2");
$('.Submit').hide();
   }
else
   {
$('.Submit').show();
   }

})

}
);

Am not sure if the below code does what my requirement is. (When user types in empid in #q3, based on the empid and if #q25 auto loads to value 2 then show alert "max count reached" and disable or hide submit. Any thoughts?

$('#q3 input').change(function(){
if ($('#q25 input').val() == '2')

0 0

replied on April 21, 2020

I'm not quite sure what you're asking. The test for a value of two seems straight-forward. I would not try to hide the submit button, but instead disable it. I would put the error message as the default value of a hidden read-only field and then show the field to display the error (with standout formatting). Does the above code work?

0 0

replied on April 21, 2020

Thx for your repsonse!

This is just a sample scenario (test value 2) am working on before trying out the actual requirements. The change function on #q3 works ($('#q3 input').change(function(){) as i inserted an alert to make sure the change triggers the alert, but not the if ($('#q25 input').val() == '2')

And yes i updated the code to have a error message as the default value of a hidden read-only field and then show the field to display the error.

Am still trying to get if ($('#q25 input').val() == '2') to work. The change function is not recognising the change which occurs on #q25 for it to display the error msg "Max count reached"

0 0

replied on April 21, 2020

Put an alert in the else clause to check if the "if" is failing or the "== '2'" is failing.

1 0

SELECTED ANSWER

replied on April 21, 2020

1 0

replied on April 21, 2020

Good suggestion. Yes the alert is firing for the else part. Looking into it now.

0 0

replied on April 21, 2020

Just saw your latest response on triggering q3 but testing q25. Did not realise that.....let me fix that.

0 0

replied on April 21, 2020

Thanks much for your suggestion. Yes it's working now!

0 0

replied on April 24, 2020

Quick check. Your suggestion is working. I have the below code.

So if the Count is 0 it disables the form with the error msg.

if the count is 1, it lets the user select the required course but does not let him select the additional course option (since he can do only 1 course submission) which is what i want.

But for some reason the submit button is not working for course count = 1.

It's enabled , but when i click on it nothing happens. Looks like i need to enable the submit button which i also tried in the below code (i have it commented out).

I tried both the submit formats below but it doesnt help in making the submit work.

$('.Submit').show();

$('.Submit').prop("disabled", false);

$(function()
{
$('#q27').hide();
$('#q25 input').change(function(){
if ($('#q25 input').val() ==0)
   {
   alert("Max count REACHED");
$('#q27').show();
$('#q4').hide();
$('.Submit').hide();
$('.submitMsg').hide();
//$('.Submit').prop("disabled", true);
   }
else
if ($('#q25 input').val() ==1)
   {
alert("Count 1 Reached");
   $('#q4').show();
$('.Submit').show();
// $('.Submit').prop("disabled", false);
$('#q20').hide();
   $('#q15').hide();
   }

})

}
);

#q27 - Error msg which should show when count = 0

#q25- course count

#q4 - course type dropdown (course selction)

#q20 and #q15 additional courses seelction ( which needs to be hidden when course count is 1.

0 0

replied on April 24, 2020

I don't see anything. What about reversing "$('.submitMsg').hide();"?

0 0

replied on April 24, 2020

.submitMsg is the below section. Am trying to enable the submit button below this section. The button is there but when i click it does no processing.

$('.Submit').show();

$('.Submit').prop("disabled", false);

0 0

replied on April 24, 2020

I did an Inspect element on the submit button which shows up in the form and this is what i see.

0 0

replied on April 25, 2020 • Show version history

I figured what the issue was with the submit button.

I had marked one of the hidden fields as required and hence the submit button was not processing the submission.

Once i removed the required on the hidden field it let me submit.

1 0

You are not allowed to follow up in this post.

Question

Question

javascript code to disable submit based on a field value

Answer

Replies

Sign in to reply to this post.