Przesłanie formularza za pomocą jQuery / Ajax działa tylko co drugi raz
Próbuję przesłać formularz, który zawiera przesłanie pliku przez Ajax / jQuery, przetworzyć formularz za pomocą skryptu PHP i zwrócić wynik w div, w którym pierwotnie znajdował się formularz.
Mój obecny kod formularza to:
<section id="content-right">
<form name="uploader" id="uploader" method="POST" enctype="multipart/form-data">
<input type="hidden" id="MAX_FILE_SIZE" name="MAX_FILE_SIZE" value="10485760" />
<input type="file" name="fileselect" id="fileselect" />
<input type="submit" name="submit" id="submit" value="Upload" />
</form>
</section>
A mój obecny skrypt Ajax / jQuery to:
<script>
$(function() {
$('#uploader').submit(function() {
$(this).ajaxSubmit({
type: $(this).attr('method'),
url: 'upload-song.php',
success: function(response) {
$('#content-right').html(response);
}
});
return false;
});
});
Mój skrypt PHP to „upload-song.php” (szczegóły nie mają znaczenia).
Mam także uruchomiony YUI.Pjax, aby obsługiwać normalne linki nawigacyjne (a href) i ładować te w # content-right (jeśli użytkownik kliknie cokolwiek, chcę załadować go # content-right).
Dzięki tej konfiguracji nawigacja po zwykłych linkach działa doskonale, wszystko ładuje się w # content-right, ale uploader działa tylko co drugi raz.
Na przykład przesyłający załaduje upload-song.php w # content-right i przetworzy wszystko idealnie, a jeśli odejdę od strony i spróbuję przesłać inny element, to nie zadziała, po prostu odświeży stronę (jeśli wstawię action = "upload-song.php" w tagu formularza, załaduje upload-song.php jako pełną stronę, a nie # content-right). Po odświeżeniu strony mogę przesłać inny element i będzie on działać idealnie.
Myślę, że ma to związek z tym, jak dołączam skrypt Ajax do formularza (ponieważ jeśli odświeżę stronę, to działa idealnie), ale nie mam dużego doświadczenia z tymi językami, więc nie jestem pewien jak to naprawić.
Ponadto, jeśli wyłączę YUI.Pjax, naprawi to uploader, ale oczywiście przerwie moje linki, więc szukam obejścia.
Jakieś pomysły?