Question

我有一个简单的Crud系统，除了UPDATE部分，我构建的其他所有东西都工作正常。

当您尝试编辑记录时，会弹出一个引导模式，其中包含一个表单，其中记录是用javascript完成的。表单的操作网址也由javascript设置。当我提交时，该模型只是关闭，什么也没发生。

让我们从我的资源路线开始：

Route::resource('buildingimage', 'BuildingImageController');

编辑按钮：

<button
    class="edit-modal btn btn-info"
    data-buildingid="{{$building->id}}"
    data-location="{{$building->location}}"
    data-source="{{$building->source}}"
    data-disc="{{$building->disc}}"
    data-result="{{$building->result}}"
    data-resultPositive="{{$building->result_info_positive}}"
    data-resultNegative="{{$building->result_info_negative}}"
    data-toggle="modal"
    data-target="#edit-building"
>
    <i class="far fa-edit"></i>
    Edit
</button>

我使用所有这些数据属性通过javascript填充编辑表单：

$('#edit-building').on('show.bs.modal', function(e) {
            let editUrl = 'buildingimage/' + $(e.relatedTarget).data('buildingid');
            $('#editBuilding').attr('action', editUrl);

            let location = $(e.relatedTarget).data('location');
            let source = $(e.relatedTarget).data('source');
            let disc = $(e.relatedTarget).data('disc');
            let result = $(e.relatedTarget).data('result');
            let resultPostitive =  $(e.relatedTarget).data('resultPostive');
            let resultNegative = $(e.relatedTarget).data('resultNegative');

            $('input[name=location]').val(location);
            $('input[name=source]').val(source);
            $('select[name=disc]').val(disc);
            $('select[name=result]').val(result);
    });

我的模式中的表格：

{{ Form::open(['id' => 'editBuilding', 'method' => 'PUT']) }}
            <div class="form-group">
                <div class="row">
                    <div class="col-md-3 ">
                        {{ Form::label('location', Lang::get('image_request.execute.building.location')) }}
                        {{ Form::text('location', null, array('class' => 'form-control')) }}
                    </div>
                    <div class="col-md-2 noPaddingLeft">
                        {{ Form::label('source', Lang::get('image_request.execute.building.source')) }}

                    </div>
                    <div class="col-md-2 noPaddingLeft">
                        {{ Form::label('disc', Lang::get('image_request.execute.building.disc')) }}
                        {{ Form::select('disc', ['0' => Lang::get('image_request.execute.building.notdisc'), '1' => Lang::get('image_request.execute.building.disc')], null, ['id' => 'discDropdown', 'class' => 'form-control'])}}
                    </div>
                    <div class="col-md-2 noPaddingLeft">
                        {{ Form::label('result', Lang::get('image_request.execute.building.result')) }}
                        {{ Form::select('result', ['positive' => Lang::get('image_request.execute.building.positive'), 'negative' => Lang::get('image_request.execute.building.negative')], null, ['id' => 'resultDropdown', 'class' => 'form-control'])}}
                    </div>
                    <div class="col-md-2 noPaddingLeft">
                        <div id="resultPositive">
                            {{ Form::label('resultpostitive', Lang::get('image_request.execute.building.resultpositive')) }}
                            {{ Form::select('result_info_positive', ['positive' => Lang::get('image_request.execute.building.positive'), 'negative' => Lang::get('image_request.execute.building.negative')], null, ['id' => 'resultPositiveDropdown', 'class' => 'form-control'])}}
                        </div>
                        <div id="resultNegative">
                            {{ Form::label('resultnegative', Lang::get('image_request.execute.building.resultnegative')) }}
                            {{ Form::select('result_info_negative', ['positive' => Lang::get('image_request.execute.building.positive'), 'negative' => Lang::get('image_request.execute.building.negative')], null, ['id' => 'resultNegativeDropdown', 'class' => 'form-control'])}}
                        </div>
                    </div>
                    <div class="col-md-1 noPaddingLeft">
                        <br>
                        {!! Form::hidden('image_request_id', $imageRequest->id) !!}
                    </div>
                </div>
            </div>
{{ Form::close() }}

现在我不知道为什么不提交表单，实际上关闭模式时什么也没发生。

编辑模式中的提交按钮

我忘了展示如何以模式提交表单：

<button type="submit" form="editBuilding" class="btn btn-primary edit" data-dismiss="modal">
    <span class='glyphicon glyphicon-check'></span> @lang('image_request.execute.building.edit_modal.confirm')
</button>

Answer 1

将表单上的方法类型更改为POST并放入

@method('PUT')

在您的表格内。

Here是这样做的原因

同样在您的JS中，您需要防止模式的默认行为。为此，您可以将其作为第一行放在脚本中。

e.preventDefault();

或return false;结尾。

然后，在修改脚本后，需要在脚本的底部提交表单。

$('#editBuilding').submit();

Laravel 5.6从模型中的表单更新记录未提交

编辑模式中的提交按钮

1 个答案: