ASP.NET Core中jQuery用正确选择器调用Bootstrap-table报未捕获错误

1. 无效的jQuery选择器逻辑：JS代码中$('Index').ready()是完全错误的写法，jQuery不存在对应Index页面名的选择器，该无效表达式会导致后续执行逻辑异常。
2. Bootstrap Table重复初始化：你在表格标签上添加了data-toggle="table"属性，该属性会触发Bootstrap Table自动初始化表格，后续JS中又手动调用bootstrapTable()方法对同一个表格进行二次初始化，此时原表格已经被自动初始化替换为Bootstrap Table生成的DOM结构，二次初始化时框架会错误解析生成的DOM字符串为选择器，就会抛出你看到的语法错误。
3. 表格配置参数错误：你后端返回的是表格的业务数据列表，而你在bootstrapTable()配置中错误将数据传给了columns参数，columns参数是用来定义列配置的，业务数据需要传给data参数，参数不匹配也会触发渲染异常。

1. 移除表格的自动初始化属性：删除<table>标签上的data-toggle="table"，避免自动初始化。
   修改后的表格代码如下：

<div id="tbldiv">
    <table 
           id="tblCampaign"
           class="table">
        <thead>
            <tr>
                <th data-field="name" scope="col">Name</th>
                <th data-field="country">Country</th>
                <th data-field="totalBudget">Total Budget</th>
                <th data-field="dailyBudget">Daily Budget</th>
                <th data-field="model">Model</th>
                <th data-field="payout">Payout</th>
                <th data-field="status">Status</th>
                <th data-field="link">Link</th>
                <th data-field="advertiserID">Advertiser ID</th>
            </tr>   
        </thead>
    </table>
</div>

2. 修正JS代码逻辑：删除无效的$('Index').ready()嵌套，调整Bootstrap Table的配置参数，将业务数据传给data字段。
   修改后的JS代码如下：

$(document).ready(function () {
    $.getJSON('Index?handler=ListCampaigns', function (data) {
        $("#tblCampaign").bootstrapTable({
            data: data
        });
    }); 
});

3. 额外校验：确认后端返回的JSON数据的字段名和你<th>标签上data-field定义的字段名完全一致（注意大小写匹配），避免字段匹配失败导致表格数据为空。

内容的提问来源于stack exchange，提问作者Sara Briccoli