submitHandler не определен в HTMLInputElement.onclick - PullRequest
Новая
       19

submitHandler не определен в HTMLInputElement.onclick

0 голосов
/ 02 декабря 2018

мой скрипт работает, но все еще у меня есть эта ошибка submitHandler не определен в HTMLInputElement.onclick

это форма 

<form id="myform" method="get" action="" class="form-inline pt-5 mt-5 mt-md-0">
                    <div class="group mx-auto">
                        <input name="name" id="name" class="form-input" type="text" required>
                        <span class="highlight"></span>
                        <span class="bar"></span>
                        <label class="label">Имя</label>
                    </div>
                    <div class="group mx-auto">
                        <input name="tel" id="tel" class="form-input" type="text" required>
                        <span class="highlight"></span>
                        <span class="bar"></span>
                        <label class="label">Телефон</label>
                    </div>
                    <input type="submit" onclick="submitHandler(myform)" class="btn btn-danger mx-auto submit">
                </form>

и это моепростой скрипт проверки jquery 

$(document).ready(function () {

    $('#myform').validate({
        rules: {
            name: {
                required: true,
            },
            tel: {
                required: true,
            }
        },
        submitHandler:function(form){
            form.submit();
            console.log("----------------------------------");
            console.log($('#name').val());
            console.log($('#tel').val());
            console.log("----------------------------------");
        }
    });

});

Помогите пожалуйста!мне нужно избавиться от этой ошибки

Ответы [ 2 ]

0 голосов
/ 02 декабря 2018

У меня есть эта ошибка submitHandler не определен в HTMLInputElement.onclick

Это потому, что вы пытаетесь использовать встроенный обработчик onclick для вызова функции, встроенной в плагини автоматически обрабатывается плагином .

Вы используете jQuery, что устраняет необходимость в любых встроенных обработчиках;и плагин jQuery Validate автоматически фиксирует нажатие кнопки отправки формы.

REMOVE встроенный обработчик onclick, и все будет работать, как и ожидалось. 

<input type="submit" class="btn btn-danger mx-auto submit">

Рабочая ДЕМО: jsfiddle.net / zt86jwqo

0 голосов
/ 02 декабря 2018

Вы не определили функцию submitHandler (), которую вы вызываете при вводе, нажмите onclick = "submitHandler (myform)".Например, вы можете отправить свою форму на клик, как: 

$('#myform').submit()

полный код: 

<form id="myform" method="get" action="" class="form-inline pt-5 mt-5 mt-md-0">
                    <div class="group mx-auto">
                        <input name="name" id="name" class="form-input" type="text" required>
                        <span class="highlight"></span>
                        <span class="bar"></span>
                        <label class="label">Имя</label>
                    </div>
                    <div class="group mx-auto">
                        <input name="tel" id="tel" class="form-input" type="text" required>
                        <span class="highlight"></span>
                        <span class="bar"></span>
                        <label class="label">Телефон</label>
                    </div>
                    <input type="submit" onclick="$('#myform').submit()" class="btn btn-danger mx-auto submit">
                </form>

<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.0/dist/jquery.validate.js"></script>
<script>
$(document).ready(function () {

    $('#myform').validate({
        rules: {
            name: {
                required: true,
            },
            tel: {
                required: true,
            }
        },
        submitHandler: function(form){
            form.submit();
            console.log("----------------------------------");
            console.log($('#name').val());
            console.log($('#tel').val());
            console.log("----------------------------------");
        }
    });

});
</script>
...