这是剃刀构建我的网格:
@(Html.Kendo().Grid(Model.ResultList)
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.Login).Title("Hesap No");
columns.Bound(c => c.FullName).Title("İsim");
columns.Bound(c => c.CreatedDate).Title("İşlem Tarihi");
columns.Bound(c => c.Amount).Title("Tutar");
columns.Bound(c => c.MonetaryUnit).Title("Kur");
columns.Template(e => { }).ClientTemplate(" ").Title("Hesap Bilgileri");
})
.ClientRowTemplate(
"<tr>" +
"<td>" +
"<span>#: Login #</span>" +
"</td>" +
"<td>" +
"<span>#: FullName #</span>" +
"</td>" +
"<td>" +
"<span>#: CreatedDate #</span>" +
"</td>" +
"<td>" +
"<span>#: Amount #</span>" +
"</td>" +
"<td>" +
"<span>#: MonetaryUnit #</span>" +
"</td>" +
"<td>" +
"<span>#: AccountName #</span>" +
"<span>#: BankName #</span>" +
"<span>#: BranchOfficeName # </span>" +
"<span>#: BranchOfficeCode # </span>" +
"<span>#: AccountNumber # </span>" +
"<span>#: IBAN # </span>" +
"<span>#: AccountType # </span>" +
"</td>" +
"</tr>"
)
.ClientAltRowTemplate(
"<tr class='k-alt'>" +
"<td>" +
"<span>#: Login #</span>" +
"</td>" +
"<td>" +
"<span>#: FullName #</span>" +
"</td>" +
"<td>" +
"<span>#: CreatedDate #</span>" +
"</td>" +
"<td>" +
"<span>#: Amount #</span>" +
"</td>" +
"<td>" +
"<span>#: MonetaryUnit #</span>" +
"</td>" +
"<td>" +
"<span>#: AccountName #</span>" +
"<span>#: BankName #</span>" +
"<span>#: BranchOfficeName # </span>" +
"<span>#: BranchOfficeCode # </span>" +
"<span>#: AccountNumber # </span>" +
"<span>#: IBAN # </span>" +
"<span>#: AccountType # </span>" +
"</td>" +
"</tr>"
)
.HtmlAttributes(new { style = "height: 700px;" })
.Scrollable()
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
)
但是我的最后一栏没有按预期呈现。数据提供必要的列,但列始终为空。为什么?我该如何解决?
提前致谢,
答案 0 :(得分:2)
您不需要使用ClientRowTemplate
。请改为使用列ClientTemplate
,如下所示:
@(Html.Kendo().Grid(Model.ResultList)
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.Login).Title("Hesap No");
columns.Bound(c => c.FullName).Title("İsim");
columns.Bound(c => c.CreatedDate).Title("İşlem Tarihi");
columns.Bound(c => c.Amount).Title("Tutar");
columns.Bound(c => c.MonetaryUnit).Title("Kur");
columns.Template(e => { }).ClientTemplate(
"<span>#: AccountName #</span>" +
"<span>#: BankName #</span>" +
"<span>#: BranchOfficeName # </span>" +
"<span>#: BranchOfficeCode # </span>" +
"<span>#: AccountNumber # </span>" +
"<span>#: IBAN # </span>" +
"<span>#: AccountType # </span>"
).Title("Hesap Bilgileri");
})
.HtmlAttributes(new { style = "height: 700px;" })
.Scrollable()
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
)
但是,这不是我设计网格的方式。您上一栏中的信息太多了。我将使用详细信息模板,如演示here,并将最后一列中的所有数据移动到详细信息模板。
<强>更新强>
对于服务器绑定网格,ClientTemplate不起作用。您需要使用服务器模板,如下所示:
@(Html.Kendo().Grid(Model.ResultList)
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.Login).Title("Hesap No");
columns.Bound(c => c.FullName).Title("İsim");
columns.Bound(c => c.CreatedDate).Title("İşlem Tarihi");
columns.Bound(c => c.Amount).Title("Tutar");
columns.Bound(c => c.MonetaryUnit).Title("Kur");
columns.Template(
@<text>
<span>@item.AccountName</span>
<span>@item.BankName</span>
<span>@item.BranchOfficeName</span>
<span>@item.BranchOfficeCode</span>
<span>@item.AccountNumber</span>
<span>@item.IBAN</span>
<span>@item.AccountType</span>
</text>
).Title("Hesap Bilgileri");
})
.HtmlAttributes(new { style = "height: 700px;" })
.Scrollable()
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
)