如何将值从表单传递到数据表

Posted 2023-03-14

【中文标题】如何将值从表单传递到数据表

【英文标题】：How to pass values from form to datatables

【发布时间】：2018-04-05 14:54:48

【问题描述】：

我正在玩 laravel 和数据表。 Here 是我想了解的带有过滤选项的表格。 基本上按照示例配置了路由和控制器，但无法通过 ajax 从下面的下拉列表中动态获取值。

<select class="form-control" id="asortment" name="asortment">
<option value="68">A</option>
<option value="5">B</option>
...

负责ajax通信的javascript：

<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script>
<script>
    $(document).ready( function () 
        $('#datatable').DataTable(
            "processing": true,
            "serverSide": true,
            "ajax": 
                url: " route('api.products.index') ",
                data: function (d) 
                    d.product = $('input[name=product]').val();
                    d.fromDate = $('input[name=fromDate]').val();
                    d.toDate = $('input[name=toDate]').val();
                    d.asortment = $('input[name=asortment]').val();
                ,
            ,
            "columns": [
                 "data": "Name", ,
                 "data": "Type" ,
                 "data": "Asortment" ,
                 "data": "Margin" 
            ]
        );
    );

    $('#search-form').on('submit', function(e) 
        oTable.draw();
        e.preventDefault();
    );
</script>

我的 API 控制器如下所示：

class APIController extends Controller

    public function getProducts(Request $request)
    
        $product = $request->input('product');
        $fromDate = $request->input('fromDate');
        $toDate = $request->input('toDate');
        $asortment = $request->input('asortment');

        $query = DB::select('exec test.dbo.Products @startDate = ?, @endDate = ?, @asortment = ?, @produkt = ?', [$fromDate, $toDate, $asortment, $product]);

        return datatables($query)->make(true);
    

问题：Ajax 接受 3 个值（product、fromDate、toDate）但不接受选择形式的分类。

我需要一点帮助来解释为什么...:)

【问题讨论】：

将$('input[name=asortment]').val(); 替换为$("#asortment").val(); 并试一试。

@RutvijKothari 它有效。在我尝试用 select 替换输入之前没有效果。你能简单解释一下为什么它现在是正确的吗？

对不起，我在答案中解释了。评论不是很好的解释方式。

【参考方案1】：

而不是使用 $('input[name=asortment]').val(); 将其更改为 $("#asortment").val();（纯 jQuery 方式！）。

$('input[name=YOUT_NAME]').val();不适用于单选按钮/选择/复选框。

val() 允许您传递元素值的数组。这很有用 在处理包含 、 和 s 等元素的 jQuery 对象时 .在这种情况下，输入和选项的值 匹配数组的元素之一将被检查或选择 而那些具有不匹配的元素之一的值 该数组将被取消选中或取消选中，具体取决于类型。在 属于无线电组的 s 的情况和 s，任何先前选择的元素都将被取消选择。

使用此方法（或使用本机 value 属性）设置值 不会导致 change 事件的调度。因此， 不会执行相关的事件处理程序。如果你想执行 他们，你应该在设置值后调用 .trigger( "change" )。

这在 jQuery 的 documentation 中有所提及。