【问题标题】:kendo grid in kendo tabs using partial view使用局部视图的剑道选项卡中的剑道网格
【发布时间】:2025-12-05 02:45:02
【问题描述】:

出于某种原因,尽管 GetAllProductList 返回记录,但我可以获得第二个选项卡(产品详细信息)来绑定网格中的记录。请指教,谢谢

index.cshtml HOME/Index.cshtml

@(Html.Kendo().TabStrip()
    .Name("tabstrip")
    .Items(items =>
    {
        items.Add().Text("Search")
            .LoadContentFrom("Index", "ProductDetails")
            .Selected(true);



        items.Add().Text("Product Details")
       .LoadContentFrom("_ProductData", "ProductDetails")



    })
)

ProductDetails/Index.cshtml

@(Html.Kendo().Grid()

        .Name("BookGrid")
        .HtmlAttributes(new { @Style = "align:center; font-size:10px; width:950px" })
        .Columns(columns =>
        {

            columns.Bound(p => p.BookId).Width(95);
            columns.Bound(p => p.Name).Width(120);


        })

        .ToolBar(toolbar => toolbar.Create())
        .Sortable()
            //.Pageable()
        .Pageable(paging => paging
            .Input(false)
            .Numeric(true)

            .PreviousNext(true)
            .PageSizes(new int[] { 5, 10, 25, 50 })
            .Refresh(false)

        )
        .Selectable()
        .Scrollable()
        .ColumnMenu(c => c.Columns(false))
        .DataSource(dataSource => dataSource

            .Ajax()//bind with Ajax instead server bind
            .PageSize(10)
            .ServerOperation(true)
                .Model(model =>
                {
                    model.Id(p => p.BookId);

                })
                                     .Sort(sort => sort
                                  .Add(x => x.Name).Descending())

                        .Read(read => read.Action("GetBookData", "ProductDetails").Type(HttpVerbs.Get))


            )



    )

ProductDetails/_ProductData.chtml(部分页面)

@(Html.Kendo().Grid<HH.PrductModel>()

        .Name("ProductGrid")
        .HtmlAttributes(new { @Style = "align:center; font-size:10px; width:950px" })
        .Columns(columns =>
        {

            columns.Bound(p => p.ProductId).Width(95);
            columns.Bound(p => p.Name).Width(120);


        })

        .ToolBar(toolbar => toolbar.Create())
        .Sortable()
            //.Pageable()
        .Pageable(paging => paging
            .Input(false)
            .Numeric(true)

            .PreviousNext(true)
            .PageSizes(new int[] { 5, 10, 25, 50 })
            .Refresh(false)

        )
        .Selectable()
        .Scrollable()
        .ColumnMenu(c => c.Columns(false))
        .DataSource(dataSource => dataSource

            .Ajax()//bind with Ajax instead server bind
            .PageSize(10)
            .ServerOperation(true)
                .Model(model =>
                {
                    model.Id(p => p.ProductId);

                })
                                     .Sort(sort => sort
                                  .Add(x => x.Name).Descending())

                        .Read(read => read.Action("GetProductData", "ProductDetails").Type(HttpVerbs.Get))


            )



    )

**ProductDetailscontroller**

public ActionResult Index()

{ 
   return View();
} 

///Display for tab 1
public ActionResult GetBookData ([DataSourceRequest] DataSourceRequest request)
{
    Response.Cache.SetCacheability(HttpCacheability.NoCache);
            return Json(GetAllBookList().ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

 private static IEnumerable<BookModel> GetAllBookList()
        {
            using (var dc = new HHEntities())
            {
                var result = (from a in dc.Books

                              select new BookModel
                              {
                                  BookId= a.BookId,
                                  Name= a.Name



                              });
                return result.Distinct().ToList();
            }


        }


///Display for tab 2

public ActionResult GetProductData([DataSourceRequest] DataSourceRequest request)
{
            Response.Cache.SetCacheability(HttpCacheability.NoCache);
            return Json(GetAllProductList().ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
        }

以下将返回记录,但由于某种原因它会绑定到产品详细信息选项卡中的网格

       /// <summary>

        /// </summary>
        /// <returns></returns>
        private static IEnumerable<ProductModel> GetAllProductList()
        {
            using (var dc = new HHEntities())
            {
                var result = (from a in dc.Products

                              select new ProductModel
                              {
                                  ProductId= a.ProductId,
                                  Name= a.Name,
                                  Description= a.Description,
                                  ExpiryDate= a.ExpiryDate


                              });
                return result.Distinct().ToList();
            }


        }

    public ActionResult __ProductData()
  { return PartialView();}

【问题讨论】:

  • 又是什么问题?你说可以绑定网格。
  • 它只是显示空网格。真的很奇怪。即使我检查了 GetAllProductList 的 var 结果,它也会显示记录。谢谢

标签: c# razor entity-framework-4 kendo-ui


【解决方案1】:

我怀疑问题在于两个网格都使用相同的 HTML id 属性(通过 Name() 方法设置)呈现。你需要给你的网格唯一的名字。例如,您可以在呈现包含网格的局部视图的操作方法中将一些索引放在ViewData 中。然后在局部视图本身中使用该索引来使网格名称唯一:

@(Html.Kendo().Grid<HH.PrductModel>()
      .Name("Product" + ViewData["index"])

【讨论】:

  • 嗨 Atanas,谢谢,我会试试的
  • 嗨 Atanas,我已经修改了代码。你会建议。谢谢
  • 我没有看到您的代码更改了网格的 Name()。试试看。另外,为什么第一个选项卡加载的是完整页面而不是部分视图?
最近更新 更多