Форма представлена ​​дважды в Chrome / Safari

Question

Я пытаюсь выполнить базовую форму публикации, но следующая информация отправляется на сервер дважды в Chrome и Safari (но ведет себя так, как ожидается в Firefox):

<form id="create-deck-form" action="/decks/create" method="post">
  <fieldset>
    <legend>Create new deck</legend>
    <label for="deck-name-field">Name</label>
    <input id="deck-name-field" name="deck-name-field" type="text" value="" maxlength="140" />

    <label for="tag-field">Tags</label>
    <input id="tag-field" name="tag-field" type="text" value="" maxlength="140" />

    <input class="add-button" type="submit" value="Create" />
  </fieldset>
</form>

Я хотел бы использовать *Атрибут 1004 * для проверки полей перед отправкой, но там, где возвращаемое значение равно true, форма отправляется дважды.

Я пытался привязать к форме обработчик jQuery, но и здесьгде поведение по умолчанию не предотвращается, форма отправляется дважды, например:

<script type="text/javascript">
 $(document).ready(function() {
     $("#create-deck-form").submit(function(event){
          if($("#deck-name-field").val() == "") {
            event.preventDefault();
            alert("deck name required");
          }
        });
 });
</script>

Хотя я полагаю, что здесь есть что-то ослепительно очевидное неправильно для новой пары глаз, я глубоко смущен, почему представлениеили без проверки, делает копию сообщения на сервере в Chrome и Safari.Я был бы благодарен за любую информацию.

Answer 1

Эта проблема фактически связана с Facebox (http://defunkt.github.com/facebox/). Инициализация Facebox вызывает второй набор запросов после загрузки вашей страницы. Поэтому, если вы отправляете сообщение на /myaction/create, Facebox запустит второй набор запросов сдля базового URL-адреса установлено значение /myaction/create. Исправление заключается в перенаправлении на URL-адрес, который обрабатывает запросы, полученные после публикации, чтобы вы не заканчивали выполнение сообщения дважды. Большое спасибо за вашу помощь.

Answer 2

Я не уверен на 100%, но, пожалуйста, попробуйте это:

<script type="text/javascript">
   $(document).ready(function() {
      $("#create-deck-form").submit(function(event){
         if(!$("#deck-name-field").val().length) {
           return false;
         }
       });
   });
</script>

, если это не работает, пожалуйста, посмотрите на

for(e in $("#create-deck-form").data('events'))
    alert(e);

Это предупредит васвсе события, которые связаны с вашим form.Может быть, есть еще обработчики событий?В противном случае также предупреждение / журнал

$("#create-deck-form").attr('onclick')

и

$("#create-deck-form").attr('onsubmit')

на всякий случай.

Answer 3

Хорошо, не уверен, насколько это поможет, но попробуйте удалить входные данные и отправить форму через javascript.Например,

<input id="submit-button" class="add-button" type="button" value="Create" />

Тогда вместо прослушивания onsubmit вы можете попробовать

$('#submit-button').click(function(evt) {
    if(validationSuccess(...)) {
        $("#create-deck-form").submit();
    } else {
        //display whatever
    }
});

Теперь вы тоже должны работать ... но таким образом вы можете отлаживать гдеВы проблема ... Это должно быть отправлено только один раз ... удачи!

Answer 4

Можете ли вы попробовать return false; после оповещения и удалить event.preventDefault();. Может быть, вам также нужно return true; в вашем предложении else. Я полагаю, что где-то это работает.