Question

我使用此代码隐藏webgrid中的列。

grid.Column(null, null, format: @<input type="hidden" name="IDHidden" value="@item.ID" />),

现在我的网格UI看起来就像下面的那个不对。在此输入图像描述

上面的代码确实帮我隐藏了我的第一列。我搜索谷歌并得到一个承诺隐藏webgrid列的CSS。所以我用这个css

.webgrid-table td:nth-child(1),th:nth-child(1){
            display:none
        }

上面的CSS隐藏了我的第一列，但我的寻呼机也变得不可见，这不是我的意图。

我正在寻找一个隐藏webgrid第一列的css，但是如果webgrid有任何隐藏，则不会隐藏寻呼机。寻求帮助。感谢

Answer 1

hideColumn = function (column) {
    $('tr').each(function () {
        $(this).find('td,th').eq(column).hide();
    });
};
hideColumn(0);

请将此代码放入：$(document).ready(function (){});

Answer 2

如果要隐藏第二列，例如：

  $(document).ready(function()
  {
  $("#yourGridId th:nth-child(2)").hide();
  $("#yourGridId td:nth-child(2)").hide();
  }

隐藏包括标题的col。

Answer 3

使用mvc5隐藏webgrid中的行

您的观点应在以下部分 -

 var grid = new WebGrid(
                    ajaxUpdateContainerId: "grid");

            grid.Bind(data);
            grid.Pager(WebGridPagerModes.All);

            @grid.GetHtml(htmlAttributes: new { id = "grid" },   // id for ajaxUpdateContainerId parameter
        fillEmptyRows: false,
         tableStyle: "webgrid-table",
    headerStyle: "webgrid-header",
    footerStyle: "webgrid-footer",
    alternatingRowStyle: "webgrid-alternating-row",
    selectedRowStyle: "webgrid-selected-row",
    rowStyle: "webgrid-row-style",
        mode: WebGridPagerModes.All,
        columns: grid.Columns(
          grid.Column("Container_No", "Container No", canSort: false),
          grid.Column("SizeText", "SizeList", canSort: false),
           grid.Column("ContainerText", "Container Type", canSort: false),
            grid.Column("CargoText", "Cargo Type", canSort: false),
           grid.Column(header: "Action", canSort: false, style: "col-lg-2",
            format: @<text>              
     @Html.Raw("<a href='#' id='" + item.Container_No + "' onclick='goDelete(id);'><span class='glyphicon glyphicon-trash'> </span></a>")

请在脚本中包含以下功能 -

function goDelete(data) {
     $(".page-loader-wrapper").show();`enter code here`
    if (confirm("Are you sure to delete this Container Entry?")) {          
        $.ajaxSetup({ cache: false });
            $.ajax({
                type: "POST",
                url: "/ControllerName/ActionName",
                data: '{Container_No: ' + data + '}',
                contentType: "application/json; charset=utf-8",
                dataType: "json",

                success: function (response) {                        
                    $("#" + data).parents("tr").remove();
                    $(".page-loader-wrapper").hide();

                   alert(data + "Container removed successfully !!");                                             
                }
            });
        }
    }

ASP.NET MVC：如何隐藏Webgrid中的第一列

3 个答案: