CODEWITHSUNDEEP
gridkendo-ui
NavaDeebanS
NavaDeebanS

Reputation: 35

Kendo UI adding row at Runtime(Client Side)

I am able to add a row at runtime using .js file into Kendo Data Source, but I havent seen from the form(UI), I followed the below steps

var vgrid = $("#grdEntitys").data("kendoGrid");
var datasource = vgrid.dataSource;
var newRecord = { No: "8164",ModellNo: "147",ID: "Test01", Name: "TEST"}
datasource.insert(newRecord);

then It throws an error "TypeError: Cannot read property 'AttributeValue' of undefined", if we look at the console log, I am able to see the incrmented rows count as well as the newly inserted record. But in UI there is no change(UI Grid).

could you please anyone let me know, how to add row at client side?

Thanks in advance

Upvotes: 1

Views: 7857

Answers (2)

Mohammad Atiour Islam
Mohammad Atiour Islam

Reputation: 5708

you can use the script in you event to add item in your grid.

var dataSource = $("#CustomerPackageChannelKendoGridAdd").data("kendoGrid").dataSource;  
           // Get value from another field  
     var _JV_ACCOUNT_ID = $('#JV_ACCOUNT_ID').val();  
     var _JV_ACCOUNT_NAME = $('#JV_ACCOUNT_NAME').val();  
     var _JV_ACCOUNT_CODE = $('#JV_ACCOUNT_CODE').val();  
     var _JV_NOTES = $('#JV_NOTES').val();  
     var _JV_DATE = $('#JV_DATE').val();  
     var type = $('#JV_Transaction_TYPE').val();  
    // You can set condition if required for you  
     if (CheckExistingData(gridDataAdd, _JV_ACCOUNT_ID) == false) {  
       currentId += 1;  
       dataSource.add(  
         {  
            id: currentId,  
            JV_ACCOUNT_ID: _JV_ACCOUNT_ID,  
            JV_ACCOUNT_NAME: _JV_ACCOUNT_NAME  
           , JV_ACCOUNT_CODE: _JV_ACCOUNT_CODE  
           , JV_NOTES: _JV_NOTES  
           , JV_DATE: _JV_DATE  
           , JV_DEBIT_AMOUNT: _JV_DEBIT_AMOUNT  
           , JV_CREDIT_AMOUNT: _JV_CREDIT_AMOUNT  
         });  
     }

For more you can also see this:

Upvotes: 0

Vojtiik
Vojtiik

Reputation: 2560

For insert you have to specify index (Insert) :

var dataItem = dataSource.insert(0, { name: "John Doe" });

Alternatively you could use Add where you don't have to specify the index:

<script>
var dataSource= new kendo.data.DataSource({
  data: [
    { name: "Jane Doe", age: 30 }
  ]
});
dataSource.add({ name: "John Doe", age: 33 });

Upvotes: 2

Related Questions