如何将数据从数据库发送到 kendo ui listview？

Question

我想创建购物车，此页面显示库存中的所有产品。列表视图即将到来，它是空的/。 我的代码如下，列表视图来了，它是空的`： @model IEnumerable @{ ViewBag.Title = "索引"; 布局 = "~/Views/Shared/_Layout.cshtml"; }

    <script type="text/x-kendo-tmpl" id="template">
            <div class="product">
            <img src="@Url.Content("~/Content/Images")$#:product_name#.jpg"      alt="#:product_name# image" />
            <h3>#:product_name#</h3>
            <p>#:kendo.toString(product_price, "c")#</p>
        </div>
    </script>

    <div class="demo-section">
    @(Html.Kendo().ListView<caseStudy.Models.product>()
        .Name("listView")
        .TagName("div")
        .ClientTemplateId("template")
        .DataSource(dataSource => {
            dataSource.Read(read => read.Action("Products_Read","Product"));
            dataSource.PageSize(15);
        })
        .Pageable()
    )

    </div>

    my controlller :

            public ActionResult Index()
            {
                return View(GetProducts());
            }

            public ActionResult Products_Read([DataSourceRequest] DataSourceRequest request)
            {
                return Json(GetProducts().ToDataSourceResult(request));
            }

            private static IEnumerable<product> GetProducts()
            {
                var Plist = new ShopCartDataContext();

                return Plist.products.Select(p => new product
                {
                    product_name=p.product_name,
                    product_price = p.product_price,
                    product_id = p.product_id

                });

            }` 

Answer 1

尝试如下更新您的模板：

<script type="text/x-kendo-tmpl" id="template">
        <div class="product">
        <img src="@Url.Content("~/Content/Images/")#:product_name#.jpg" 
         alt="#:product_name# image" />
        <h3>#:product_name#</h3>
        <p>#:kendo.toString(product_price, "c")#</p>
    </div>
</script>