具有引导切换和可排序功能的引导表

Question

我希望你能解决我的问题。 我是jquery和bootstrap框架的新手。但是，我试图在引导程序表中使用Bootstrap切换插件。 而且，我希望这个表可以使用这些ON / OFF开关进行排序。

http://jsfiddle.net/hL7kb3jx/

<table data-toggle="table">
<thead>
    <tr>
        <th data-sortable="true">Item ID</th>
        <th data-sortable="true">Item Name</th>
        <th data-sortable="true">Item Price</th>
        <th data-sortable="true">Test</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>1</td>
        <td>Item 1</td>
        <td>$1</td>
        <td><input id="toggle-demo" type="checkbox" data-toggle="toggle" data-size="mini"></td>
    </tr>
    <tr>
        <td>2</td>
        <td>Item 2</td>
        <td>$2</td>
        <td><input id="toggle-demo" type="checkbox" data-toggle="toggle" data-size="mini"></td>
    </tr>
    <tr>
        <td>3</td>
        <td>Item 3</td>
        <td>$3</td>
        <td><input id="toggle-demo" type="checkbox" data-toggle="toggle" data-size="mini"></td>
    </tr>
        </tbody>

第一个问题是当我点击标题排序列时，切换被销毁??? 其次，包含切换的列没有排序...... 如果Bootstrap-switch是一个更好的主意，它不是问题。

如果你能帮助我，我将非常感激。