0
私は作業中のLaravelのプロジェクトを持っていますが、一部はモーダルでフォームを送信する必要があります。問題は私がAJAXに慣れていないことです私は問題を抱えています。ここで AJAX - ポストテーブルの行と個別の入力
はモーダル内容です：あなたは少し低く見ることができるように<table>
<tr>
<td>
{{ csrf_field() }}
<select name="payer_id" class="js-basic-single payer_id" style="width:100%;" id="payer_id">
<option></option>
@foreach($customers as $customer)
<option value="{{ $customer->id }}">{{ $customer->customer_name }}</option>
@endforeach
</select>
<div id="existing_biller_details" class="hidden" name="existing_biller_details" style="margin-top:10px;">
</div>
<select class="form-control deposit_type" name="deposit_type" id="deposit_type">
<option disabled selected>Please Select</option>
<option value="Check">Check</option>
<option value="Cash">Cash</option>
<option value="ECheck">ECheck</option>
</select>
<div name="check_number" id="check_number" class="hidden">
<input type="text" placeholder="Check Number" class="form-control" id="check_number" name="check_number">
</div>
<input type="text" class="form-control" placeholder="Payment Amount" name="payment_amount" id="payment_amount">
<input type="date" class="form-control" placeholder="Date of Deposit" name="date_deposit" id="date_deposit">
<textarea placeholder="Notes" style="width:100%;" class="form-control" id="notes" name="notes"></textarea>
</td><td style="width:50%;">
<table style="width:100%;" id="freight_bill_items">
<thead>
<td style="width:30%;font-weight:bold;text-align:center;">Bill No.</td><td style="width:30%; font-weight:bold; text-align:center;">Amount</td>
</thead>
<tbody>
<tr style="height:40px">
<td style="width:30%;text-align:center;"><input type="text" name="payment_details[shipment_id][]" required class="form-control name_list" id="shipment_id" placeholder="Bill No." required></td><td style="width:30%;text-align:center;"><input type="text" name="payment_details[amount][]" required class="form-control name_list" id="amount" placeholder="Amount" required>
</td><td><button type="button" name="add" id="add" class="btn btn-success">Add More</button></td>
</tr>
</tbody>
</table>
<div id="freight_bill_items_subtotal;" style="font-weight:bold; padding-top:10px; padding-bottom:10px; text-align:left; background-color: #f0f8ff;">
SUBTOTAL:
<input type="text" readonly name="freightBillSubtotal" id="freightBillSubtotal" class="form-control total_field" style="display:inline;" value="0.00">
</div>
</td>
</tr>
</table>
は、テーブルでのみTBODY行で、「freight_bill_items」と呼ばれるdiv要素があり、2つの文字入力と同じ正確な入力を持つ別のテーブル行を追加するボタン。
今ここで、現時点では私のAjaxのスクリプトです：
<script type="text/javascript">
$(document).on('click', '.createPayment', function() {
$('.modal-title').text('Record New Payment');
$('#payment').modal('show');
});
$('.modal-footer').on('click', '.add_payment', function() {
//START
var payment_details = [];
//END
$.ajax({
type:'POST',
url: '/payments/createNew',
data: {
payer_id: $('input[name=payer_id]').val(),
notes: $('input[name=notes]').val(),
payment_amount: $('input[name=payment_amount]').val(),
date_deposit: $('input[name=date_deposit]').val(),
check_number: $('input[name=check_number]').val(),
deposit_type: $('input[name=deposit_type]').val(),
payment_details:payment_details, //LOOKING FOR ASSISTANCE HERE//
_token: $('input[name=_token]').val(),
},
success: function(data) {
$('.errorTitle').addClass('hidden');
$('.errorContent').addClass('hidden');
if ((data.errors)) {
setTimeout(function() {
$('#payment').modal('show');
toastr.error('Validation error - Check your inputs!', 'Error Alert', {timeOut: 5000});
}, 500);
if (data.errors.title) {
$('.errorTitle').removeClass('hidden');
$('.errorTitle').text(data.errors.title);
}
if (data.errors.content) {
$('.errorContent').removeClass('hidden');
$('.errorContent').text(data.errors.content);
}
} else {
toastr.success('Successfully recorded Payment!', 'Success Alert', {timeOut: 5000});
}
},
});
});
</script>
は、今、私が上でこだわっている私は他の値と一緒に投稿する配列にこれらの行とその入力内容を渡す行う方法ですか？