如何在劍道中使用剃鬚刀實現自定義分類器

Question

我試圖在劍道網格中實現自定義比較，以便數字正確地沿列的文本排列。

的CSHTML頁面已經被使用MVC包裝寫的，剃刀標記 -

@(Html.Kendo().Grid<dynamic>().Name("grid") 
       .Columns(a => 
       { 
        a.Bound("colA").Width("6%"); 
        a.Bound("colB").Width("14%"); 
        a.Bound("colC").Title("numbers and text").Width("5%"); 

        foreach (var issue in LookupHelper.GetFailures().Where(b => b.Source != "Other")) 
         a.Bound("Issue_" + issue.Id.ToString()).Title(issue.Description).Width("7%"); 
       }) 
       .DataSource(a => a.Ajax().Batch(true) 
        .Model(b => b.Id("colA")) 
        .PageSize(20) 
        .Sort(b => b.Add("colA").Ascending()) 
        .ServerOperation(false) 
       ) 
       .Events(a => a.Change("grid.change").DataBound("grid.change")) 
       .Pageable() 
       .Resizable(a => a.Columns(true)) 
       .Selectable() 
       .Sortable(a => a.SortMode(GridSortMode.MultipleColumn)) 
       .Filterable() 

的Telerik的網頁說，它還不支持http://www.telerik.com/forums/custom-sort-example-for-mvc-wrappers

，所以我想座標記和字符串用一個包括自定義排序函數的列替換列定義。

任何想法如何做到這一點？

我試過.toHtmlString（）但網格不呈現，但只顯示字符串。

感謝

Answer 1

好，我通過重寫它JS格式，並使用剃刀標記還是動態生成的列解決了這個。

幫 - Mix Razor and Javascript code

<script type="text/javascript">jQuery(function() { 
jQuery("#wims-grid-surveillance").kendoGrid({ 
    change: wimsDashboard.changeSurveillance, 
    dataBound: wimsDashboard.changeSurveillance, 
    columns: [ 
     { title: "Well", "width": "5%", "field": "Well", "filterable": {}, "encoded": true }, 
     { title: "Type", "width": "5%", "field": "Type", "filterable": {}, "encoded": true }, 
     { title: "Pot.", "width": "3%", format: "{0:n0}","field": "Potential", "filterable": {}, "encoded": true }, 
     { title: "Status", "width": "4%", 
     "template": "\u003cdiv style=\u0027vertical-align: top;cursor: pointer;text-align: center;font-size: 300%;color: #=StatusFlag#\u0027 onclick=\u0027wimsPage.bf.openWindow(\u0022/eplant/dll/eplant.dll?Display&page_id=2121&WELL=#=Well#\u0022,\u0022#=Well#\u0022, \u0022/eplant/images/custom_images/WIMS-16x16.png\u0022,\u0022#=Well# - Well Integrity BF Display\u0022);\u0027 \u003e\u25CF\u003c/div\u003e", 
     "field": "Status", 
     "filterable": { 
        extra:false, 
        operators: { 
         string:{ contains: "Is"} 
        }, 
        ui: function (el){ 
          el.kendoDropDownList({ 
          dataSource: [{value:"111",text:"Open"},{value:"0",text:"Shut"}], 
          dataTextField: "text", 
          dataValueField: "value", 
          optionLabel: "--Select Value--", 
          cell: {operator: "contains"} 
          }); 
         } 
     }, 
     "encoded": true, 
     sortable: { 
      compare: function (a, b) { 
       a = (a.Status.split("1").length - 1); 
       b = (b.Status.split("1").length - 1); 
       return a<b ? -1 : a==b ? 0 : 1; 
       } 
      } }, 
     { title: "Oper. Status", "width": "4%", "field": "OpStatus", "filterable": { extra:false, 
        operators: { 
         string:{ eq: "Is"} 
        }, 
        ui: function (el){ 
          el.kendoDropDownList({ 
          dataSource: [{value:"Shut In",text:"Shut In"},{value:"Cont. Oper.",text:"Cont. Oper."}], 
          dataTextField: "text", 
          dataValueField: "value", 
          optionLabel: "--Select Value--", 
          cell: {eq: "Is"} 
          }); 
         }}, "encoded": true }, 
     { title: "Active Case", "width": "8%", "field": "Case", "filterable": {}, "encoded": true }, 
     { title: "Sev.", "width": "3%", "field": "Severity", "filterable": {}, "encoded": true }, 
     { title: "Days to expiry", 
     attributes: { "class": "vline" }, 
     width: "4%", 
     template: "#if (DaysToExpiry == '0') {# <div style='color: #=DaysToExpiryFlag#'>Expired</div> #} else if(DaysToExpiry==null) {##} else {##=DaysToExpiry##}#", 
     field: "DaysToExpiry", 
     filterable: {}, 
     encoded: true 
     } 
     @foreach (var issue in LookupHelper.GetFailureLocations().Where(b => b.Source != "Other")) 
     { 
      <text> 
      ,{ "title": "@issue.Description", 
      "attributes": { "class": "visible-wide" }, 
      "width": "5%", 
      "template": "<div class='input-block-level' style='color:transparent; background-color: #if(Issue_@issue.Id == 5){##=dashboardFailureColour.text##}else if (Issue_@issue.Id == 4) {##=dashboardCategory1Colour.text##} else if (Issue_@issue.Id == 3) {##=dashboardCategory2Colour.text##} else if (Issue_@issue.Id == 2) {##=dashboardCategory3Colour.text##} else if (Issue_@issue.Id == 1) {##=dashboardNonApplicableColour.text##} else if (Issue_@issue.Id === 0) {##=dashboardInvalidAttributeColour.text##}else{#none#}#;'>#if(Issue_@issue.Id != null){##=Issue_@issue.Id##}#</div>", 
      "field": "Issue_@issue.Id", 
      "filterable": { 
      extra:false, 
        operators: { 
         string:{ eq: "Is"} 
        }, 
        ui: function (el){ 
          el.kendoDropDownList({ 
          dataSource: [ 
           { 'value': 0, text:'Error' }, 
           { 'value': 1, text:'OK' }, 
           { 'value': 2, text:'Cat3' }, 
           { 'value': 3, text:'Cat2' }, 
           { 'value': 4, text:'Cat1' }, 
           { 'value': 5, text:'Fail' } 
          ], 
          dataTextField: "text", 
          dataValueField: "value", 
          optionLabel: "--Select Value--", 
          cell: {operator: "eq"} 
          }); 
         } 
      }, 
      "encoded": true 
      } 
      </text> 
     } 
    ], 
    "pageable": { "buttonCount": 10 }, 
    "sortable": { "mode": "multiple" }, 
    "selectable": "Single, Row", 
    "filterable": true, 
    "resizable": false, 
    "scrollable": false, 
    "dataSource": { 
     "transport": { 
      "prefix": "", 
      "read": { 
       "url": ""} 
     }, 
     "pageSize": 20, 
     "page": 1, 
     "total": 0, 
     "type": "aspnetmvc-ajax", 
     "sort": [{ "field": "Well", "dir": "asc"}], 
     "schema": { 
      "data": "Data", 
      "total": "Total", 
      "errors": "Errors", 
      "model": { "id": "Well", "fields": { 
      "Severity":{"type":"number"}, 
      "Potential":{"type":"number"}, 
      "DaysToExpiry":{"type":"number"}, 
      "Issue_1":{"type":"number"}, 
      "Issue_2":{"type":"number"}, 
      "Issue_3":{"type":"number"}, 
      "Issue_4":{"type":"number"}, 
      "Issue_5":{"type":"number"}, 
      "Issue_6":{"type":"number"}, 
      "Issue_7":{"type":"number"} 
       } 
      }    
     }, 
     "batch": true 
    } 
}); 

$.fx.off = true; 

}）;

  </script>