javascript - how to add combobox with local data to kendo grid column template -
can use way of defining combobox in kendo grid column? can inserted in template of column?
var localdata = [ {"productname":"chai"}, {"productname":"chai1"}, {"productname":"chai2"}, {"productname":"chai3"}, {"productname":"chai4"}, ]; $("#products_dropdownlist").kendodropdownlist({ datatextfield: "productname", datavaluefield: "productid", datasource: localdata });
yes can, if this. first create template input , add class (later use jquery selector)
<script id="product-template" type="text/x-kendo-template"> <input class="combobox"/> </script>
then create dummydata grid, grid datasource, , initialize grid
<script> var localdata = [ {productname:"chai1",productid:1}, {productname:"chai2",productid:2}, {productname:"chai3",productid:3}, {productname:"chai4",productid:4}, {productname:"chai5",productid:5}, ]; var ds = new kendo.data.datasource({ data: localdata }); var griddata = [ {productname:"chai1",productid:1,category:"drink"}, {productname:"chai2",productid:2,category:"food"}, {productname:"chai3",productid:3,category:"food"}, {productname:"chai4",productid:4,category:"drink"}, {productname:"chai5",productid:5,category:"food"}, ]; var gridds = new kendo.data.datasource({ data: griddata }); $("#grid").kendogrid({ columns: [ { field: "productname", template: kendo.template($("#product-template").html()) }], datasource: gridds, databound: function(e){ var grid = $("#grid").data("kendogrid"); var data = grid.datasource.data(); $.each(data, function (i, row) { $('tr[data-uid="' + row.uid + '"]').find(".combobox").kendocombobox({ datatextfield: "productname", datavaluefield: "productid", datasource: ds, value: data[i].productid }) }); } }); </script>
here's looks in action
Comments
Post a Comment