CODEWITHSUNDEEP
jqueryinternet-explorerfocusonchange
Ashley
Ashley

Reputation: 251

jquery change() on input box in IE6 - can't remove focus

I have a checkout page that unobtrusively checks to see whether a customer has ordered from us before.

After they fill in their e-mail address and focus to the next box, I look up the e-mail and present a 'welcome back' type thing with option to remember their details.

I'm getting a problem in IE6 - whenever the focus is lost from the input box, the ajax function runs as normal but focus is returned back to the input box. This means that whenever the customer tries to click away from the e-mail input box, they keep getting returned to it and cannot proceed.

Is there a way of stopping this behaviour?

  // check when the e-mail box is changed
  $("#email").change(function(event) {
    $.ajax({
        type: "POST",
        url: "procBasketEmailLookup.php", 
        data: $("#checkoutform").serialize(),
        success: function(response) {
            $('#emailstuffOutput').hide();
            $('#emailstuffOutput').html(response);
            $('#emailstuffOutput').show('slow');
        }
        });
        // DON'T ALLOW THE PAGE TO SUBMIT
    return false;
    });

Upvotes: 1

Views: 847

Answers (1)

Vivin Paliath
Vivin Paliath

Reputation: 95538

Try:

jQuery("#emailInputField").blur();

Put that in the success handler of your AJAX call, or even in your change() handler. I can't tell from your question if it's the AJAX call that's causing the problem, or if it's the change() handler. But this should work.

EDIT

With regard to Pointy's comment. Using blur() messes up the tab sequence. Also, Pointy and Mattias pointed out that you're returning false from your handler. There's no need for you to do that since you're not in a submit() handler. The return false; might also be the cause of your problem.

Upvotes: 3

Related Questions