6

サーバー側バインディングから ajax の使用に移行する 2 層の階層グリッドがあります。データの両方のレイヤーの ajax 読み取りは正しく機能していますが、ClientTemplate を使用して条件付きロジックに基づいて列をレンダリングするのが困難です。

以下は、サーバー側バインディングのバージョンです。同じ効果を得るには ClientTemplate と式 #=# を使用する必要があることは理解していますが、2 つの問題があります。

  1. CheckBoxFor などの html ヘルパー メソッドを使用できるように、行ごとに変数 'i' をインクリメントする方法を教えてください。
  2. @ を変換して ClientTemplate 式を使用する方法。条件付きロジックは、ビューのモデルのプロパティと、バインドされた要素 (MyViewModel) のプロパティを使用し、モデルのプロパティの混合を使用する条件付きロジックを使用することに注意してください。

これを式に変換すると、最も役に立ちます。

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

1 に答える 1

5

以下のコード スニペットを試してみてください。

見る

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

上記のコード スニペットを試してみてください。気になることがあれば教えてください。

于 2013-08-29T11:38:20.447 に答える