jQuery 控件未传递给控制器

Question

我在 jQuery 中将新控件添加到 GET 表单，但是当我提交表单时，值不是请求的一部分。

jQuery 是适合这项工作的工具吗？我需要用 jQuery 提交表单吗？

<form method="post" action="{{ route('product.update', $product->slug) }}">
...
<table id="shopsTable" class="table">
    <tr>
        <th>Winkel</th>
        <th>URL</th>
        <th>Prijs</th>
        <th></th>
        <th></th>
    </tr>
    @foreach($product->shops as $key=>$shop)
    <tr id="row">
        <td><input disabled type="text" class="form-control" name="shop[{{ $key }}][name]" value="{{ $shop->name }}"</td>
        <td><input disabled type="text" class="form-control" name="shop[{{ $key }}][url]" value="{{ $shop->pivot->url }}"/></td>
        <td><input disabled type="number" class="form-control" name="shop[{{ $key }}][price]" value="{{ $shop->pivot->price }}"/></td>
        <td><button type="button" class="btn btn-danger">remove</button></td>
    </tr>
    @endforeach
</table>

<button type="submit" class="btn btn-success">Update product</button>

jQuery

<script type="text/javascript">
$(document).on('click', '.new-shop', function() {

    var row = $('tr[id=row]').length + 1;
    var storeName = $('#new_shop option:selected').text();
    var storeId = $('#new_shop option:selected').val();
    var url = $('#new_shop_url').val();
    var price = $('#new_shop_price').val();

    if (url.length > 0 && price.length > 0) {

        $('#shopsTable').append('<tr id="row">' +
            '<td><input disabled type="text" class="form-control" name="shop['+ row +'][name]" value="'+ storeName +'"</td>' +
            '<td><input disabled type="text" class="form-control" name="shop['+ row +'][url]" value="'+ url +'"/></td>' +
            '<td><input disabled type="number" class="form-control" name="shop['+ row +'][price]" value="'+ price +'"/></td>' +
            '<td><button type="button" class="btn btn-danger">remove</button></td>' +
        '</tr>');

        var store = $('#new_shop').val(1);
        var url = $('#new_shop_url').val('');
        var price = $('#new_shop_price').val('');

    } else {
        console.log('Gelieve alle velden in te vullen');
    }

});
</script>

Answer 1

我删除了“禁用”选项并且它起作用了！