Add data to grid by DataSource.add() cause an error 'field is not defined'.

[Worawat]

Hi,
I have this error for days, i'm find out how to fix this in this forum and still does not get it fix.
I have two grid in same page, each bind with datasouce and have a command button in the toolbar for add a record.

When i click at 'Add fee/cost' it work fine but then when i click at 'Add Loan' a error occured.
I dont know how to fix this, any one please me.

try
http://jsfiddle.net/mBYxS/7/ 

[Alexander Valchev]

Hi Worawat,

Your code looks ok. I tested your example and the error appears in jsFiddle, but not when I ran the example locally. Could you please confirm that?
I believe the error in jsFiddle is caused by scope issues - if you define the schema inside the grid configuration everything works as expected. For example: http://jsfiddle.net/mBYxS/12/ 

All the best,
Alexander Valchev
the Telerik team

[Worawat]

Hi Alexander,

Thanks, I thought that cause from I don't well understand about the Model and Datasource.

I have changed from http://jsfiddle.net/mBYxS/7/ to http://jsfiddle.net/mBYxS/14/ and every work fine.

If you have more detail about model and datasource in any document or demo it will be great.

Thanks.

[Alexander Valchev]

Hello Worawat,

The dataSource's documentation could be found here, you may also check our code library projects as they give a brief idea how to set up dataSource binding from remote services.

Kind regards,
Alexander Valchev
the Telerik team

[TrentCioran]

Hey Telerik Team,

Look like I'found a bug in the Q1 2012 release. This code
 based on the setup (just forked and modified, kendo version 2011.9.1129)  by Worawat shows the Parent column contents as supposed to, but this other that uses the latest kendo release (2012.1.322) does not show it.

Looks like a bug with the template processing.


-Regards,
Manuel

[Alexander Valchev]

Hello Manuel,

In the first example I cannot see any field or column with the name "Parent", could you please tell me if I am missing something?

In the second example I noticed that the add new record functionality is not working. I believe that problem is caused by the fact that the field "HasPic" was not defined in the create function.

create: function () {
            $('#grid').data('kendoGrid').dataSource.add({
                Id: 'idString',
                Name: 'New',
                Description: 'Description',
                HasPic: false, //in the original code there is no HasPic field, which is causing error: Uncaught ReferenceError: HasPic is not defined
                Parent: {}
            });
        }

In addition please have in mind that the dataSource does not support hierarchical objects, that is why the Parent.Name field is not shown.

I have edited the jsFiddle example, please check it and let me know if I misunderstood you.

Greetings,
Alexander Valchev
the Telerik team

[TrentCioran]

Thanks Alexander,

After some investigation I realized that you need to set all fields defined in the schema when adding a new record. For the embedded object I use the workaraound proposed in tis posts http://www.kendoui.com/forums/framework/data-source/working-with-complex-json-objects.aspx but also used to add a new field during parsing ParentName that does what the template was supposed to do. Not as clean as I wish it could be but it does the work http://jsfiddle.net/cDFT8/3/

Regards,

[Jesper]

This makes no sense. Omitting a column should lead to it being null if the field is nullable, else it should be set to a default value.

[Devon]

I need to add objects to a datasource dynamically and I am having a similar issue I think.

Here's my code:

var packageDataSource = new kendo.data.DataSource({

                schema: {

                    model: {

                        id: "id",

                        fields: {

                            Name: { type: "string" },

                            Status: { type: "string" }

                        }

                    }

                }

            });

 

            for (var a = 0; a < packages.length; a++) {

                packageDataSource.add([{

                    ID: packages[a].ID,

                    Name: packages[a].Name,

                    Status: packages[a].Status

                }]);

            }

It is adding objects to the datasource but they seem to be one "level" too deep.

For example, when I try apply the datasource to a list using the following template I'm getting a Uncaught ReferenceError: Name is not defined error.

Template:

<script type="text/x-kendo-template" id="packagesTemplate">       

        <h3 class="item-title">${Name}</h3>

        <p class="item-info">Status: ${Status}</p>       

        <p>

            <select>

            <option value="Pending">Pending</option>

            <option value="Delivered">Delivered</option>

            <option value="Damaged">Damaged</option>

            <option value="Refused">Refused</option>

            </select>

        </p>       

    </script>

Here's part of the datasource log from Chrome's javascript console. Can anyone help me with this??

o.extend.init

1. _aggregate: undefined
2. _aggregateResult: Object
3. _data: o.extend.init[2]
   1. 0: B.extend.f
      1. 0: o.extend.init
         1. ID: 1
         2. Name: "Package 1"
         3. Status: "Pending"
         4. _events: Object
         5. parent: function (){return b}
         6. uid: "da0754f0-6981-4025-bc43-a41dd4d666d1"
         7. __proto__: B.extend.b
      2. _events: Object
      3. dirty: false
      4. id: ""
      5. parent: function (){return c}
      6. uid: "70d7b698-91ed-49db-b1eb-a47238152127"
      7. __proto__: B.extend.b

1. 1: B.extend.f
   1. 0: o.extend.init
      1. ID: 2
      2. Name: "Package 2"
      3. Status: "Pending"
      4. _events: Object
      5. parent: function (){return b}
      6. uid: "bbd8d94b-9333-41ef-8adf-748c56b01004"
      7. __proto__: B.extend.b
   2. _events: Object
   3. dirty: false
   4. id: ""
   5. parent: function (){return c}
   6. uid: "bc6af97e-922c-4168-af34-146cdf645aa2"
   7. __proto__: B.extend.b
2. _events: Object
3. length: 2
4. parent: function (){return b._parent()}
5. type: function (){e.apply(this,arguments)}
6. __proto__: B.extend.b
1. _destroyed: Array[0]
2. _events: Object
3. _filter: undefined
4. _group: Array[0]
5. _map: Object
6. _page: undefined
7. _pageSize: undefined
8. _prefetch: Object
9. _pristine: Array[0]
10. _ranges: Array[0]
11. _skip: undefined
12. _sort: undefined
13. _take: undefined
14. _total: 2
15. _view: o.extend.init[2]
16. data: function (a){var c=this;if(a!==b)c._data=this._observe(a),c._total=c._data.length,c._process(c._data);else return c._data}
17. options: Object
18. reader: p.extend.init
19. transport: p.extend.init
20. __proto__: B.extend.b

[Jesper]

The dataSource.add()-method does not expect an array as argument. You should pass it an object.

[Devon]

Ah thanks man!! 

All is sorted now!!!