4

here is my code of jquery ...

i want to validate a text field for numeric value. if invalid then focus same text field again and agian ..

$('#price').blur(function(){
    if($(this).val() !='Preço em USD' && isNaN($(this).val()))
    {
        alert("Enter Integer only ...");
        $('#price').focus();
    }
});

i want to set #price focus if its not an integer... i have used $(this) etc also but still not working
Thanks in Advance ...

Mat
  • 202,337
  • 40
  • 393
  • 406
user794624
  • 367
  • 1
  • 5
  • 11
  • Have you considered using [``](http://www.w3.org/TR/html-markup/input.number.html) (admittedly it's HTML5, so might be poorly-supported)? – David Thomas Jun 26 '11 at 16:07
  • Code works as-is for me: http://jsbin.com/imavep/edit – Sampson Jun 26 '11 at 16:32
  • I've just been testing in jsfiddle and no matter when I call .focus() on an element, focus never seems to be given, at least in the context of then being able to type in the box. focus(fn) does seem to work tho and fn is fired upon focus. The same seems to be true of your example @Jonathan – Jamie Dixon Jun 26 '11 at 16:38
  • @Jamie What browser/version are you using? – Sampson Jun 26 '11 at 18:19

1 Answers1

6

The issue here seems to be with the amount of time between the blur event completing and the focus event triggering.

Wrapping the focus in a setTimeout allows the blur event to complete before setting the focus on the element.

$('#price').blur(function(){
    if($(this).val() !='Preço em USD' && isNaN($(this).val()))
    {
        alert("Enter Integer only ...");

        setTimeout(function(){
        $('#price').focus();
        },100);
    }
});

You can see a working copy of this here: http://jsfiddle.net/ttQRD/

UPDATE

As has been pointed out below in the comments, the issue here seems less to do with time and more to do with the delegation of the focus event.

Putting the focus event inside the setTimeout allows the current blur event to complete and the focus event to fire in a seperate loop.

Jamie Dixon
  • 53,019
  • 19
  • 125
  • 162
  • It's not time, really; you could call the "setTimeout()" with a 0 millisecond delay and it'd still work. (I think that Safari may not work, however, because it's *extremely* picky about "focus()".) – Pointy Jun 26 '11 at 16:51
  • If it's not time, what factor is it? – Jamie Dixon Jun 26 '11 at 16:51
  • It has to happen in a separate event loop. – Pointy Jun 26 '11 at 16:52
  • So by putting the code in the setTimeout, it's allowing the current loop to end (the blur event) and delegating the new call to a seperate loop. That makes sense. – Jamie Dixon Jun 26 '11 at 16:53
  • Yes, that's exactly it. Safari however doesn't like it because it generally refuses to honor "focus()" requests when it doesn't think it's the foreground active window - and the little "alert()" popup confuses it :-) (May be fixed in newer builds of the browser; I haven't tried it in a while.) – Pointy Jun 26 '11 at 16:55
  • i had the same issue. but with the change and focus event. setting the timeout inside the change event made me fix the problem. thanks a lot. – Dilberted Jun 21 '12 at 05:37