Как определить, как форма была отправлена ​​через JavaScript? - PullRequest
Новая
       6

Как определить, как форма была отправлена ​​через JavaScript?

3 голосов
/ 20 июля 2011

У меня есть форма с несколькими кнопками отправки, и я слушаю событие «отправить» через JavaScript.Я хочу знать, какая кнопка отправки или поле формы (если пользователь нажал «Enter / Return») запустила событие отправки.Есть ли способ получить элемент HTML, на котором пользователь щелкнул или нажал «Enter / Return»?

Обновить, поскольку люди меня не понимают:

Это с помощью JavaScript перед отправкой формы.Обнаружение на стороне сервера не допускается.Мне также нужно обработать форму, отправляемую через пользователя, нажав Enter или Return.

Код 

<form action="" method="POST">
    <input type="text" name="first_name">
    <input type="text" name="item">
    <input type="submit" value="Add item">
    <input type="submit" value="Submit">
</form>

Нажав «Добавить элемент» или нажав Return / Enter внутриname = "item" добавит еще одно поле формы.

Заключительное примечание

Насколько я могу судить, нет способа определить, какое поле формы вызвалоотправка формы.Если вам нужно запретить отправку формы с несколькими кнопками и / или вводом / возвратом, вам необходимо использоватьи связать обработчики событий с полями формы, с которых вы хотите прекратить отправку формы.

Ответы [ 4 ]

4 голосов
/ 20 июля 2011

Если у вас несколько кнопок отправки, вы можете определить, назначив каждому из них уникальный атрибут имени, например: 

<input type="submit" name="submit1" value="Submit 1"/>
<input type="submit" name="submit2" value="Submit 2"/>
<input type="submit" name="submit3" value="Submit 3"/>

Тот, который находится в фокусе, отправляется вместе с отправкой формы, поэтому, если вы нажмете тот, который имеет имя «submit2», он появится в форме POST (или GET). Если нажата клавиша enter, первая кнопка в источнике (в данном случае submit1) считается кнопкой по умолчанию и отправляется вместе. Вы можете настроить его на отображение: ни одного, чтобы использовать его в качестве фиктивного для определения, была ли нажата кнопка ввода, против фактического нажатия кнопки отправки.

EDIT:

В ответ на ваши комментарии, чтобы зафиксировать нажатие клавиши ввода в определенных элементах, вы можете сделать это с помощью jQuery.

Обратите внимание, вам нужно будет указать атрибуты id first_name и add_item и превратить add_item в type = "button" вместо type = "submit".

HTML: 

<form action="" method="POST">
    <input type="text" name="first_name"/>
    <input type="text" id="item" name="item"/>
    <input type="button" id="add_item" value="Add item"/>
    <input type="submit" value="Submit"/>
</form>

JS: 

$("#item").keydown(function(event){
    if(event.keyCode == 13) {
        addFields();

        event.preventDefault();
        event.stopPropagation();
    }
});

$("#add_item").click(function(event) {
    addFields();
});
2 голосов
/ 20 июля 2011

Вы можете установить событие onclick для каждого интересующего вас элемента и вызвать функцию javascript с другим параметром для каждого элемента, по которому вы щелкнули.

Из этой функции вы отправляете идендификатор кнопки на сторону сервера в качестве параметра

1 голос
/ 20 июля 2011

Просто поместите другое имя в каждую кнопку отправки, в зависимости от того, какая кнопка была нажата, она будет отправлена ​​(то есть ее пара имя / значение) вместе с формой.Формы работали так с начала (WWW) времени.

Если форма передается нажатием клавиши ввода или другого нажатия, нет будет отправлена ​​первая пара имя / значение кнопки отправки.

Редактировать

Перечитав свой вопрос, вы можете определить, как форма была отправлена ​​до ее отправки.Прослушиватель кликов в форме может запомнить последнюю нажатую кнопку отправки, но в Firefox нажатие клавиши ввода во входном сигнале отправляет поддельный щелчок по первой кнопке отправки, поэтому вы не можете ее обнаружить.

Я думаю, что вы не можете сделать это надежно, кроме как с помощью основного метода, предложенного выше, или скрытой кнопки отправки Джордана.Если вы скажете , почему вам нужно сделать это, возможно, вам может быть предоставлена ​​дополнительная помощь.

0 голосов
/ 20 июля 2011

вот вариант, если вы не возражаете против использования jQuery:

пример: http://jsfiddle.net/U4Tpw/

используйте что-то вроде 

$('form').submit(function() {
    // identify the form by getting the id attribute
    handleWhichForm($(this).attr('id'));
});
...