来自 Ajax Get 的 Ajax 帖子


ajax post from ajax get

我正在尝试从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...
});