引导复选框表答案

【问题标题】：Bootstrap checkbox table引导复选框表
【发布时间】：2015-01-12 15:34:26
【问题描述】：

我有以下引导表。我想要选择复选框，但是当我单击按钮时它不起作用。这是我的桌子：

<div class="main">
            <button class="btn btn-default" id="get-selections">
                Get Selections
            </button>


        <table id="table-methods-table" data-toggle="table" data-url="data_out.json" data-height="200">
        <thead>
            <tr>
                <th data-field="state" data-checkbox="true"></th>
                <th data-field="PatName">Name</th>
                <th data-field="KinID">Stars</th>
                <th data-field="Service">Forks</th>

            </tr>
        </thead>
        </table>
        </div>

这是我的 javascript：

<script>
$(document).ready(function(){


    $("#table-methods").next().click(function () {
        $(this).hide();

        var id = 0,
            getRows = function () {
                var rows = [];

                for (var i = 0; i < 10; i++) {
                    rows.push({
                        id: PatName,
                        name: 'test' + PatName,
                        price: '$' + PatName
                    });
                    id++;
                }
                return rows;
            },
            // init table use data
            $table = $("#table-methods-table").bootstrapTable({
                data: getRows()
            });
        $("#get-selections").click(function () {

            alert("Selected values: " + JSON.stringify($table.bootstrapTable("getSelections")));
        });
    }); 
});

如何获得选择复选框？

【问题讨论】：

如果我理解，您想获取数据字段值吗？
是的，但前提是它被选中。

标签： jquery twitter-bootstrap

【解决方案1】：

你可以做一些非常简单的事情：

$('#get-selections').click(function() {
    var dataFieldValue = $('#table-methods-table th[data-checkbox="true"]').data('field');
    alert (dataFieldValue)
});

在您的示例中，代码显示“状态”。

更新 1：

查看JSFiddle

【讨论】：

在 JSFiddle 上还是在您的项目上？

【解决方案2】：

将#get-selections 回调放在文档就绪事件之后：

$(document).ready(function() {

    $('#get-selections').click(function() {
        var dataFieldValue = $('#table-methods-table th[data-checkbox="true"]').data('field');
        alert (dataFieldValue)
    });
    // ... and your script here

});

【讨论】：

如果你还有一个未定义的，那是因为任何元素的数据复选框都为真值。

【解决方案3】：

编辑这个

<table id="table-methods-table" data-toggle="table" data-url="data_out.json" data-height="200" data-click-to-select="true">

【讨论】：