有没有办法在 Laravel blade 模板中使用 javascript 变量？

Question

我将在 jQuery 中自动创建 table 的行。通过单击 addRow 按钮，函数 addRow() 将执行如下操作：

function addRow(){

  var rowCount = $("table tr").length - 1; 
  var row = '<tr><td><input name=“item[‘+ (rowCount+1) + ']" type="text" value="{{ old(‘item') }}”> @if ($errors->has(‘item’)){{ $errors->first(‘item’) }}@endif<td></tr>' ;

 $("table").append(row);

}

我会调用这个方法5次，它会创建5个名称为item1的输入区。 item2, item3, item4, item5.

在服务器端，我使用 Laravel 5.2 表单请求验证来验证每个输入字段。

但如果验证失败，旧的输入和错误将不会设置为正确的输入字段，因为

我无法将 javascript 变量 rowCount 放入 blade 模板“{{ old(‘item’) }}”。同样是{{ $errors->first(‘item’) }}.

我试着这样写

'value="{{ old('giftValue[' . $rowCount .']') }}">'

还有这个

'value="{{ old('giftValue[' + $rowCount +’]’) }}">'

但不起作用。

有没有人有解决这个问题的好主意？

Answer 1

执行 Ajax 调用以使用 javascript 路由和显示。像这样：

    $.ajax({
              url: '/get-rows',
              data: { code: code }
            })
            .done(function(res) {
                var response = $.parseJSON(res);
                console.log(response);
                 var $id = $('<input type=hidden name=id />').val(res.id);
                 var $email = $('<input type=hidden name=email />').val(res.email);

            $('form[name="rows"]').append($id).append($email).submit();
            })
            .fail(function(err) {
              console.log('Error: ' + err.status);
        });

Answer 2

我会将输入创建为输入数组：

function addRow(){    
  var rowCount = $("table tr").length - 1; 
  var row = '<tr><td><input name=“items[]" type="text"></td></tr>';

  $("table").append(row);   
}

这可以在后端轻松验证。而且你不应该向 JS 添加服务器端代码，因为它不会工作。

在您看来，检查 old 值是否存在，因此运行循环将 items 添加回来。

@if(old('items'))
    @for($i=0;$i<=count(old('items'));$i++)
        <tr><td><input name=“items[]" type="text" value="old('items')[$i]"></td></tr>
    @endforeach
@endif

Answer 3

不确定这是否是正确的方法，但您可以尝试将错误和旧输入存储在变量中并使用它。

示例如下：

function addRow(){

  var errors = {
    item1:{{$errors->first('item1')}},
    item2:{{$errors->first('item2')}},
    item3:{{$errors->first('item3')}},
    item4:{{$errors->first('item4')}},
    item5:{{$errors->first('item5')}}
  }
  var rowCount = $("table tr").length - 1; 
  var row = '<tr>
                <td>
                    <input name=“item[‘+ (rowCount+1) + ']" type="text" value="{{ old(‘item') }}”> 
                    '+errors["item"+(rowCount+1)]+'
                </td>
            </tr>' ;

 $("table").append(row);

}

Answer 4

谢谢大家回答我的问题，但是没有答案可以同时解决旧值和验证错误的问题。

最后，我写了JS代码，我也写了一个服务器端代码，几乎和JS一样。正如 Mina Abadir 所说，我不应该向 JS 添加服务器端代码。

如果验证失败，我只在服务器端代码中渲染旧值和验证错误，这样，最困难的部分是我必须使用 Validator::make 将每个错误添加到一个variable($items[$key]['oldvalue'] and $items[$key]['error'])，会在服务端代码中显示。

服务器端代码如：

@if(validation_failed) {
     <input name="item[{{ $key }}]" type="text" value="{{ $items[$key]['oldvalue'] }}">
     @if (!empty($items[$key]['error']))<p class="formTable_error">{{ $items[$key]['error'] }}</p>@endif
}

有没有办法在 Laravel blade 模板中使用 javascript 变量？

Is there a way to use javascript variable inside Laravel blade template?

jquery

laravel

laravel-5

laravel-blade