CODEWITHSUNDEEP
javascriptphpjqueryajax
Hammad
Hammad

Reputation: 2137

Why input fields get disabled after ajax or javascript function call?

I am making a simple signup form where I check whether the email users enters already exists or not. This is done via onChange function which in turn checks through ajax whether the email entered by the user is available or not. Currently I just show an alert box if the email is already registered. But I have noticed a strange behavior. After clicking the ok button in alert box the whole form gets disabled for text input. I cant enter the text into remaining fields and refreshing the page is the only solution to make the form active for input again. Why this is so? And how do I prevent it?

here is my code:

One of my input field

<input type="email" name="email" onChange="checkEmail()" id="email"/>

And here is the javascript and ajax code for checking email if it exists or not:

       function checkEmail()
         {

            var email=$('#email').val();


            var dataString = 'email=' + email;              
            $.ajax({
                type: "POST",
                url: "<?=base_url();?>home/check_email",            
                data: dataString,                           
                dataType:"html",
                success: function(msg)
                    {
                        if(msg=="1")
                        {
                            alert("The email already exists in our records!");
                        }

                    }
            });
        }

Upvotes: 0

Views: 384

Answers (3)

Dnaso
Dnaso

Reputation: 1365

or if you do want to check every key stroke (for whatever reason) use keypress events

 <input type="email" name="email" onKeyPress="checkEmail()" id="email"/>

Upvotes: 0

Bas van Dijk
Bas van Dijk

Reputation: 10713

You should use onBlur, this event triggered when you leave the textbox. Otherwise it would be called every time a character in the textbox changes.

<input type="email" name="email" onBlur="checkEmail()" id="email"/>

Upvotes: 2

Deepanshu Goyal
Deepanshu Goyal

Reputation: 2823

you must use onBlur

<input type="email" name="email" onBlur="checkEmail()" id="email"/>

Upvotes: 2

Related Questions