Kendo Grid ClientTemplate在數據呈現之前運行

至少這是我的最佳拍攝。我有以下劍道電網：Kendo Grid ClientTemplate在數據呈現之前運行

@(Html.Kendo().Grid(Model) 
       .Name("MarketsGrid") 
       .Columns(columns => 
       { 
        columns.Bound(mc => mc.MarketId); 
        columns.Bound(mc => mc.MarketName); 
        columns.Bound(mc => mc.MarketColor).ClientTemplate("<div id=\"colorcell#= data.MarketId #\">#= colorizeGridcell(data) #</div>"); 
        columns.Command(cmd => cmd.Custom("EditMarket").Click("editMarket")); 
       }) 
       .DataSource(dataSource => dataSource.Ajax().ServerOperation(false)) 
      )

在我的模型來自我的控制器：

@model IEnumerable<Bl.ViewModels.MarketGridViewModel>

請注意，我只有列單元格內的股利能夠裏面唯一識別它們JS在函數觸發時。但是，因爲它似乎在格渲染功能將不會被調用 - 從而使含有「TD」已經被渲染，但在此之前，如下：

function colorizeGridcell(data) { 
    var selector = "#colorcell" + data['MarketId']; 
    var divContext = $(selector); 
    var tdContext = divContext.parent("td"); 
    tdContext.css({ 
     "background-color": data['MarketColor'], 
     "padding": "5px 5px 5px 5px", 
     "background-clip": "content-box" 
    }); 
}

我覺得現在的目的是給你非常清楚。我希望根據從數據庫返回的數據通過控制器動態着色Color列的單個單元格。嗯，這方法是行不通的，因爲它在我看來，對電網的實際表如此渲染之前divContext也不tdContext既不存在，或者JavaScript函數被調用更好的選擇是返回以下對象：

{ 
    "context": { 
     "__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR": false, 
     "_html5shiv": 1, 
     "jQuery19101523141442672757": 4 
    }, 
    "selected": "#colorcell1" 
}

現在，如果我在開發人員工具的控制檯內手動執行上面的JavaScript，這一切都很好，並期望。我已經嘗試了許多方法，沒有任何成功。任何想法如何我可以實現這種行爲？

在此先感謝！

來源

2016-03-25 Joseph

ClientTemplate在呈現最終表之前應用。您需要使用以下js中的dataBound事件：

function onDataBound(e) { 
     var columns = e.sender.columns; 

     var rows = e.sender.tbody.children(); 
     for (var ri = 0; ri < rows.length; ++ri) { 
      var row = $(rows[ri]); 
      var cell = row.children().eq(2); 
      cell.css({ 
       "background-color": e.sender.dataItem(row)['MarketColor'] 
      }); 
     } 
    }

這應符合您的需求。

來源

2016-03-27 22:25:31

Kendo Grid ClientTemplate在數據呈現之前運行

回答

相關問題