Question

I am using some javascript to check a form field against an array of possible matches. Dependent on match user is them presented with a confirm window and dependent on result form is either submitted or user is returned to the page. This process works as expected in Firefox and Chrome but in IE and Opera an alternative submit is still being triggered. Can anyone suggest how I can fix this?

Script is trimmed of most data for simplicity.

$(function(){
    var check = ["All", "array", "values"];
    $('#Next').click(function(){
        $(this).addClass('hit');
        $('#Cancel').attr('disabled', 'disabled');
    });
    $('#Form').bind('submit', function(){
        if($(this).find('.hit').attr('id')=='Next'){
            $('#Next').removeClass('hit');
            var match = $('input[name="WHAT"]', $('#idBothAddressesTable')).val().trim();
            if(match.length==0){
                var postCode = $('input[name="WHAT2"]', $('#idBothAddressesTable')).val().trim();
            }
            var matched = $.inArray(match, check);
            if(matched != -1){
                var ask = confirm("This is the case, proceed or cancel");
                if(ask==true){
                        $.post('dowhat.php',{flag: 1}, function()){
                        $('#Form').unbind('submit').submit();
                    });
                }
                else{
                    ('#Cancel').removeAttr('disabled');
                    return false;
                }
            }
        }
    });
});

Form actually has two submit values. Other than that is pretty basic, have trimmed away the bulk for simplicity again.

<form action="nextpage.php" method="post" id="Form">
    <input type="text" name="WHAT" />
    <input type="text" name="WHAT2" />
    <input type="submit" name="CANCEL" value="Cancel" id="Cancel" />
    <input type="submit" name="NEXT" value="Next" id="Next" />
</form>

In firefox and chrome this appears to work when someone meets meets the ask==true critera. The $.post goes ahead and the form is submitted as if the “NEXT” submit were clicked.

However in IE and Opera the $.post occurs but the form is submitted as if the the “CANCEL” were clicked.

Can anyone explain this to me, I can’t seem to find a solution?

Answer 1

You have a form with two submit buttons and you are telling the form to be submitted.

The result is undefined: each browser handle it in its own way! So, instead of telling form to submit, I suggest you to call the click event of the submit button you need to call.