如何定制和使得贡献网格时尚

到目前为止，我已经使用这种编码来查看formy mvc contrib网格....在这里，当我绑定网格它变得太大，它的最后一列是在页面之外。 ..pls说如何减小体积，使电网一些如何时尚.....如何定制和使得贡献网格时尚

<%= Html.Grid<Product>(Model) 
      .Columns(column => 
      { 

     column.For(c => c.ProductID); 
     column.For(c => c.ProductName); 
     column.For(c => c.SupplierID); 
     column.For(c => c.CategoryID); 
     column.For(c => c.QuantityPerUnit); 
     column.For(c => c.UnitPrice); 
     column.For(c => c.UnitsInStock); 
     column.For(c => c.UnitsOnOrder); 
     column.For(c => c.ReorderLevel); 
     column.For(c => c.Discontinued); 
     column.For(c => Html.ActionLink("Details", "Details", new { id = c.ProductID })).InsertAt(0).Encode(false); 
     column.For(c => Html.ActionLink("Edit", "Edit", new { id = c.ProductID })).InsertAt(1).Encode(false); 
     column.For(c => Html.ActionLink("Create", "Create", new { id = c.ProductID })).InsertAt(2).Encode(false); 
     column.For(c => Html.ActionLink("Delete", "Delete", new { id = c.ProductID })).InsertAt(3).Encode(false); 
      } 
    ) 



%>

来源

2010-11-18 Kajah User

您可以定义的宽度或每一列自定义CSS类。这样，您就可以限制其大小：

column.For(c => c.ProductID) 
     .Attributes(gr => new Hash(@width => "15%"));

或CSS类：

column.For(c => c.ProductID) 
     .Attributes(gr => new Hash(@class => "productId"));

你也可以把整个网格与固定宽度的DIV。

来源

2010-11-18 17:59:36

以下是我如何使用交替行和颜色对我的网格进行样式设置。

<%Html.Grid<UserSummaryModelDetails>(Model.Users) 
    .Columns(column => 
       { 
        column.For(x => x.FullName).Named("Name").Attributes(x => new Dictionary<string, object> { { "valign", "top" } }); 
        column.For(x => x.Division).Attributes(x => new Dictionary<string, object> { { "valign", "top" } }); 
       }) 
       .RowStart((p,row) => {  
             if (!row.IsAlternate) { %> 
              <tr class="gridrow_alternate"> 
             <% } else { %> 
              <tr> 
             <% } 
          }) 
     .HeaderRowAttributes(new Dictionary<string, object> { { "style", "height: 25px;" } }) 
     .Empty("No users found") 
     .Attributes(@class => "table-list") 
     .Render(); 
%>

样式表：

.table-list 
{ 
    clear: both; 
    width: 800px; 
    height: 100%; 
     border: solid 1px #e8eef4; 
     border-collapse: collapse; 
     overflow: visible; 
     margin-top: 10px; 
} 

.table-list td 
{ 
    padding: 5px; 
    border: solid 1px #e8eef4; 
    overflow: visible; 
} 

.table-list tr 
{ 
    height: 95px; 
    overflow: visible; 
} 

.table-list th 
{ 
    padding: 6px 5px; 
    text-align: left; 
    background-color: #e8eef4; 
    border: solid 1px #e8eef4; 
    overflow: visible; 
} 


.table-list .gridrow_alternate 
{ 
    background-color: #eee; 
}

来源

2010-11-18 18:24:11 rboarman

如何定制和使得贡献网格时尚

回答

相关问题