首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如果使用Knockout JS显示表头:无,则需要禁用表行

如果使用Knockout JS显示表头:无,则需要禁用表行
EN

Stack Overflow用户
提问于 2015-06-23 02:29:31
回答 1查看 1K关注 0票数 1

我正在使用Knockout JS。我有一个下拉列表中的表列列表,当从列表中选择一列时,更改表列标题style = Display:none。我需要使行在分页/排序时也显示为无。一旦列标题集显示为:none,它将保留分页/排序,而不是行。下面是my表的结构。

代码语言:javascript
复制
<table class="mediaTable dataTableExt">
    <thead>
        <tr>
            <th class="essential persist">
                <a data-bind="click: function () {sortGrid('cust','ConfirmationNumber')}" href="#">@Model.GetLabel("Confirmation #")</a> </th>

            <th class="essential">
                <a data-bind="click: function () {sortGrid('cust','FirstName')}" href="#">@Model.GetLabel("First Name")</a>
            </th>
            <th class="optional">
                <a data-bind="click: function () {sortGrid('cust','LastName')}" href="#">@Model.GetLabel("Last Name")</a>
            </th>

        </tr>
    </thead>
    <!-- ko foreach: customerOrders-->
    <tbody>
        <tr>
            <td class="essential persist" data-bind="text:ConfirmationNumber">
            </td>

            <td class="essential" data-bind="text:CustomerFirstName">
            </td>
            <td class="optional" data-bind="text:CustomerLastName">
            </td>

        </tr>
    </tbody>
    <!-- /ko-->
</table>
EN

回答 1

Stack Overflow用户

发布于 2015-06-23 04:12:12

您可以使用visible绑定来隐藏标题和列数据。

代码语言:javascript
复制
<table class="mediaTable dataTableExt">
    <thead>
        <tr>
            <th class="essential persist" data-bind="visible: $root.hidden() != 'ConfirmationNumber'">
                <a data-bind="click: function () {sortGrid('cust','ConfirmationNumber')}" href="#">@Model.GetLabel("Confirmation #")</a> </th>

            <th class="essential" data-bind="visible: $root.hidden() != 'FirstName'">
                <a data-bind="click: function () {sortGrid('cust','FirstName')}" href="#">@Model.GetLabel("First Name")</a>
            </th>
            <th class="optional" data-bind="visible: $root.hidden() != 'LastName'">
                <a data-bind="click: function () {sortGrid('cust','LastName')}" href="#">@Model.GetLabel("Last Name")</a>
            </th>

        </tr>
    </thead>
    <!-- ko foreach: customerOrders-->
    <tbody>
        <tr>
        <th class="essential persist" data-bind="visible: hidden() != 'ConfirmationNumber'"> <a data-bind="click: function () {sortGrid('cust','ConfirmationNumber')}" href="#">@Model.GetLabel("Confirmation #")</a> 
        </th>
        <th class="essential" data-bind="visible: hidden() != 'FirstName'"> <a data-bind="click: function () {sortGrid('cust','FirstName')}" href="#">@Model.GetLabel("First Name")</a>

        </th>
        <th class="optional" data-bind="visible: hidden() != 'LastName'"> <a data-bind="click: function () {sortGrid('cust','LastName')}" href="#">@Model.GetLabel("Last Name")</a>

        </th>
        </tr>
    </tbody>
    <!-- /ko-->
</table>

演示:http://jsfiddle.net/knjtov16/1/

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/30987245

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档