0

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

我想以 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>

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

在控制器的断点中，我可以看到现在返回了信息，但并不完全符合我的预期 - 即我希望我的字符串类似于 [{123}, {124}] 但我得到的输出如下：

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

2 回答 2

1

尝试使用以下选择器$("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...

于 2012-12-24T13:13:40.153 回答
0

代替

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

和

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

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

于 2012-12-24T13:14:48.333 回答