Formularz składać dwa razy w Chrome/Safari

Question

szukam do wykonywania podstawowej formie post, ale następujące przekazuje do serwera dwukrotnie w Chrome i Safari (ale zachowuje się zgodnie z oczekiwaniami w Firefoksie):

<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> 

bym lubię używać atrybutu onsubmit do sprawdzania poprawności pól przed przesłaniem, ale jeśli wartość zwracana to true, formularz jest wysyłany dwa razy.

starałem się powiązać obsługi jQuery do formy, ale i tu, gdzie domyślne zachowanie nie jest zabezpieczony, formularz jest przesyłany dwa razy, na przykład:

<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> 

Choć przypuszczam, że coś jest oślepiająco Oczywistym błędem jest świeża para oczu, jestem głęboko zmieszany, dlaczego przesyłanie, z lub bez sprawdzania poprawności, powoduje duplikowanie postu na serwerze w przeglądarce Chrome i Safari. Byłbym wdzięczny za każdy wgląd.

Answer 1

Ten numer jest aktualnie związany z Facebox (http://defunkt.github.com/facebox/). Inicjalizacja Faceboksa powoduje drugi zestaw żądań po wczytaniu strony. Jeśli więc opublikujesz pod numerem /myaction/create, Facebox rozpocznie drugi zestaw żądań z podstawowym adresem URL ustawionym na /myaction/create. Rozwiązaniem jest przekierowanie do adresu URL, który obsługuje żądania pobierania po wykonaniu postu, więc nie kończysz go dwukrotnie. Bardzo dziękuję za pomoc.

Answer 2

Po sygnale możesz spróbować return false; i usunąć event.preventDefault();. Być może potrzebujesz również return true; w swoim drugim zdaniu. Wierzę, że mam to gdzieś działa.

Answer 3

nie jestem w 100% pewien, ale spróbuj to jedno:

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

jeśli to nie zadziała, proszę spojrzeć na

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

To ostrzec wszystkie wydarzenia, które są powiązane z Twoim form. Może jest więcej programów obsługi zdarzeń? W przeciwnym razie również alarm/log

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

i

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

na wszelki wypadek.

Answer 4

OK, nie jestem pewien, ile to pomoże, ale spróbuj usunąć dane do przesłania i przesłać formularz za pomocą javascript. Tak na przykład

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

wówczas zamiast słuchania onSubmit, można spróbować

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

Teraz jesteś tak powinno działać zbyt ... ale w ten sposób można debugować gdzie jesteś problemem jest .... To powinno się składać tylko raz ... Powodzenia!