2013-04-15 2 views
0

ListView에 대한 사용자 지정 템플릿을 만들려고합니다 (ListView에서 제품 eShop을 보여줍니다). 내가 new {id = ${ProductTitle}}에 오류가KendoUI ListView에 대한 사용자 지정 템플릿 만들기

<script type="text/x-kendo-tmpl" id="template"> 
    <div class="item"> 
    <div class="image"> 
     <a href='@Url.Action("GetDetails", "Products", routeValues: new {id =${ProductID}})' target='_blank' class='pimg'> 
      <img src="${ProductThumbnailImageUrl}" alt=" ${ProductTitle}"/> 
     </a> 
    <div class="price"> ${kendo.toString(ProductPrice, "n0")} </div> 

    <div class="name"> 

</div> 
    <div class="description_featured" style="min-height: 110px;"> 
     ${ProductDescription} 

    </div> 
    </div> 
</div> 

</script> 

@(Html.Kendo().ListView(Model) 
      .Name("listView") 
      .TagName("div") 
      .ClientTemplateId("template") 
      .DataSource(dataSource => 
         { 
          dataSource.Read(read => read.Action("Products_Read", "Products")); 
          dataSource.PageSize(12); 
          dataSource.ServerOperation(false); 
         }) 
      .Pageable() 
      ) 

:이 코드를 썼다.

+0

모든 응용 프로그램에 검도와 jQuery를 참조 필요한 추가 확인하시기 바랍니다. 템플릿은 에 있어야합니다. 당신이 그걸 놓치지 않았 으면 좋겠어! – HaBo

+0

@ HaBo : 도와 줘서 고마워. 나는 코드 편집. 도와주세요. 감사합니다 – Pouya

+0

"제품"컨트롤러가 있고 "Product_Read"작업 메서드가 있고 "ProductTitle", "ProductThumbnailImageUrl", "ProductPrice"및 "ProductDescription"속성을 가진 개체를 반환합니까? – HaBo

답변

2

템플릿을 사용하는 방법입니다. 내 웹 사이트에 최근에 사용한 템플릿에있는 템플릿입니다. ${ProductTitle} 사용하기 위해 귀하의 경우

<script type="text/x-kendo-tmpl" id="template"> 
     <div class="product"> 
      <img src='http://cdn.rbgx.net/images/skybazaar/products/medium/${ImageFileName}' alt="${Name} image" /> 
    <div class="productDeatails"> 
      <h3>#:Name#</h3> 
    # if (EntityType == 2) { # 
     Click to see products of this category 
    # } else if(EntityType == 1) { # 
    # if(parseFloat(SalePrice) > 0 && parseFloat(SalePrice) < parseFloat(Price)) { # 
    Sale Price #: kendo.toString(SalePrice, "c")# 
    # } else { # 
    Price #: kendo.toString(Price, "c")# 
    # } # 
    # } # 
     </div> 
     </div> 
    </script> 

#: ProductTitle #