Как скрыть столбец для скрытого поля в сетке с помощью ASP.Net MVC3? - PullRequest
4 голосов
/ 03 декабря 2011

Как бы я скрыл столбец, который должен быть скрыт от глаз.Я справился с этим, скрыв объект, но столбец все еще отображается в пользовательском интерфейсе как тощий столбец, в строках которого ничего нет.Есть ли способ предотвратить вытягивание предмета?

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

Спасибо.

Ответы [ 2 ]

6 голосов
/ 03 декабря 2011

Помощник WebGrid позволяет применять класс CSS к отдельным столбцам, используя свойство style.К сожалению, хотя это позволит вам скрыть столбец внутри раздела tbody, вы не можете применять разные стили к заголовкам столбцов.Вы можете применять один и тот же стиль ко всем столбцам, что делает его довольно бесполезным.Поэтому одна из возможностей - использовать CSS:

table th:first-child, table td:first-child {
    display: none;
}

. Предполагается, что вы хотите скрыть первый столбец и что браузер клиента поддерживает псевдо-селектор :first-child, который может не бытьслучай со старыми браузерами.

Так что, если вам нужна поддержка старых браузеров, вы можете использовать jQuery, чтобы применить скрытый стиль к заголовку и строкам первого столбца или просто скрыть их напрямую:

$(function () {
    $('table th:first-child, table td:first-child').hide();
});

Если вы хотите иметь больше контроля, я бы порекомендовал вам проверить MvcContrib Grid или Telerik Grid .

0 голосов
/ 25 сентября 2012

* сильный текст * Решение от Дарина является лишь частичным, поскольку "таблица th: first-child" также будет hide the "canPage:true" grid footer (используется для подкачки).

Решение - добавить additional styling.

В вашем разделе "head" (или, в качестве альтернативы, в файле CSS, если вы хотите применить его ко всем таблицам):

<style type="text/css">
    .nodisplay {display: none;}
</style>

В разделе веб-сетки:

footerStyle : "table-footer",
...
grid.Column(null, null, style:"nodisplay", ...

В файле CSS:

.table-footer {
    display: normal
}
...