Javascript / JQuery POST "url" не определено (не определено) - PullRequest
Новая
       29

Javascript / JQuery POST "url" не определено (не определено)

0 голосов
/ 03 мая 2011

Я прикрепил событие onlcick к кнопке отправки формы, чтобы переопределить запрос POST по умолчанию, но у меня возникли некоторые проблемы с его выполнением.

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

Этот код работал в моем статическом примере, но то, что я сделал после его интеграции, сломало его. 

function cartSubmit(addbtn)
{
var form = addbtn.parentNode.parentNode.parentNode; 
var formData = jQuery(form).serializeArray();
jQuery.post("/myurl/", formData, function(r){
jQuery.colorbox({html:'<div style="padding:10px;"><h2>Product added to cart.</h2></div>'});        
 });
 return false;
}

Теперь я получаю сообщение об ошибке в консоли: «POST» http://localhost/myurl/" undefined (undefined), тогда форма отправляется нормально (обновляет страницу), но, похоже, также отправляет с javascript, поскольку она добавляет товар в корзину дважды.

В любом случае, любая помощь очень ценится!

Ответы [ 2 ]

2 голосов
/ 03 мая 2011

Вы можете попробовать связать эту функцию с формой через событие submit, например, при условии, что ваша форма имеет идентификатор myform, добавьте следующее в ваш документ готовым, и вам больше не понадобится атрибут onclick вашей кнопки submit: 

<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js" type="text/javascript"></script>
  </head>
  <body>
    <form id="someform-123" method="post">
      <input type="text" id="field1" />
      <input type="submit" class="add_to_cart" value="Add" />
    </form>
    <hr>
    <form id="someform-789" method="post">
      <input type="text" id="field2" />
      <input type="submit" class="add_to_cart" value="Add" />
    </form>

    <script type="text/javascript">
      $('.add_to_cart').closest('form').submit(function(e) {
        e.preventDefault();
        alert('form id: ' + $(this).closest('form').attr('id'));
      });
    </script>
  </body>
</html>
0 голосов
/ 11 мая 2011

У меня была та же проблема, прерванный запрос AJAX. Я исправил это с помощью возврата false на мою кнопку. Если у вас есть (например): 

<form method="post" action="">
Name: <input type="text" name="whatever" id="whatever" />
<input type="submit" id="join" value="Join" />
</form>

И 

$("#join").click(function(){
  $.ajax({
    url: 'whatever.php',
    type: 'POST',
    data: 'name=' + $("#join").val(),
    success: function(r){ alert(r); }
  });
});

Это будет иметь ABORT на what.php. Чтобы исправить это, отмените отправку формы, добавив возврат на кнопку: 

$("#join").click(function(){
  $.ajax({
    url: 'whatever.php',
    type: 'POST',
    data: 'name=' + $("#join").val(),
    success: function(r){ alert(r); }
  });
  return false;
});
...