基于选择的Laravel ajax自动填充字段

我正在努力解决一个ajax问题，我试图根据下拉框中的选择自动填充一个金额字段

我的表格布局如下（表格名称为Otheritemsmapping）：

我刀刃上的模型是这样的

<div class="modal fade" id="accountpayModal" tabindex="-1" role="dialog" aria-labelledby="accountpay" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title" id="addaccountModal">Pay from Account of {{$member->first_name}} {{$member->last_name}}</h3>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            {!!Form::open(array('action' => ['AccountController@item'], 'method'=>'POST', 'class'=>'form-horizontal'))!!}
            <div class="modal-body">
                <input type="hidden" name="member" value="{{$member->id}}">
                <label class="label-control">Item:</label>
                <div class="input-group">
                    <div class="form-group">
                        <select type="text" class="selectpicker" data-sytle="select-with-transition" name="item" value="C" id="selectBox">
                            @foreach ($otheritems as $o)
                                <option value ={{$o->item}}>{{$o->item}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <label class="label-control">Amount:</label>
                <div class="form-group">
                    <div class="input-group">
                        <input type="text" class="form-control" name="amount" id="textField">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-round btn-secondary" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-round btn-primary">Save Changes</button>
            </div>
            {!!Form::close()!!}
        </div>
    </div>
</div>

我已将以下内容添加到我的Web.php文件中

Route::get('get/payments/{id}', 'MemberController@getPayments')->name('getPayments');

但是，从下拉菜单（$o->item）中选择项目时，金额字段中不会填充金额

任何帮助都会很好，

---

谢谢你的代码中有一些拼写错误

<script>
   $('#selectBox').change(function() {
       let id = $(this).val();
       let url = '{{ route("getPayments", ":id") }}';
       url = url.replace(':id', id);

       $.ajax({
           url: url,
           type: 'get',
           dataType: 'json',
           success: function(response) {
               if (response != null) {
                   $('#textField').val(response.amount);
               }
           }
       });
   });
</script>

$（'#selectBox'）。更改（函数（）{
设id=$（this.val（）；
让url='{route（“getPayments”，“：id”）}}'；
url=url.replace（':id'，id）；
$.ajax({
url:url，
键入：“get”，
数据类型：“json”，
成功：功能（响应）{
if（响应！=null）{
$（'#textField'）.val（response.amount）；
}
}
});
});

希望这能解决你的问题。如果仍然存在任何问题，请检查浏览器开发人员控制台。让我知道错误，我会为您更新答案

您应该使用id作为选项值，因为id是唯一的

---

这很有效，谢谢你。我不得不对我的控制器做一个小的更改，但这是基于使用$o->id，而不是在值字段中使用$o->item

public function getPayments($id = 0)
{
    $data = Otheritemmapping::where('item', $id)->first();
    return response()->json($data);
}

Route::get('get/payments/{id}', 'MemberController@getPayments')->name('getPayments');

<script>
   $('#selectBox').change(function() {
       let id = $(this).val();
       let url = '{{ route("getPayments", ":id") }}';
       url = url.replace(':id', id);

       $.ajax({
           url: url,
           type: 'get',
           dataType: 'json',
           success: function(response) {
               if (response != null) {
                   $('#textField').val(response.amount);
               }
           }
       });
   });
</script>