如何在mvc剑道网格的ajax绑定中使用客户端模板表达式
本文关键字:客户端 表达式 绑定 ajax mvc 网格 | 更新日期: 2023-09-27 18:29:31
我有一个两层分层网格,我正在从服务器端绑定转向使用ajax。两层数据的ajax读取都正常工作,但是我很难使用ClientTemplate来基于条件逻辑呈现列。
下面是服务器端绑定版本。我知道我必须使用ClientTemplate和表达式#=#才能达到同样的效果,但我有两个问题:
- 如何为每一行增加变量"i",这样我就可以使用CheckBoxFor和类似的html辅助方法了
- 如何将@转换为使用ClientTemplate表达式。请注意,条件逻辑使用视图的Model的属性以及绑定元素(MyViewModel)的属性,条件逻辑混合使用Model的属性
将其转换为表达式将非常有用。
var i = -1;
@(Html.Kendo().Grid<MyViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.Selected).Title("")
.Template(
@<text>
@{i++;}
@if (Model.Permissions.HasInsertAccess && item.Status == Status.Created)
{
<input type="hidden" name="MyViewModels.Index" value="@i" />
@Html.CheckBoxFor(m => m.MyViewModels[i].Selected)
}
</text>);
columns.Bound(c => c.Id)
.Template(@<text>@Html.HiddenFor(m => m.MyViewModels[i].Id)@item.Id</text>)
请尝试使用以下代码片段。
查看
@model MvcApplication1.Models.TestModels
<script type="text/javascript">
var rowNumber = 0;
function resetRowNumber(e) {
rowNumber = 0;
}
function renderNumber(data) {
return ++rowNumber;
}
function renderRecordNumber(data) {
var page = parseInt($("#Grid").data("kendoGrid").dataSource.page()) - 1;
var pagesize = $("#Grid").data("kendoGrid").dataSource.pageSize();
return parseInt(rowNumber + (parseInt(page) * parseInt(pagesize)));
}
</script>
@(Html.Kendo().Grid<MvcApplication1.Models.TestModels>()
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.ID);
columns.Bound(p => p.Name);
columns.Template(t => { }).Title("Row No").ClientTemplate("# if ( '" + @Model.Permissions.HasValue.ToString().ToLower() + "' == 'true') { #" +
"<input type='text' name='MyViewModels.Index' value='#= renderNumber(data) #' /> " +
"# } #");
})
.Pageable(x => x.PageSizes(new int[] { 10, 20, 30, 50 }).Refresh(true))
.Sortable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Grid_Read", "Home"))
)
.Events(ev => ev.DataBound("resetRowNumber"))
)
控制器
public ActionResult Index()
{
TestModels model = new TestModels();
model.Permissions = true; //Please comment this line and check
return View(model);
}
public ActionResult Grid_Read([DataSourceRequest] DataSourceRequest request)
{
List<TestModels> models = new List<TestModels>();
for (int i = 0; i < 50; i++)
{
TestModels t1 = new TestModels();
t1.ID = i;
t1.Name = "Name" + i;
models.Add(t1);
}
return Json(models.ToDataSourceResult(request));
}
型号
public class TestModels
{
[Display(Name = "ID")]
public int ID { get; set; }
[Display(Name = "Name")]
public string Name { get; set; }
public bool? Permissions { get; set; }
}
请尝试使用上面的代码片段。如果有任何顾虑,请告诉我。