0

I have a form on a page that contains two drop down lists (id & name = "clientID" & "attendanceID") and a submit button. I want the submit button to be disabled (or hidden) if either of the dropdowns are set to a value of 0, which indicates that no sensible selection has yet been made.

I have the following in the head:

<script src="~/Scripts/jquery-2.2.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $('#submitnewrecord').prop('disabled', true);

    function updateFormEnabled() {
        if ($('#clientID').val() != 0 && $('#attendanceID').val() != 0) {
            $('#submitnewrecord').prop('disabled', false);
        } else {
            $('#submitnewrecord').prop('disabled', true);
        }
    }

    $('#clientID').change(updateFormEnabled);

    $('#attendanceID').change(updateFormEnabled);
</script>

My select boxes are created via helpers, but the resultant HTML is:

                    <select id="clientID" name="clientID">
<option selected="selected" value="0">--- select client ---</option>
<option value="397">John Doe</option>
<option value="416">Fred Smith</option>
<option value="384">Albert Epstein</option>
</select>
                    <select id="attendanceID" name="attendanceID">
<option selected="selected" value="0">--- select category ---</option>
<option value="1">Scheduled</option>
<option value="2">Attended</option>
<option value="3">Absent - Notified</option>
<option value="4">Absent - Unexplained</option>
</select>

My submit button HTML is:

<input id="submitnewrecord" name="submitnewrecord" type="submit" value="Update" />

I am not getting any difference in behaviour of the button to when I didn't have any JS at all! I've obviously done something daft, but could anyone let me know what that is?

Stuart Newbridge
  • 67
  • 12
  • 2
    You're probably going to have to post the selects as well, and this seems to work fine -> https://jsfiddle.net/96fotsc2/ – adeneo Mar 03 '16 at 17:30
  • 2
    Is jQuery actually loading? I'm skeptical of `~/Scripts/jquery-2.2.0.min.js` as a relative URL. – apsillers Mar 03 '16 at 17:32
  • 1
    Maybe something obvious, but have you tried to put that code inside `$document.ready();` ? – carlosherrera Mar 03 '16 at 18:16
  • Is your ` – t.niese Mar 04 '16 at 10:13
  • @adeneo - I've edited my question to include the selects, as requested. The jsfiddle to which you linked was what I adapted! I changed the tag ids & names, obviously, and I changed from attr to prop because I think that's a more 'proper' way of doing this since jquery 1.6. And I absorbed his 'verifyAdSettings' function into the conditional clause of 'updateFormEnabled' because that seems to be a more elegant way of doing it. – Stuart Newbridge Mar 04 '16 at 10:16
  • @apsillers - Yes, the jquery file is loading fine, but if you've a better way of calling the file that resides in a directory named 'Scripts' that sits on my root, I'd be delighted to hear it. – Stuart Newbridge Mar 04 '16 at 10:19
  • @carlosherrera - Sorry mate, but I don't understand why doing that would be beneficial. Could you explain? – Stuart Newbridge Mar 04 '16 at 10:20
  • @t.niese - The script is in my page head. I was thinking about this last night and perhaps it ought to load after all of the page's HTML. You might be on the right track with this, because it would explain why the button is not disabled on startup, but even so I'd expect some disabled/not disabled behaviour when I select/deselect options. – Stuart Newbridge Mar 04 '16 at 10:24
  • @StuartNewbridge — Why? The select elements didn't exist when you tried to bind the event handlers to them. – Quentin Mar 04 '16 at 10:35
  • @Quentin - Good point! So do you think my problem will be solved by simply moving the JS functions to below the HTML? I presume that I still need to call the jquery file in the head though. – Stuart Newbridge Mar 04 '16 at 10:48
  • You need to load jQuery before you use it. – Quentin Mar 04 '16 at 10:50
  • @Quentin - Just tested it and you're absolutely right. It would seem that my PC is infected with the stoopidUser virus. – Stuart Newbridge Mar 04 '16 at 10:54

0 Answers0