我正在尝试从ajax get在ajax上发布。这是我正在使用的下面代码:
$(window).load(function() {
$.ajax({
url: "/masterScreen/ajaxdealerpaid/{{$id}}",
type: "GET",
data: {},
success: function(data) {
document.getElementById("dealerPaid").innerHTML=data;
}
});
});
然后我正在尝试:
$(".pay").click(function(){
alert('Order #'+id+' has been marked as paid for '+amountPaid+'');
var id = $(this).attr('data-id');
var amountPaid = $("#payAmount_"+id).val()
$.ajax({
url: "/masterScreen/dealermarkpaid/"+id+"/"+amountPaid,
type: "POST",
data: {},
success: function(data) {
alert('Order #'+id+' has been marked as paid for '+amountPaid+'');
location.reload();
}
});
});
我的 HTML 是...
<table style="width: auto;" class="table table-striped table-condensed" border="0" cellspacing="0" cellpadding="0">
<thead class="navbar-static-top" style="display:block; margin:0px; cell-spacing:0px; left:0px;">
<tr>
<th class="span2">Quote ID</th>
<th class="span4">Customer name</th>
<th class="span4">Connection date</th>
<th class="span4">BDM</th>
<th class="span4">Owed</th>
<th class="span4">Amount</th>
<th class="span2"></th>
</tr>
</thead>
<tbody id="dealerUnpaid" style="display:block; overflow:auto; max-height:400px;">
</tbody>
<tfoot id="dealerUnpaidtot" class="navbar-static-top" style="display:block; margin:0px; cell-spacing:0px; left:0px; font-weight: bold;">
</tfoot>
</table>
它显示了来自第一个 javascript 的数据,但我也有来自它的 GET 视图的这段代码......
<td class="span4"><input type="text" placeholder="Enter Amount" class="payAmount" data=name="amount" data-id="{{$unpaid->id}}" id="payAmount_{{$unpaid->id}}"></td>
<td class="span2"><input type="button" class="btn pay" value="Pay" data-id="{{$unpaid->id}}"></td>
当我按下付款按钮时,它什么也没做:/
请帮助完成这项工作。
谢谢大家
如果我理解正确,您正在使用 AJAX 加载标记(包括 .pay 元素),然后尝试将某些内容绑定到 .pay 元素的点击事件。 由于执行绑定时页面中不存在 .pay 元素,因此绑定不起作用。 将绑定从:
$('.pay').click(function(){
自
$(window).on('click', '.pay', function(){
这会将绑定附加到窗口,这甚至可以在加载窗口后添加的元素上起作用。
$(".pay").click(function(){...
仅适用于已经创建的具有类工资的元素,它不适用于通过 ajax 调用新创建的元素。您可以使用委托函数来处理新创建的元素
$("body").delegate(".pay","click",function(event){
event.preventDefault(); // prevent default handlings
alert("Test");
//do other code...
});