Làm thế nào để sử dụng biểu thức mẫu khách hàng trong ràng buộc ajax của lưới kìm kìm?

Question

Tôi có lưới phân cấp hai lớp mà tôi đang chuyển từ liên kết phía máy chủ sang sử dụng ajax. Ajax đọc cho cả hai lớp dữ liệu đang hoạt động chính xác tuy nhiên tôi gặp khó khăn khi sử dụng ClientTemplate để hiển thị các cột của tôi dựa trên logic điều kiện.

Dưới đây là phiên bản ràng buộc phía máy chủ. Tôi hiểu rằng tôi phải sử dụng ClientTemplate và các biểu thứC# = # cho cùng một hiệu ứng nhưng tôi đang gặp hai vấn đề:

1. Làm thế nào để tăng biến 'i' cho mỗi hàng để tôi có thể sử dụng CheckBoxFor và giống như phương pháp trợ giúp html?
2. Cách chuyển đổi @ để sử dụng biểu thức ClientTemplate. Lưu ý logic điều kiện sử dụng các thuộc tính của Mô hình Xem và các thuộc tính của phần tử được liên kết (MyViewModel) với logic điều kiện bằng cách sử dụng hỗn hợp các thuộc tính từ Mô hình

Chuyển đổi thành một biểu thức sẽ hữu ích nhất.

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>) 

Answer 1

Vui lòng thử đoạn mã bên dưới.

XEM

@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")) 
) 

CONTROLLER

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)); 
} 

MODEL

public class TestModels 
{ 
    [Display(Name = "ID")] 
    public int ID { get; set; } 

    [Display(Name = "Name")] 
    public string Name { get; set; } 

    public bool? Permissions { get; set; } 
} 

Vui lòng thử với ở trên đoạn mã. Hãy cho tôi biết nếu có bất kỳ mối quan ngại nào.