Question

Friends I have following code in a javascript function that is assigned to onblur event on <input type="text" name="rate" />. #NewOrder is a div and input[name=quantity] is also a input type="text". These both input elements are inside #NewOrder div.

function addMaterial() {
    var qnty, rate;
    if (Number($('#NewOrder input[name=quantity]').val()) > 0) {
        qnty = Number($('#NewOrder input[name=quantity]').val())
    }

    else {
        alert('Invalid Quantity');
        $('#NewOrder input[name=quantity]').focus(); // ** Working
        return;
    }
    if ($('#NewOrder input[name=rate]').val().length == 0) {
        rate = 0;
    }
    else {
        if (!Number($('#NewOrder input[name=rate]').val() > 0)) {
            alert('Invaid Rate');     // ** Working
            alert($('#NewOrder input[name="rate"]').val()); // ** Working
            $('#NewOrder input[name="rate"]').focus();      // ** Not Working
            $('#NewOrder input[name="rate"]').trigger('focus'); // Also not Works
            return;
        }
        else
            rate = Number($('#NewOrder input[name=rate]').val());
    }
    var mat = getMaterialFromArray($('#mats').find(':selected').text());
    $('#mats').focus();
}

Friends where I am going wrong..? What thing am I missing..??
It is irritating me.
While alert($('#NewOrder input[name="rate"]').val()); says the actual value, means control is being selected using jQuery.
But neither $('#NewOrder input[name="rate"]').focus(); nor $('#NewOrder input[name="rate"]').trigger('focus'); works.

Added Live Version Link
try accessing http://a.bobdn.com use ‘111’ as Investor No. and ‘abc’ as password. Then navigate to Material -> New Order and pleeease look what is wrong there.

Answer 1

It seems to be a bug in Firefox. In Chrome your code is working as it should.
For support in Firefox you can create a function like:

function setFocus(controlSelectorString) {
    setTimeout(function() {
        $(controlSelectorString).focus();
    }, 0);
}

Jsfiddle