jquery - How to customize kendo grid update button? -
i newbie kendo web ui. want implement inline editing grid.when click add/edit button got inline form fields update button, want to unique id every row , customized update button functionality can update database.
<table id="grid11" style="table-layout: fixed; display:none;"> <colgroup> <col style="width:10%"> <col style="width:20%"> <col style="width:20%"> <col style="width:20%"> <col style="width:30%"> </colgroup> <thead> <tr> <th><font style="font-weight:bolder; color:#7ea700; font-size:16px;">qty</font></th> <th><font style="font-weight:bolder; color:#7ea700; font-size:16px;">unit</font></th> <th><font style="font-weight:bolder; color:#7ea700; font-size:16px;">style number</font></th> <th><font style="font-weight:bolder; color:#7ea700; font-size:16px;">description</font></th> <th><font style="font-weight:bolder; color:#7ea700; font-size:16px;">command</font></th> </tr> </thead> <tbody> <tr> <td>10</td> <td>12</td> <td>231234</td> <td>itemdescription</td> <td></td> </tr> </tbody> </table> <script> $(document).ready(function(){ $("#grid11").kendogrid({ datasource: { schema: { model: { id: "id" }, fields: { id: { editable: false, nullable: true }, qty: { validation: { required: true } }, unit: { validation: { required: true } }, stylenumber: { validation: { required: true } }, description: { validation: { required: true } }, } }, pagesize: 5 }, pageable: true, height: 300, sortable: true, toolbar: [{name:"create",text:"add"}], editable: "inline", columns: [ {field: "qty"}, {field: "unit"}, {field: "stylenumber"}, {field: "description"}, { command: ["edit", "destroy"], title: " ", width: "172px" }] }); $("#grid11").show(); }); </script>
please me.
thanks
<script> $(document).ready(function(){ var len = 0; $("#grid11").kendogrid({ datasource: { transport: { read: "your_read_url", update: { url: "url_for_update", type: "post", complete: function(result) { } }, create: { url: "url_for_add", type: "post", complete: function(result) { }, }, destroy: { url: "url_for_delete" , type: "post", complete: function(result) { }, } }, schema: { model: { id: "id" }, fields: { id: { editable: false, nullable: true }, qty: { validation: { required: true } }, unit: { validation: { required: true } }, stylenumber: { validation: { required: true } }, description: { validation: { required: true } }, } }, pagesize: 5 }, pageable: true, height: 300, sortable: true, toolbar: [{name:"create",text:"add"}], editable: "inline", columns: [ {field: "qty"}, {field: "unit"}, {field: "stylenumber"}, {field: "description"}, { command: ["edit", "destroy"], title: " ", width: "172px" }] }); $("#grid11").show(); }); </script>
Comments
Post a Comment