Ajax-функция JQuery, вызываемая дважды с одними и теми же данными - PullRequest
Новая
       25

Ajax-функция JQuery, вызываемая дважды с одними и теми же данными

3 голосов
/ 23 сентября 2010

Я создаю очень простую страницу, которая представляет собой список дел.Он принимает входные данные от пользователя через форму для новых задач, отправляет их на сервер, затем получает (почти) те же данные обратно и добавляет их в список.Однако каждый раз, когда предполагается отправка данных на сервер, функция $ .ajax вызывается дважды.

Мои js: 

// todo.js
function onload() {
 $( "#datepicker" ).datepicker();
 $( "#todoform" ).submit(function(e){
  e.preventDefault();
  sendtodo();
  return false;
 });
}
function sendtodo() {
 $.ajax({
  url: '/blog/todo/newtodo/',
  type: "POST",
  success: function(data) {
   receivetodo(data);
  },
  data: ({
   body: $('#newbodytextarea').val(),
   title: $('#titleinput').val(),
   dateDue: $('#datepicker').val(),
   time: $('#timepicker').val(),
   category: $('#newcategory').val()}),
});
}
function receivetodo(data) {
 $('#todobody').append(data);
}

И часть моего HTML: 

<html>
<head>
<title>Todo list</title>
<link href="/django_media/css/todo/todo.style.css" rel="stylesheet" type="text/css">
<link href="/django_media/css/jquery-ui-1.8.5.custom.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="/django_media/js/jquery.js"></script>
<script type="text/javascript" src="/django_media/js/jquery-ui-custom.js"></script>
<script type="text/javascript" src="/django_media/js/todo/todo.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
  onload();
 });
</script>
</head>
<body>
[.................]
</body>
</html>

В случае, если это имеет значение, я использую Django для своего бэкенда.Возвращаемые данные - это <div>, содержащий пару других тегов <div> и некоторые теги <h1> и <p>.Часть кода, которая добавляет полученный HTML-код на страницу, работает нормально, за исключением того, что он добавляет его дважды (а данные действительно находятся в базе данных дважды).

Я пытался использовать $("#todoform").click(function(e){ вместо $("#todoform").submit(function(e){ но это ничего не изменило.Я также убедился, что onload() вызывается только один раз.Почему sendtodo() выполняется дважды?

Если вам нужен какой-либо другой код, я также могу опубликовать его.

Ответы [ 2 ]

6 голосов
/ 22 ноября 2012

Заменить это: 

$( "#todoform" ).submit(function(e)

С этим: 

$( "#todoform" ).unbind('submit').submit(function(e)
1 голос
/ 23 сентября 2010

Вероятно, onload() вызывается дважды, проверьте все вхождения через ваш код. Если вы вызываете .submit() дважды, к событию onsubmit добавляется указанный код, а не заменяется.

Для отладки поместите alert('anything') внутри sendtodo() и проверьте, действительно ли он вызывается дважды при отправке.

Вы также можете сделать: 

$('#todoform').removeAttr('onsubmit').submit( ...

Но было бы лучше выяснить, почему он связан дважды

...