0

пытаюсь добавить передаваемые данные при отправке формы пост собствено вот форма

<form id="formMenu" action="/admin/menu/menuget/create" method="post">
   <input id="menuget-key_setup" class="name" name="MenuGet[key_setup]" aria-required="true" type="text">
</form>
<a id="secures" class="btn btn-success col-lg-offset-8 col-md-offset-8 col-sm-offset-6" href="#">Сохранить меню</a>

для того что бы исключить веенье говнокода (отсылка формы по ссылке и много других подванивающих моментов) хотелось бы работать с формой через addEventListener вот скрипт отправки

$("#secures").click(function (e) {
    e.preventDefault();
     $('#formMenu').submit();}

пытаюсь получить отправку формы так

var form = document.getElementById('formMenu');
form.addEventListener('submit', function(ev) {
    alert('yes');
    oData = new FormData(form);
    console.log(oData);
    return false;
});

но форма отправляется, alert не выводится что я делаю не так ? Jquery подключено.

5
  • aletr != alert ошибка в обработчике submit прерывает исполнение кода обработчика, но не прерывает отправку формы - посмотрите ошибки в консоли браузера
    – user176262
    12 июн 2017 в 15:24
  • А почему бы для установки обработчика не использовать метод .submit из jQuery, раз уж она всё равно подключена — код будет более единообразен
    – mymedia
    12 июн 2017 в 15:40
  • @Igor от исправления ни чего не изменилось. в код в нес поправку
    – Sergalas
    12 июн 2017 в 15:54
  • @mymedia а как ?
    – Sergalas
    12 июн 2017 в 15:54
  • @Sergalas, имелось ввиду нечто вроде конструкции, которую вы уже употребили в коде: $('#formMenu').submit(function(ev) { ... })
    – mymedia
    12 июн 2017 в 16:09

1 ответ 1

0

Событие формы submit происходит, только когда сам пользователь производит отправку. Вы же пытаетесь отправить форму из кода на JavaScript. В этом случае событие не генерируется, т.к. считается, что программист сам сделает все необходимые проверки перед вызовом метода submit.

Вам же следует добавить кнопку прямо в форму с помощью тега <input type="submit"> и подходящим образом оформить её.

Но если есть маниакальное желание отправлять форму по щелчку ссылкой (надеюсь, на такой сайт я никогда не попаду), придётся дать имя функции — обработчику отправки и вызывать её из обработчика щелчка. А делать обработку отправки формы всё равно придётся, т.к. вашу форму пока можно отправить, нажав в текстовом поле клавишу ВВОДа на клавиатуре.

Пример реализации первого способа.

$('#formMenu').submit(function(ev) {
        alert('yes');
        //oData = new FormData(form);
        //console.log(oData);
        return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<form id="formMenu" action="/admin/menu/menuget/create" method="post">
       <input id="menuget-key_setup" class="name" name="MenuGet[key_setup]" aria-required="true" type="text">
       <input class="btn btn-success" type="submit" value="Сохранить меню">
</form>

1
  • Вы абсолютно правы я же говорю пытаюсь избавиться от говнокода и уже докопался до того что надо отправлять через кнопку. Есть только одно но мне нужен именно FormData надо добаить пару параметнров к post запросу
    – Sergalas
    12 июн 2017 в 18:46

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.