How to send an onBlur trigger before a form

Question

I have a field inputin which I have a function onBlurcalled for verification.

The problem that I have encountered is that when I click the submit button without leaving the field input, the form is sent before the call onBlurand check is not performed.

Can someone suggest a workaround here. I am using javascript and jQuery in my JSP page.

Answer 1

There may be simpler options, but you can stop the submit button and then submit the form to the next frame (using setTimeout):

. -

$('input[type=submit]').click(function(e){
    var $form = $(this).closest('form');
    e.preventDefault():
    setTimeout(function(){ 
       $form.submit();
    }, 0);
});

, Enter, , , Enter. , submit.

, ( Enter) form ( ), , :

$('form').submit(function (e) {
    var $form = $(this);
    $form.toggleClass('ignore');
    if ($form.hasClass('ignore')) {
        e.preventDefault();
        $form.find('input[type=text]').blur();
        setTimeout(function () {
            $form.submit();
        }, 0);
    }
});

JSFiddle: http://jsfiddle.net/TrueBlueAussie/7uLfra3b/2/

, , Enter.

Answer 2

, , , , , - :

$('input').focus(function(){
  $('submit').attr("disabled", true);
}).blur(function(){
  $('submit').attr("disabled", false);
});

, :)

Answer 3

see this example.

    $('#blurtest').blur(function(){
        $('#bluredText').html($(this).val());
    });
    
    $('#testform').submit(function(e){
        $('#blurtest').trigger('blur');
        $(this).submit();
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
Blured Text: <span id="bluredText"></span>
<form name="testform" id="testform" action="" method="post">
    <label>Enter Text:</label> 
    <input name="blurtest" id="blurtest" value="" />
    <input name="submit" id="submit" value="Submit" type="Submit"/>
</form>

Run code

http://jsfiddle.net/narayand4/xvf2x7ee/22/

I think you can solve your problem this way.