Добавьте вертикальную прокрутку в веб-сетку в приложении Asp.net mvc4.

Я использовал WebGrid в своем приложении asp.net mvc4.

 <td >
                   @grid.GetHtml(tableStyle:"table_div",
                   headerStyle:"table_header",
                   columns: grid.Columns(
                   grid.Column("Nom de la propriété","Nom de la propriété",canSort:false,format:@<label>@Html.Raw(@item.PName)</label>),
                   grid.Column("Valeur de la propriété","Valeur de la propriété",canSort:false,format:@<label>@Html.Raw(@item.PName)</label>), 
                   grid.Column("","",canSort:false,format:@<span>@{i++;<input name="proper@(@i)" type="checkbox" />}</span>)))
            </td>

CSS

.table_div {
    overflow-y: scroll;
    width: 400px;
    height: 200px;
    position: relative;
}

Я хотел бы добавить вертикальную прокрутку в свою сетку, но это не сработало.

Сгенерированный HTML-код

<table class="table_div">
    <thead>
        <tr class="table_header">
            <th scope="col">
Nom de la propriété            </th>
            <th scope="col">
Valeur de la propriété            </th>
            <th scope="col">
            </th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><label>poids</label></td>
            <td><label>poids</label></td>
            <td><span><input name="proper0" type="checkbox"></span></td>
        </tr>
        <tr>
            <td><label>taille</label></td>
            <td><label>taille</label></td>
            <td><span><input name="proper1" type="checkbox"></span></td>
        </tr>

    </tbody>
    </table>
  1. В чем ошибка?
  2. Как я могу это исправить?

css asp.net razor asp.net-mvc-4 webgrid
person Lamloumi Afif    schedule 15.01.2014    source источник
comment
попробуйте поместить свою таблицу в div с классом .table_div   -  person richa_pandey    schedule 15.01.2014
comment
см. мой ответ. Ваша структура должна быть только такой.   -  person richa_pandey    schedule 15.01.2014

Ответы (2)


arrow_upward
2
arrow_downward

Поместите свою таблицу в div с классом .table_div

Ваша структура должна быть такой:

<div class="table_div">
   <table> ..
</div>
person richa_pandey    schedule 15.01.2014
comment
:D .. спасибо за использование слова Genius для меня. Я у тебя в долгу. - person richa_pandey; 15.01.2014
comment
Спасибо за комментарий..!! - person Anup; 15.01.2014

arrow_upward
2
arrow_downward

Вы должны обернуть table в div и применить класс к этому div

Рабочая демонстрация

Eg: 

<div class="table_div">
<table>
...
</table>
</div>
person Surjith S M    schedule 15.01.2014