Question

这是我的情景：我在bootstrap数据表中的列中使用单选按钮，包括另一个部分视图，部分包含此代码：

<input type="radio" name="shipping_address_id" 
       value="{{$shippingAddress->id}}" {!! $shippingAddress->default?'checked="checked"':''!!} />

使用数据表远程加载以这种方式添加它：

 Datatables::of($addresses)
                    ->addColumn('action', function ($shippingAddress) {
                        return view('admin.shippingaddress.partials.actions_invoice', compact('shippingAddress'))->render();
                    })->make(true);

当$ shippingAddress-＆gt;默认为false时，它会像这样呈现：

<input type="radio" name="shipping_address_id" value="8">

当这是真的时，就像这样：

<input type="radio" name="shipping_address_id" value="3" checked="checked" />

但是当我调用dt.reload（）rdb时，即使它包含checked =“checked”，也没有真正检查过。

更新

即使我以这种方式初始化数据表：

addressesDataTable = $('#addressesDataTable').DataTable({
                processing: true,
                serverSide: true,
                searchDelay: 1000,
                ajax: {
                    type: 'GET',
                    url: url.replace('idToReplace', $('#buyerSelect').val()),
                    error: function (a, b, c) {
                        console.log(a);
                        console.log(b);
                        console.log(c);
                    },
                    dataSrc: function (response) {
                        return response.data;
                    }
                },
                columns: [
                    {data: 'name', name: 'countries.name'},
                    {data: 'postal', name: 'shipping_addresses.postal'},
                    {data: 'city', name: 'shipping_address.city'},
                    {data: 'address', name: 'shipping_address.address'},
                    {data: 'default', name: 'shipping_address.default'},
                    {data: 'action', name: 'action', orderable: false, searchable: false}
                ]
            });

即使我重新加载表（我尝试以这种方式使用重载回调函数）：

addressesDataTable.ajax.reload(function(){
                $('input[name=shipping_address_id]:checked').prop("checked", true);
            });

未检查选中的单选按钮。

Answer 1

我怀疑你有一个单选按钮数组和

                $('input[name=shipping_address_id]').prop("checked", true);

正在检查所有这些。如果您有多个具有相同名称的单选按钮，并且所有这些按钮都已选中，则最后一个选中的按钮将显示为已选中，而其他按钮则不会。您可能必须过滤以找到具有正确ID的复选框，然后再检查它。

Answer 2

这个问题就在这一行：

$("input[name=shipping_address_id]").prop("checked", true);

您正在引用所有输入，其名称为shipping_address_id，因此您还要检查名称为{{1}的所有输入}。

如果您只想检查一个输入，那么您可以使用其（唯一）ID /类来引用该输入。

如果输入有id，则使用：

shipping_address_id

如果输入有类，则使用：

$("input#id-of-your-input").prop("checked", true);

注意：如果另一个元素与该输入具有相同的className，那么该元素也将被检查。

祝你好运，一切顺利。

Laravel - Bootstrap Datatable中的单选按钮（yajra）

2 个答案: