views:

422

answers:

1

Hi, 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;
    });
+2  A: 

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.

Vivin Paliath
The problem with calling "blur()" is that it can mess up the "tab sequence". If the user made a change and then used "tab" to go to the next field, calling "blur()" can cause the browser to reset the focus to some more-or-less random spot on the page.
Pointy
Good point; I'm updating the answer anyway - it looks like it might be related to the `false` that he's returning from the `change()` handler.
Vivin Paliath