簡體   English   中英

在 Laravel 5.4 中重新加載視圖后如何保留表單中的所有過濾器?

[英]How to preserve all the filters in the form after reloading the view in Laravel 5.4?

我在視圖中有以下表格:

<form class="form-inline" method="POST" action="{{route('dsp.report')}}">
@csrf <!-- {{ csrf_field() }} -->
    <div class="col-sm-2 form-group">
        <label>Range one: </label><input type="text" class="form-control" id="date_from" name="date_from" placeholder="Date from range">
    </div>
    <div class="col-sm-2 form-group">
        <label>Range two: </label><input type="text" class="form-control" id="date_to" name="date_to" placeholder="Date to range">
    </div>
    <div class="col-sm-2 form-group">
        <label>Filter by SSP: </label><select name="ssp_id[]" id="ssp" class="form-control-lg select2" multiple="multiple"></select>
    </div>
    <div class="col-sm-2 form-group">
        <label>Filter by DSP: </label><select name="dsp_id[]" id="dsp" class="form-control-lg select2" multiple="multiple"></select>
    </div>
    <div class="col-sm-2 form-group">
            <label>Group by: </label>
            <select class="form-control" name="groupby">
                <option>SSP/DSP</option>
                <option>SSP</option>
                <option>DSP</option>
            </select>
    </div>
    <button type="submit" class="btn btn-default">Submit</button>
</form>

在 controller 處理請求並返回數據后,我想保留此表單中的所有值:

        return view('dsp.index', $data);

我該怎么做? 有沒有簡單的解決方案?

UPD :為了明確在基於 select2 的多重下拉 ajax 中保留值(不是鍵),選擇:

首先,我們在尋找 SSP 術語時觸發這個 controller:

public function get_ssp(Request $request) {
    $term = $request->get('term');

    $ssp_list = SspCompanyList::where('ssp_company_name', 'LIKE', '%'. $term['term'] .'%')
        ->get(['ssp_company_id as id', 'ssp_company_name as text']);

    return ['results' => $ssp_list];

}

然后我們在提交后處理 controller 中選擇的 id。 Select2 是這樣配置的:

    $(document).ready(function() {
        $('#ssp').select2({
            width: '200px',
            minimumInputLength: 3,
            ajax: {
                url: '{{ route("get_ssp") }}',
                dataType: 'json',
                type: "POST",
                quietMillis: 50,
                data: function (term) {
                    return {
                        term: term
                    };
                },
            },
        });
    });

但問題是 select2 只發送 ssp_id[] 中的 id,而不是鍵值項,並且在發送之前無法從 old() function 中恢復它們作為項目名稱。

UPD2 :我正在嘗試以這種方式解決它:

            <select name="ssp_id[]" id="ssp" class="form-control-lg select2" multiple="multiple">
                @if (is_array(old('ssp_id')))
                    @foreach (old('ssp_id') as $ssp_id)
                        {{ $ssp_name = \App\Models\SspCompanyList::select('ssp_company_name')->where('ssp_company_id', $ssp_id)->first()->ssp_company_name }}
                        <option value="{{ $ssp_name }}" selected="selected">{{ $ssp_name }}</option>
                    @endforeach
                @endif
            </select>

並且在第一次重新加載后它可以工作並保留我需要的 ssp 名稱,但是在第二次嘗試在同一頁面上為 dsp 下面的 select 值並再次提交后,它返回此錯誤:

試圖獲取非對象的屬性“ssp_company_name”(查看:/home/pavel/projects/dsp/resources/views/dsp/index.blade.php)

那么,為什么第一次可以工作而第二次卻不行呢? 對於select2,我們應該以其他方式處理它嗎?

注意:您忘記在select options上添加value屬性

對於普通的輸入字段,您可以使用Laravel 的old('input_name')將舊值傳遞給它

例如:

<input name="input_name" value="{{ old('input_name') }}" />

雖然您的 Select 字段需要每個option標簽上的selected屬性。

例如:

<select class="form-control" name="input_name">
    <option {{ old('input_name') == "SSP/DSP" ? 'selected' : '' }} value="SSP/DSP">SSP/DSP</option>
    <option {{ old('input_name') == "SSP" ? 'selected' : '' }} value="SSP">SSP</option>
    <option {{ old('input_name') == "DSP" ? 'selected' : '' }} value="DSP">DSP</option>
</select>

您的代碼變為:

<form class="form-inline" method="POST" action="{{route('dsp.report')}}">
    @csrf <!-- {{ csrf_field() }} -->
    <div class="col-sm-2 form-group">
        <label>Range one: </label>
        <input type="text" class="form-control" id="date_from" name="date_from" value="{{ old('date_from') }}" placeholder="Date from range">
    </div>
    <div class="col-sm-2 form-group">
        <label>Range two: </label>
        <input type="text" class="form-control" id="date_to" name="date_to" value="{{ old('date_to') }}" placeholder="Date to range">
    </div>
    <div class="col-sm-2 form-group">
        <label>Filter by SSP: </label>
        <select name="ssp_id[]" id="ssp" class="form-control-lg select2" multiple="multiple"><option></option></select>
    </div>
    <div class="col-sm-2 form-group">
        <label>Filter by DSP: </label>
        <select name="dsp_id[]" id="dsp" class="form-control-lg select2" multiple="multiple"><option></option></select>
    </div>
    <div class="col-sm-2 form-group">
        <label>Group by: </label>
        <select class="form-control" name="groupby">
            <option {{ old('groupby') == "SSP/DSP" ? 'selected' : '' }} value="SSP/DSP">SSP/DSP</option>
            <option {{ old('groupby') == "SSP" ? 'selected' : '' }} value="SSP">SSP</option>
            <option {{ old('groupby') == "DSP" ? 'selected' : '' }} value="DSP">DSP</option>
        </select>
    </div>
    <button type="submit" class="btn btn-default">Submit</button>
</form>

您可以通過這種方式添加您的 select2 選定值:

let arrayOfSelectedValues = [] // You can keep your selected values here if you know them already

$('#ssp').select2({
    width: '200px',
    minimumInputLength: 3,
    ajax: {
        url: '{{ route("ssp") }}',
        dataType: 'json',
        type: "POST",
        quietMillis: 50,
        data: function (term) {
            return {
                term: term
            };
        },
    },
}).val(arrayOfSelectedValues).trigger("change"); // Then add the selected values to the select2() initialisation

將屬性添加到所有輸入,如下所示:

<input type="text" name="username" value="{{ old('username') }}">

檢查文檔以更好地理解https://laravel.com/docs/5.4/requests#old-input

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM