Форма jQuery ajax по-прежнему отправляется с обновлением страницы

#jquery #ajax #forms #refresh

#jquery #ajax #формы #обновить

Вопрос:

У меня есть довольно простой фрагмент кода jQuery AJAX, который должен отправлять форму без обновления страницы, но по какой-то причине он игнорируется, и форма отправляется в обычном режиме.

Код jQuery:

 $(".createEvent").live('click', function() { 

                $(".eventResult").html($("<img/>").attr("src", "<?php echo __FULL_PATH; ?>images/loader.gif").attr("id", "loader"));
                $('.eventResult').show();  
                var form =  $(this).parents('form:first');
                var eventName = $("input[name='eventName']",form).val();
                var eventID = $("input[name='eventName']",form).id();

                  var dataString = 'eventName ='  eventName;  
                  $.ajax({  
                  type: "POST",  
                  url: "{site.createPageURL}" eventID "/event/",  
                  data: dataString,  
                  cache: false,
                  success: function(html) {  
                    alert('done');
                    $('.eventResult').html(html);  
                    $('.eventForm').hide(); 
                    updateBookingList(eventID);             

                  } 
                });  
                return false; 

        });

и форма:

 <form id="eventForm_1318915800" method="POST" action="path_here..." name="eventForm">
<label for="eventName">Please enter a name for the event</label>
<input id="1318915800" type="text" name="eventName">
<label for="submit">amp;nbsp;</label>
<input class="createEvent" type="submit" value="Create event" name="submit">
</form>
<div id="eventResult_1318915800" class="eventResult">amp;nbsp;</div>

Ответ №1:

это указывает на ошибку JS в середине, которая обходит return false

1. Отлично, это именно то, что происходило. Спасибо за совет — я на самом деле не знал, что Firebug может сломаться из-за ошибок Javascript, поэтому в результате я смог подобрать очень полезный метод отладки.

Ответ №2:

Вам нужно будет добавить event.preventDefault(); перед вызовом ajax. Ваша функция должна быть изменена, как показано ниже:

 $(".createEvent").live('click', function(event) { 
     event.preventDefault();
     .
     .
     .
     //ajaxCall
});

Ответ №3:

Если вы хотите остановить отправку формы, вам, вероятно, лучше сделать:

 $("#eventForm_1318915800").submit(function () { return false; });

Это лучше, потому что оно также будет обрабатывать отправку, вызванную, например, клавишей Enter.