从datatable中获取id列表.Net中的Javascript

Get a list of IDs from Datatables.Net in Javascript

本文关键字:Net 中的 Javascript 列表 id datatable 获取      更新时间:2023-09-26

我有一个ASP。. NET MVC 3网站-在一个特定的页面上,我使用了datatables.net插件表。在标记中,我在表左侧包含了一个复选框,单击该复选框将突出显示该行。用户可以选择多行。当用户单击按钮时,我想将所有行单击的id传递回我的控制器,然后在DB中执行一些工作。

我想传回JSON格式的id,这样就很容易反序列化数据在我的控制器。

到目前为止,这也是我得到的。

$('#UseCars').click(function (event) {
    var cars = new Array();
    carsTable.find("tr input:checkbox").each(function () {
        var car = new Object();
        //alert($(this).attr("CarID"));
        car.ID = $(this).attr("CarID");
        //alert(car.ID);
        cars.push(car);
    });
    var jsonstring = $.toJSON(cars);
    $('#CarsList').val(jsonstring);
});

在我的cshtml中,我有一个隐藏的CarsList,这是我的模型上的字符串。当我在UseCars按钮调用的控制器中的方法上设置断点时,我可以看到model的值。CarsList是一个jstrong字符串,但它在表中查找所有复选框,而不是特定的复选框,并且它也不会将行的id值拉出来。

有人能看到我在这里错过了什么吗?

编辑为包含CSHTML标记

这是我在页面上为表格设置的标记。

   <table id="carsTable" style="margin-left: 2px; width: 200px">
                            <thead>
                                <tr>
                                    <th class="ui-widget-header">
                                        <input id="SelectAll" type="checkbox" />
                                    </th>
                                    <th class="ui-widget-header table-header">
                                    </th>
                                    <th class="ui-widget-header table-header">
                                        Age of Car (Years)
                                    </th>
                                    <th class="ui-widget-header table-header">
                                        Car Name
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach (var item in Model.CarList)
                                {
                                    <tr>
                                        <td class="table-data">
                                            <input id="SelectIndividual" name="Select" type="checkbox" />
                                        </td>
                                        <td id="InvoiceId">
                                            @Html.DisplayFor(modelItem => item.CarID)
                                        </td>
                                        <td class="table-data">
                                            @Html.DisplayFor(modelItem => item.CarAge)
                                        </td>
                                        <td class="table-data">
                                            @Html.DisplayFor(modelItem => item.CarName)
                                        </td>
                                    </tr>
                                }
                            </tbody>
                        </table>

然后在我的js文件的页面为DataTable表配置ID列设置为bvisible: false,所以它实际上并没有显示给用户。我改变了id选择Daniel提到的,所以它现在看起来像- car。ID = $(this).next(" ID ");

在我的断点在控制器,我可以看到信息现在返回,但不完全是我所期望的-即我希望我的字符串会像[{123},{124}],但相反,我得到的输出像:

"[{'"ID'":{'"length'":0,'"prevObject'":{'"0'":{'"jQuery183036556275907670765'":227},'"context'":{'"jQuery183036556275907670765'":227},'"length'":1},'"context'":{'"jQuery183036556275907670765'":227},'"selector'":'".next(CarId)'"}}]"

尝试使用以下选择器$("td input:checked")

$("td input:checked").each(function (index, para) {
    var car = new Object();
    //alert($(this).attr("CarID"));
    car.ID = $(this).attr("CarID");
    //alert(car.ID);
    cars.push(car);
});

更好的是也使用表id,如$("#myTableId td input:checked").each...

Replace

carsTable.find("tr input:checkbox").each(function () {

carsTable.find("tr input:checked").each(function () {

jquery/js调试器不可靠使用console.log()代替