форма теряет способность посылать запросы POST через 2 АЯКС обновления

Question

У меня есть форма включаемый объекта:

<form method="post" class="object_form" id="event-core-form" action="{% url save_event_core_data event.id %}" enctype="multipart/form-data"> 
    {{ form.as_p }} 
    <p> 
     <input class="object-submit" id="object-data-save" type="submit" value="Save data"> 
    </p> 
</form> 

После нажатия «Отправить» кнопку Я бегу этот сценарий, который отправляет свою форму через AJAX, данные обновления и должны возвратить обновленную форму, которая будет вставлена ​​обратно в этом месте:

$("#object-data-save").livequery("click", function(e) { 
    e.preventDefault(); 
    $(this).parents("form:first").ajaxSubmit({ 
     data: {"action": action}, 
     "success": function(data) { 
      data = JSON.parse(data); 
      $("#core-data").html(data["html"]); 
      $("#message").show(); 
      $("#message").fadeIn(400).html('<span>'+data["message"]+'</span>'); 
      setTimeout(function(){ 
       $("#message").fadeOut("slow", function() { 
        $("#message").hide(); 
       }); 

      }, 1500);     
     } 
    }); 
    return false; 
}); 

и это выполняет следующую функцию:

def event_core_data(request, event_id): 
    template_name="management/core_event.html"  
    event = Event.objects.get(pk=event_id) 
    form = EventForm() 

    if request.method == "POST": 
     form = EventForm(instance=event, data=request.POST) 
     message = _("Error saving data") 
     if form.is_valid(): 
      form.save() 
      message = _(u"Data saved.") 

     html = render_to_string(template_name, RequestContext(request, { 
      "form" : form, 
      "event" : event, 
     })) 

     result = simplejson.dumps({ 
      "html" : html, 
      "message" : message, 
     }, cls = LazyEncoder) 

     result = HttpResponse(result) 
     logging.debug(result) 
    else: 
     form = EventForm(instance=event) 
     result = "" 
     try: 
      result = render_to_string(template_name, RequestContext(request, { 
       "form" : form, 
       "event" : event, 
      })) 
     except: 
      pass 

    return result 

После того, как вы сохранили его, все будет работать так, как ожидалось. Но после третьего обновления моя форма не вставлена ​​в родительский шаблон. Вместо этого я перенаправлен на URL-адрес функции редактирования, и форма отображается как необработанный html. Кроме того, я заметил в firebug, что когда меня перенаправляют - POST не отправляется, а манекен «alert» в моем javascript не запускается. Это функция отображения начального состояния (если это какой-либо помощи):

def manage_event(request, event_id,): 
    template_name = 'management/edit_event.html' 

    try: 
     event = Event.objects.get(pk=event_id) 
    except DoesNotExist: 
     url = reverse("manage_events") 
     return HttpResponseRedirect(url) 

    return render_to_response(template_name, RequestContext(request, { 
     "core_data" : event_core_data(request, event_id), 
     "event" : event, 
    })) 

---

EDIT

Вот тест ссылку на этот проект, где вы можете увидеть, что происходит. 'event_core_data' возвращает request.POST для консоли при успешном обновлении.

http://ntt.vipserv.org/manage/events/2

Я также задаюсь вопросом, почему мои выбора даты виджеты исчезают после представления. Связаны ли эти вещи вместе?

---

EDIT 2

Я уже пробовал использовать .post или .ajax вместо .ajaxSubmit, но без удачи.

Answer 1

Прежде всего, вы делаете что-то немного странное. Вы используете jQuery-плагин, который должен обрабатывать отправку формы через ajax и повторно заполнять поля. Тем не менее, с успехом вы заменяете HTML-код своей формы на HTML с сервера, отрицая его работу.

Это разбивает ваши календари/виджеты времени, когда вы инициализируете виджеты при загрузке страницы, сообщая им действовать с некоторыми элементами страницы, которые вы позже замените.

Но это само по себе не нарушает форму представления.

Во-первых, вам не нужен плагин для добавления событий «вживую», если вы перестанете заменять форму HTML. Во-вторых, вам действительно не нужен плагин для этого, так как кажется, что встроенный метод live() в jQuery должен выполнять задание (то есть, если вам действительно нужна эта функциональность). В-третьих, если вы используете плагины, и они, похоже, не работают должным образом, обновите их до последней версии. Используемая версия не поддерживает метод html() в jQuery.

Livequery-plugin делает свою магию, переопределяя любые jQuery-методы, которые могут обновлять DOM. Поэтому, когда программист звонит, f.ex, append(), он перехватывает вызов, вызывает для вас append(), а затем проверяет документ для новых или исчезнувших элементов, соответствующих вашему предоставленному селектору. Версия, которую вы используете, не знает о html() и поэтому не перехватывает ее.

Таким образом, он работает в первый раз, когда вы инициируете DOM-проверку загрузки страницы. Когда этот результат будет возвращен, событие фактически привязано к новой кнопке отправки, потому что вызовы html() для установки новой формы и сообщения завершения - внутренне вызовы перехватывают методы. Поэтому второе представление работает по желанию. Но когда возвращается второй вызов, кеш jQuery используется внутренне, не вызывая перехваченных методов. Таким образом, событие не привязывается к кнопке отправки, что делает его действующей в качестве кнопки отправки обычной формы.

Чтобы исправить, прекратите использование подключения в реальном времени для прослушивания событий, если нет необходимости в ней. Если есть, используйте встроенный или, по крайней мере, обновите плагин livequery. Кроме того, не заменяйте всю форму HTML. Опять же, если есть неочевидная причина, повторно инициализируйте свой виджет календаря каждый раз после установки HTML.