简体   繁体   中英

How to disable .change function when the page loads

In my $(document).ready() function I have a .change event bound to a set or radio buttons. If there is an error on the form the user submits, however, the page will re-load with the values selected by the user. This is causing the radio button .change function to fire every time the page loads, which I do not want it to do. How would I disable this?

EDIT

Here's the full function, didn't post prior due to the fact it's a hot mess in the middle right now and was trying to keep the readability of this post in mind.

FYI - If there has been an error after the user submits the form then I need the page to load the form as it was when the user hit the submit button. Since we display a certain set of div and span elements based on the radio button selection, I used the trigger('change') method. Is there any way to detect if the operation is occurring during a page load?

    $('input[name=TransactionType]').change(function (e) {
        //Clear any messages from previous transaction
        $('.error').text('');
        $('.success').text('');

        //Display fieldset Submit and Cancel(back to search) link
        $('#PageDirection').show();
        $('#AgentInformation').show();

        //Display input fields
        var radioValue = $(this);

        if (radioValue.attr('id') == "Enroll" || (radioValue.attr('id') == "ModT")) {
            //Enable and disable input boxes
            $('span').not('#AllInput').hide();
            $('#AllInput').show();
            $('#PayFrequency').show();
            $('#refNumberInput').show();

            //Set tooltips
            $('#AccountType').removeAttr("title");
            if (radioValue.attr('id') == "Enroll") {
                $('#PaymentFrequency').removeAttr("title");
                $('.req').show();
                $('#refNumberInput').show();
                $('#enrollNote').show();
            } else {
                $('#PaperStatement').show();
                $('#PaymentFrequency').attr("title", "Select the frequency to pay the distributor");
                $('#refNumberInput').show();
            }
        } else if (radioValue.attr('id') == "New") {
            $('span').not('#NewMessage').hide();
            $('#NewMessage').show();
            $('.req').show();
            $('#refNumberInput').show();

        } else if (radioValue.attr('id') == "ModA") {
            $('#AllInput').show();
            $('#AgentIdSpan').show();
            $('.req').show();
            $('#UnenrollMessage').hide();
            $('#NewMessage').hide();
            $('#PayFrequency').hide();
            $('#PaperStatement').hide();
            $('#refNumberInput').show();
            $('#AgentId').attr("title", "Enter the Agent ID to be modified");

        } else if (radioValue.attr('id') == "Clone") {
            $('span').not('#AgentIdSpan').hide();
            $('#AgentIdSpan').show();
            $('.req').show();
            $('#AgentId').attr("title", "Clone EFT onto this Agent ID");

        } else if (radioValue.attr('id') == "Unenroll") {
            $('span').not('#UnenrollMessage').hide();
            $('#UnenrollMessage').show();
            $('.req').show();
            $('#refNumberInput').show();

        }

        if (radioValue.attr('id') != "Clone") {
            $('.alwaysReq').show();
        };
    }).filter(':checked').trigger('change');

If you do not care about auto-completion you could put autocomplete="off" on the form . You could also compare the current field value with it's defaultValue to see if it was automatically populated by the browser.

you can use "on" or "delegate" inside the jquery ready function. like this:

   $(document).delegate("input[name=TransactionType]","change", function(){
        $('.error').text('');
        $('.success').text('');
   });

document.ready won't usually call the change the function. It will only get called if you manually change the checkbox, or the same event influenced by some other function, but not in document.ready .

Please remove the .trigger('change') method as it would trigger the change method on document.ready

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM