Im having a problem with a form im developing.

The form is held in a table.
I have had to modify the keypress events for navigation and so keydown
now gets focus on the input immediately below the current one.

I have some validation going on on the input which fires on blur() of
the current input.  The validation works fine when the user blurs via
tab or mouse click but it didnt fire when i forced focus to move due
to the keydown event.  To get around this I added $(selector).blur()
to force a blur on the current input.

The problem I have is within the blur() function I have an alert if
certain criteria isnt met (i.e the inputted value is not numeric).
When bluring via tab or mouseclick the alert shows only once which is
great but if blur is triggered via the keydown event the alert shows
twice???   it has me puzzled.  The code is below please help.

        //keypress navigation functions
        $("#pri_Prod input[id*='pH']").keydown(function(e) {

            var phIndex = $("#pri_Prod input[id*='pH']").index($
(this));
            //alert(e.keyCode);
            if (e.keyCode == 40) {
                $("#pri_Prod input[id*='pH']").eq(phIndex).blur();
***** This is where i force the blur on keydown as it didnt fire
without it.
                $("#pri_Prod input[id*='pH']").eq(phIndex + 1).focus
();
            } else if (e.keyCode == 38) {
                $("#pri_Prod input[id*='pH']").eq(phIndex).trigger
("blur");
                $("#pri_Prod input[id*='pH']").eq(phIndex - 1).focus
();
            } else if (e.keyCode == 39) {
                $("#pri_Prod input[id*='pH']").eq(phIndex).trigger
("blur");
                $("#pri_Prod input[id*='conc']").eq(phIndex).focus();
            }

        });


        //Colour inputs depending on min-max range
        $("#pri_Prod input[id*='pH']").blur(function() {

            var currentTr = $(this).parent().parent();
            var currentRowID = $(currentTr).attr("id");
            var idString = currentRowID + "_machineInfoDiv";
            var min = $("div[id*='" + idString + "']
#machineMinpH").html();
            var max = $("div[id*='" + idString + "']
#machineMaxpH").html();


            var currentInput = $(this).attr("id");

            var enteredValue = $("#" + currentInput).val();


            if (isNaN($("#" + currentInput).val())) {
                alert("pH must be a numeric value between 0 - 14");
                $("#" + currentInput).val('');
                $("#" + currentInput).focus();
                phError = true;
            }
            else if (parseFloat(enteredValue) < 0 || parseFloat
(enteredValue) > 14) {
                alert("pH must be a numeric value between 0 - 14");
                $("#" + currentInput).val('');
                $("#" + currentInput).focus();
                phError = true;
            }
            else {
                phError = false;
                if (enteredValue != "" && parseFloat(enteredValue) >
parseFloat(max)) {
                    $("#" + currentInput).parent().addClass
("errorState");
                }
                else if (enteredValue != "" && parseFloat
(enteredValue) < parseFloat(min)) {
                    $("#" + currentInput).parent().addClass
("errorState");
                }
                else {
                    $("#" + currentInput).parent().removeClass
("errorState");
                }
            }

        });

Reply via email to