【问题标题】:Remember dropdown and Validate fields in datable记住数据表中的下拉菜单和验证字段
【发布时间】:2016-01-06 11:30:00
【问题描述】:

第一个疑问是当我需要返回浏览器时如何记住选定的下拉菜单?我有几个字段,我输入了所需的数据并选择了所有下拉列表。如果有一些错误,重定向到具有特定错误的同一页面并且所有字段都已完成,但下拉列表没有,我必须再次选择。很烦。。 我正在将 Laravel 与 Blade 一起使用。我选择的一个例子是下一个:

<div class="form-group">
            <label class="col-md-3 control-label" for="country_id"> {{{ trans('provider.countries') }}} <span class="required">*</span></label>
            <div class="col-md-6">
                <div class="input-group btn-group">
                    <span class="input-group-addon">
                        <i class="fa fa-th-list"></i>
                    </span>
                    {!! Form::select('country_id', $countries, old('country_id'), array('class' => 'form-control', 'required', 'id' => 'select_country', 'placeholder'=>'Seleccione un País', 'autocomplete'=>'off')) !!}
                </div>
            </div>
        </div>

另一方面,我得到了一个包含 4 列的数据表,1 列带有选择,2 列带有输入数字。当我添加第一行时,字段验证工作正常,但是当我添加多行时,此验证不起作用.. 代码是下一个

<div class="table-responsive table-striped table-bordered table-condensed">
    <table class="table table-receipts invoice-items" id="receipt-table">
      <thead>
        <tr class="h5 text-dark">
          <th id="cell-item" class="text-weight-semibold vertical-center">Producto</th>
          <th id="cell-store" class="text-center text-weight-semibold absolute-center">Sucursal</th>
          <th id="cell-price" class="text-center text-weight-semibold absolute-center">Precio Unitario</th>
          <th id="cell-qty" class="text-center text-weight-semibold absolute-center">Cantidad</th>
          <th id="cell-delete" class="text-center text-weight-semibold absolute-center">Acciones</th>
        </tr>
      </thead>
      <tbody>
        <tr class="hide default-row-product">
          <td class="col-md-4 text-weight-semibold text-dark vertical-center">
            <input type="hidden" name="products[]">
          </td>
          <td class="col-md-2 text-center">
            {!! Form::select('stores[]', $stores, '', array('class' => 'form-control', 'required', 'placeholder'=>'Seleccionar', 'id'=>'stores_id')) !!}
          </td>
          <td class="col-md-1 text-center">
            <input type="number" name="prices[]" class="form-control" min="1" step="0.1" id="prices_id" required>
          </td>
          <td class="col-md-1 text-center">
            <input type="number" name="quantities[]" class="form-control" min="1" step="0.1" id="quantities_id" required>
            <td class="col-md-1 text-center">
              <button type="button" class="mb-xs mt-xs mr-xs btn btn-xs btn-danger" id="button-delete-product"><i class="fa fa-trash"></i></button>
            </td>
          </tr>
        </tbody>
      </table>
    </div>

问候!

【问题讨论】:

    标签: jquery laravel datatable blade dropdown


    【解决方案1】:

    第一个问题的答案: 您必须将所选选项存储在本地存储或 cookie 中:

    // store value in local storage
    $('select[name="country_id"]').change(function() {
        localStorage.setItem('selected', this.value);
    });
    
    // restore selected value from local storage after page was loaded
    if(localStorage.getItem('selected')){
        $('select[name="country_id"]').val(localStorage.getItem('selected'));
    }
    

    或者你可以使用会话。在验证数据后的控制器中,将所选选项放入会话中。

    if($validator->fails) {
        return Redirect:to('/form')->with('selected', Input::get('question_id');
    }
    

    并在视图中使用 jQuery:

    @if(Session::has('selected')
    $(document).ready(function() {
       $('select[name="country_id"]').val("{{ Session::get('selected') }}");
    });
    @endif    
    

    编辑: 验证输入数组(价格):

    $prices = Input::get('prices');
    // create array for each price input
    for($i = 0; $i <= count($prices); $i++){
        $rules['prices.' . $i] = 'required|numeric|between:0,100'; 
    }
    
    $validator = Validator::make($prices, $rules);
    

    【讨论】:

    • 您好,感谢您的回复。稍后我会尝试您的代码。查看数据表 tbody,每个字段都需要有值的间隔。当我添加第二 n 行时,此验证不起作用。我确认表单,重定向页面,然后向我显示请求的错误验证。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-08-22
    • 2012-07-21
    相关资源
    最近更新 更多