Question

我创建了一个数据表，我想为url添加过滤器选项，这是我的代码

jQuery(document).ready(function() {
 oTable = jQuery('#vV7SyzDr').dataTable({
    "sPaginationType": "full_numbers",
    "bProcessing": true,
    "sAjaxSource": "my_url",
    "bServerSide": true,
    "fnServerParams":function ( aoData ) {
        $("select[name=label]").change(function () {
           var labels = $("select[name=label]").val();
           aoData.push({"labels": labels } ); 
        });       
     },
  });

  $("select[name=label]").change(function () {
      oTable.fnDraw();
    });
  });

但是不会使用参数标签触发网址。我有一个多选框来过滤表格。

<select class="tagit-hiddenSelect" name="label" multiple="multiple">
    <option selected="selected" value="Important">Important</option>
    <option selected="selected" value="Bug">Bug</option>
</select>

我正在尝试将所选标签添加到sAjaxSource中的my_url，并且支持我应该获取标签并返回json响应，这将在我的数据表中使用来自后端的新数据进行渲染。

现在我的网址是

http://my_domain/filter?sEcho=1&iColumns=7&sColumns=%2C%2C%2C%2C%2C%2C&iDisplayStart=0&iDisplayLength=10&mDataProp_0=0&sSearch_0=&bRegex_0=false&bSearchable_0=true&bSortable_0=true&mDataProp_1=1

我想将参数label添加到我的网址。理想情况下应该是

http://my_domain/filter?sEcho=1&iColumns=7&sColumns=%2C%2C%2C%2C%2C%2C&iDisplayStart=0&iDisplayLength=10&mDataProp_0=0&sSearch_0=&bRegex_0=false&bSearchable_0=true&bSortable_0=true&mDataProp_1=1 &label=['important','bug']（['important'，'bug']表示数组类型中的值。）

请帮助我，我是前端的初学者

Answer 1

我想我明白你要做的是什么，而且你几乎做对了 - 看起来你刚刚在错误的地方发现change事件。您的数据表初始化代码应如下所示：

oTable = jQuery('#vV7SyzDr').dataTable({
    "sPaginationType": "full_numbers",
    "bProcessing": true,
    "sAjaxSource": "my_url",
    "bServerSide": true,
    "fnServerParams": function(aoData) {
        aoData.push({"labels": $("select[name=label]").val() });
      });
    }
  });

注意：我所做的就是删除change事件绑定。

现在您需要将数据表fnDraw绑定到选择列表更改事件。这不是datatables init代码的一部分，所以把它放在js中的其他地方：

$("select[name=label]").change(function() {
    oTable.fnDraw();
});

fnDraw将通过调用您的ajax服务重新绘制数据表，并传递fnServerParams中指定的附加参数。

jQuery Datatable将参数添加到url

1 个答案: