Возвращение ответа ajax от django

Question

Я измучил свой мозг, пытаясь получить что-то простое в работе. Я хочу изменить поведение формы из post reload в ajax с помощью django. Я просто не могу заставить его работать.

форма что-то вроде:

<form id="form1" action="/myurl/" method="post" onsubmit="doexchange"> 
<input id="input1" type="hidden" name="serializedData" value=""/> 
<button id="button1" type="submit">render<button/> 
</form> 

Использование JQuery, у меня есть что-то вроде:

function doexchange(){ 
var dataBuffer = new Object(); 
dataBuffer = myCollecter(dataBuffer); 

$("#input1").attr("value", JSON.stringify(dataBuffer)); 

$.get($("#form1").attr("action"), 
     {serializedData: $("#input1").attr("value")}, 
     function(data){ 
     alert('yes' + data); 
     }); 

return false; 
} 

Теперь возвращение ложным, чтобы предотвратить первоначальную форму от делать POST своей собственной.

На стороне сервера, у меня есть что-то очень простое, как:

def handler(request, data): 
    return HttpResponse('{}', 'application/json') 

Клиент успешно отправляет данные на сервер через Ajax запрос. Сервер также возвращает {} пустую скобку клиенту. Но вместо вызова функции callback и просмотра и предупреждения вся страница перезагружается, и я вижу только {} на новой странице.

Как я уже сказал, я пробовал так много разных вещей, но я думаю, что мне не хватает чего-то большого слона ... Любые идеи? О, и я использую последний Mozilla firefox, но я не думаю, что это проблема с браузером ...

Answer 1

Попробуйте привязку к форме submit в вашем javascript.

$('#form1').bind('submit', function(e){ 
    e.preventDefault(); 
    var form=$(this), 
    input=form.find('input[name="serializedData"]'); 
    $.ajax({ 
    // 
    }); 

Answer 2

Я не думаю, что решение должно быть очень запутанным, чтобы достичь результата, который вы собираетесь совершить. Рассмотрим что-то на линии:

страницу, которая выглядит как:

<a class="btn" onclick="doexchange">render</a> 

An JavaScript, который выглядит следующим образом:

function doexchange(){ 
    var dataBuffer = myCollecter(dataBuffer); 

    $.get('/myurl/', {serializedData: JSON.stringify(dataBuffer)}, function(data) { 
     alert('yes' + data); 
    }); 
}