AJAX查询为具有不同ID的

Question

这是在我的报头的多个动力形式，jquery.min.js已经包含：

<script type="text/javascript"> 
//<![CDATA[ 
$(function() { 
    $("form.ajax").submit(function(e) { 
     var $this = $(this); 
     e.preventDefault(); 

     $.ajax({ 
      url: 'index.php', 
      type: 'post', 
      data: $this.serialize(), 
      success: function() { 
       //alert(response); 
      } 
     }) 

     return false; 
    }); 
}); 
//]]> 
</script> 

这是动态地生成的示例表格：

<form id="dash_73" method="post" class="ajax"> 
<fieldset> 
<input type="hidden" name="action" value="ajax_purchase_ticket" /> 
<input type="hidden" name="lottery_id" value="73" /> 
<div class="left1"> 
<button type="submit" name="dash" form="dash_73" id="button_73-1" value="1" class="ticket taken" disabled="disabled">User 1</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-2" value="2" class="ticket taken" disabled="disabled">User 1</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-3" value="3" class="ticket taken" disabled="disabled">User 1</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-4" value="4" class="ticket taken" disabled="disabled">User 1</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-5" value="5" class="ticket free">5 Dash</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-6" value="6" class="ticket taken" disabled="disabled">User 2</button> 
<br /> 
</div> 
<div class="left2"> 
<button type="submit" name="dash" form="dash_73" id="button_73-7" value="7" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-8" value="8" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-9" value="9" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-10" value="10" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-11" value="11" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-12" value="12" class="ticket taken" disabled="disabled">User 2</button> 
<br /> 
</div> 
<div class="left3"> 
<button type="submit" name="dash" form="dash_73" id="button_73-13" value="13" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-14" value="14" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-15" value="15" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-16" value="16" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-17" value="17" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-18" value="18" class="ticket taken" disabled="disabled">User 2</button> 
<br /> 
</div> 
<div class="left4"> 
<button type="submit" name="dash" form="dash_73" id="button_73-19" value="19" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-20" value="20" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-21" value="21" class="ticket taken" disabled="disabled">User 1</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-22" value="22" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-23" value="23" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-24" value="24" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
</div> 
<div class="left5"> 
<button type="submit" name="dash" form="dash_73" id="button_73-25" value="25" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-26" value="26" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-27" value="27" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
<button type="submit" name="dash" form="dash_73" id="button_73-28" value="28" class="ticket yours" disabled="disabled">User 3</button> 
<br /> 
</div> 
</fieldset> 
</form> 

目前当我点击一个按钮购买一张票时，什么都不会发生。我试图让它按下按钮时，它会运行代码。我仍然试图找出如何检索成功或失败的响应方法。任何帮助表示赞赏。

更新：没有Ajax，代码功能根据需要。正如Kevin指出的那样，我认为问题在于按钮值没有被提交，这就是为什么看起来什么都不会发生，因为按钮值是必需的。寻找如何包含按钮值。

UPDATE 2：下面是最终的代码，以及我的成功/失败消息。

<script type="text/javascript"> 
//<![CDATA[ 
$(function() { 
    $('button[name="dash"]').click(function (e) { 
     e.preventDefault(); 
     var id = this.id; 
     var $formElem = $(this).closest('form'); 
     var formData = $formElem.serializeArray(); 
     formData.push({ 
      name: this.name, 
      value: this.value 
     }); 
     // if you want to submit the 'form' attribute of the button as well ... 
     formData.push({ 
      name: 'form', 
      value: $(this).attr('form') 
     }); 
     $.ajax({ 
      url: 'index.php', 
      type: 'post', 
      data: formData, 
      success: function (data) { 
       if (data.completed == 1) 
       { 
        data.message = data.message + '<br />' + data.completed_message; 
       } 

       $("#centerpoint").hide(); 
       $("#centerpoint").show(); 

       if (data.result == 1) 
       { 
        $('#' + id).attr("disabled", "disabled"); 
        $('#' + id).removeClass("free").addClass("yours"); 
        $('#' + id).text(data.buyer); 
        $('#ajax_message').replaceWith('<div class="form_message success" id="ajax_message">' + data.message + '</div>'); 
        $("#centerpoint").delay(5000).slideUp(); 
       } 
       else if (data.result == 2) 
       { 
        $('#' + id).attr("disabled", "disabled"); 
        $('#' + id).removeClass("free").addClass("taken"); 
        $('#' + id).text(data.buyer); 
        $('#ajax_message').replaceWith('<div class="form_message error" id="ajax_message">' + data.message + '</div>'); 
        $("#centerpoint").delay(5000).slideUp(); 
       } 
       else if (data.result == 3) 
       { 
        $('#ajax_message').replaceWith('<div class="form_message error" id="ajax_message">' + data.message + '</div>'); 
        $("#centerpoint").delay(5000).slideUp(); 
       } 
       else 
       { 
        $('#ajax_message').replaceWith('<div class="form_message error" id="ajax_message">Unknown Error!</div>'); 
        $("#centerpoint").delay(5000).slideUp(); 
       } 
      } 
     }) 
     /* should pass this form data: 
      action=ajax_purchase_ticket&lottery_id=73&dash=5&form=dash_73 
     */ 
     return false; 
    }); 
}); 
//]]> 
</script> 

Answer 1

看起来你的形式发布“行动= ajax_purchase_ticket & lottery_id = 73”

确定服务器端脚本是全功能与仅仅是数据量？它可能会期待其中的一个按钮值？

从序列化文档（http://api.jquery.com/serialize/）：

No submit button value is serialized since the form was not submitted using a button.

这里有一个解决方案，您可以尝试包括被点击的按钮值： jQuery serializeArray doesn't include the submit button that was clicked

更新

看看这个做你想做的事：http://jsfiddle.net/kevincollins/VLHCe/

$('button[name="dash"]').click(function (e) { 
    e.preventDefault(); 
    var $formElem = $(this).closest('form'); 
    var formData = $formElem.serializeArray(); 
    formData.push({ 
     name: this.name, 
     value: this.value 
    }); 
    // if you want to submit the 'form' attribute of the button as well ... 
    formData.push({ 
     name: 'form', 
     value: $(this).attr('form') 
    }); 
    $.ajax({ 
     url: 'index.php', 
     type: 'post', 
     data: formData, 
     success: function() { 
      //alert(response); 
     } 
    }) 
    /* should pass this form data: 
     action=ajax_purchase_ticket&lottery_id=73&dash=5&form=dash_73 
    */ 
});