Search code examples
jquerygoogle-chromemodx

Submit input doesn't work in Google Chrome


Line of code $input.submit() didn't work, I want to send the key to enter on input. In Mozilla Firefox, it works, Google Chrome doesn't work.

I work modx minishop2

<div class="number">
     <form method="post" class="ms2_form form-inline" role="form">
           <input type="hidden" name="key" value="[[+key]]" />
           <div class="form-group">
                <span class="minus" id="minus[[+id]]"></span>
                 <input type="text" name="count" value="[[+count]]" max-legth="4" id="count[[+id]]" />

                    <button class="btn btn-default" type="submit" name="ms2_action" value="cart/change"><i class="glyphicon glyphicon-refresh"></i></button>
                    <span class="plus"></span>
                </div>
            </form>
        </div>

jQuery 1.11.1

 $('.minus').click(function () {
    var $input = $(this).parent().find('input');
    var count = parseInt($input.val()) - 1;
    count = count < 1 ? 1 : count;
    $input.val(count);
    $input.change();
    $input.submit();
    return false;
});
$('.plus').click(function () {
    var $input = $(this).parent().find('input');
    $input.val(parseInt($input.val()) + 1);
    $input.change();
    $input.submit();
    return false;
});

alert($input); return null in Google Chrome


Solution

  • Jquery's .submit() can only be attached to <form> elements.
    It takes all the form information and sends it to the specified action attribute, via a HTTP method specified in the method attribute.

    Like this:

    <form action="my-url.html" method="POST">
    

    Therefore, the proposed code might be:

    <form action="my-url.html" method="POST">
        <div class="form-group">
             <span class="minus"></span>
             <input name="count" value="3" max-legth="4" type="text">
             <span class="plus"></span>
        </div>
    </form>
    
    $('.plus').click(function () {
        var $input = $(this).parent().find('input');
        $input.val(parseInt($input.val()) + 1);
        $input.change();
        $input.closest('form').submit();
        return false;
    });