将数据从输入表单传递到Laravel中的ajax

时间:2017-11-01 18:12:18

标签: php jquery ajax laravel

我有一个项目列表和三种类型的付款,我希望提供所有类型的付款并将付款ID发送到ajax但是我只为我的代码所在的所有请求提供id = 1:

@foreach($project->payments as $payment)
    @if($payment->type==1)
        @if(empty($payment->code))
            <input type="hidden"id="payment_id"value="{{$payment->id}}">
            <input type="text" class="form-control" id="paymentCode" name="paymentC">
            {{csrf_field()}}
            <button id="AddCode"  type=submit class="btn btn-info generate-label AddCode">enter</button>
        @else
            {{$payment->code}}
        @endif

     @elseif($payment->type==2)
         @if(empty($payment->code))
             <input type="hidden" id="payment_id" value="{{$payment->id}}">
             <input type="text" class="form-control" name="paymentC" id="paymentCode">
             {{csrf_field()}}
             <button id="AddCode" type="submit" class="btn btn-info generate-label AddCode">enter</button>
         @else
             {{$payment->code}}
         @endif
    @endif
@endforeach

Javascript代码:

$('.AddCode').click (function (event) {
    var payment_id = $('#payment_id').val();
    var paymentCode = $('#paymentCode').val();
    console.log(payment_id);
});

如何解决我的问题,当点击付款按钮打印此ID?

3 个答案:

答案 0 :(得分:1)

您未使用var payment_id = $('#payment_id').val();

定位唯一ID

更改此行的HTML

<button id="AddCode" type="submit" class="btn btn-info generate-label AddCode">enter</button>

<button value="{{$payment->id}}" type="submit" class="btn btn-info generate-label AddCode">enter</button>

JQuery的

$('.AddCode').on("click", function(event){
    var payment_id = $(this).val(); // payment id
});

答案 1 :(得分:0)

对于单个HTML实体,ID应该是唯一的。

代码更新:

{{csrf_field()}}
@foreach($project->payments as $payment)
    @if($payment->type==1)
        @if(empty($payment->code))
            <input type="hidden"id="payment-id-1"value="{{$payment->id}}">
            <input type="text" class="form-control" id="payment-code-1" name="payment_code">
            <button type=submit class="btn btn-info generate-label add-code" data-payment=1>enter</button>
        @else
            {{$payment->code}}
        @endif

    @elseif($payment->type==2)
        @if(empty($payment->code))
            <input type="hidden" id="payment_id_2" value="{{$payment->id}}">
            <input type="text" class="form-control" name="payment_code" id="paymentCode">

             <button type="submit" class="btn btn-info generate-label add-code" data-payment=1>enter</button>
        @else
            {{$payment->code}}
        @endif
    @endif
@endforeach

Javascript代码:

$('.add-code').on("click", function(event){
    var payment_type = $(this).data("payment");
    var payment_id = $('#payment-id-'+payment_type).val();
    var paymentCode = $('#payment-code-'+payment_type).val();
});

试一试。没有测试过。

答案 2 :(得分:0)

试试这个

@foreach($project->payments as $payment)
    @if($payment->type==1)
        @if(empty($payment->code))
            <div>
                <input type="hidden" id="payment_id" value="{{$payment->id}}">
                <input type="text" class="form-control" id="paymentCode" name="paymentC">
                {{csrf_field()}}
                <button id="AddCode" class="btn btn-info generate-label AddCode">enter</button>
            </div>
        @else
            {{$payment->code}}
        @endif

     @elseif($payment->type==2)
         @if(empty($payment->code))
            <div>
                <input type="hidden" id="payment_id" value="{{$payment->id}}">
                <input type="text" class="form-control" name="paymentC" id="paymentCode">
                {{csrf_field()}}
                <button id="AddCode" class="btn btn-info generate-label AddCode">enter</button>
            </div>
         @else
             {{$payment->code}}
         @endif
    @endif
@endforeach

Javascript代码:

$('.AddCode').click (function (event) {
    var payment_id = $(this).closest('div').find("#payment_id").val();
    var paymentCode = $(this).closest('div').find("#paymentCode").val();
    console.log(payment_id);
});