Jquery Datatable - 选择器抛出表/行undefined

时间:2017-09-14 12:51:37

标签: jquery html datatables datatables-1.10

我搜索了一个解决方案,但我不清楚它不能正常工作的原因。你能帮我吗?

这是我的代码,当我将var data = window.table.row($(this)).data()更改为var data = window.table.row($(this)).data()时,它会抛出表未定义错误,错误更改为

  

0x800a138f - JavaScript运行时错误:无法获取属性'row'   undefined或null引用

<hr />
<div class="row">
    <div class="col-xs-12">
        <table class="table table-striped table-bordered nowrap" id="calculation-table">
            <thead>
                <tr>
                    <td>Beneficial Owner</td>
                    <td>Account</td>
                    <td>Country</td>
                    <td>Currency</td>
                    <td>Year</td>
                    <td>Updater</td>
                    <td>Updated</td>
                    <td>Output</td>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th>Beneficial Owner</th>
                    <th>Account</th>
                    <th>Country</th>
                    <th>Currency</th>
                    <th>Year</th>
                    <th>Updater</th>
                    <th>Updated</th>
                    <th>Output</th>
                </tr>
            </tbody>
        </table>
    </div>
</div>
<script type="text/javascript">
    $(document).ready(function () {
        //Calculation.init();
        $('#calculation-table').DataTable(
            { // set server side processing to true
                bServerSide: true,
                // set controller responsible for sorting and paging
                sAjaxSource: "CalculationTest/AjaxHandler",
                // show processing is happening while getting data
                bProcessing: true,
                sPaginationType: 'full_numbers',
                iDisplayLength: 15,
                lengthMenu: [[15, 25, 50, -1], [15, 25, 50, "All"]],
                columns: [
                    { data: "BeneficialOwner" },
                    { data: "Account" },
                    { data: "Country" },
                    { data: "Currency" },
                    { data: "Year" },
                    { data: "Updater" },
                    { data: "Updated".toString() },
                    {
                        "targets": -1,
                        "data": null,
                        "defaultContent": "<button class='btn btn-primary'>Download File</button>"
                    }
                ],
                "language": {
                    "search": "",
                    "searchPlaceholder": "Search..."
                }
            });

        $('#calculation-table > tbody').on('click', 'button', function () {
            var data = table.row($(this)).data();
            var url = '/Calculation/DownloadCalculation';
            $.ajax({
                type: "GET",
                url: url,
                data: { id: data[5] },
                dataType: "html",
                success: function (data) {
                    //put your code here
                }
            });
        });

    });
</script>

1 个答案:

答案 0 :(得分:0)

<td> is for <tbody>
<th> is for <thead>

你已经用你的HTML交换了