JSON.parse of string from datasource fails

6 posts, 1 answers
  1. Alex
    Alex avatar
    25 posts
    Member since:
    Dec 2012

    Posted 06 Nov 2014 Link to this post

    I have a field called "Genre" in the datasource  of string type  is  valid JSON.

    What I use JSON.parse with the  Genre data the object created is always null.  If i explicitly create a string with the same string values that are in the Genre field and apply JSON.parse the object is valid and I can access the array. Otherwise if JSON.parse is given the "Genre" data string from the datasource the JSON object has null propeties.   

    <script type="text/x-kendo-template" id="Genretemplate"><br>Genre is of type : #: jQuery.type(Genre) #<br>Genre field value : #: Genre #<br># var testGenre = '[{"id": "22","genre": "punk"}]';#<br># var myobj =JSON.parse(testGenre); #<br>Obj is of type : #: jQuery.type(myobj) #<br>#: myobj[0].genre#<br></script>
     Produces this output 

    Genre is of type : string
    Genre field value : [{"id":"22","genre":"punk"}]
    Obj is of type : array
    punk

    But if I use this in the template above:

    # var myobj =JSON.parse(Genre); #

    I get a error :

    Cannot read property '0'  of null

    I have tried setting the type of Genre in the datasource to 'string' and to 'object' and also leaving it blank, but same result.



       




  2. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 06 Nov 2014 Link to this post

    Hi Alex,

    I tried to replicate the problem here, but it seems to work as expected. What am I missing?

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Alex
    Alex avatar
    25 posts
    Member since:
    Dec 2012

    Posted 06 Nov 2014 in reply to Petyo Link to this post

    Thank you  Petyou -  missing information I could have been more clear on is the  Genre field is from a remote datasource and also perhaps helpfully the template is being using in a grid.
     
     I can send the login info for the site (is password protected, and the issue is shown in the first record, once logged in) directly to you if that is useful?  

    var rocondataSource = new kendo.data.DataSource({
        serverPaging: false,
        serverSorting: false,
        sortable: true,
        batch: false,
        pageSize: 80,
        transport: {
            read: {
                url: "http://urlremoved/api/roconmusic",
                dataType: "json",
                type: "GET"
            },
            update: {
                url: "http://urlremoved/api/roconmusic",
                type: "PUT"
            },
            create: {
                url: "http://urlremoved/api/roconmusic",
                type: "POST"
            },
            destroy: {
                url: "http://urlremoved/api/roconmusic",
                type: "DELETE"
            }
            },
        schema: {
            model: { "id":"id",
                fields: {
                    id: { type: "number" },
                    Eventdate: { type: "date",editable: true },
                    Date: { type: "string",editable: true },
                    Year: { type: "string",editable: true },
                    Category: { type: "string",editable: true },
                    Genre: {  type: "string", editable: true },
                    Artist: { type: "string",editable: true },
                    Band: { type: "string",editable: true },
                    Entry: { type: "string",editable: true },
                    vlink1: { type: "string",editable: true },
                    vlink2: { type: "string",editable: true },
                    vlink3: { type: "string",editable: true },
                    vlink4: { type: "string",editable: true },
                    vlink5: { type: "string",editable: true },
                    vlink6: { type: "string",editable: true },
                    status: { type: "string",editable: true },
                    deathage: { type: "string",editable: true },
                    cod: { type: "string",editable: true },
                    metatags: { type: "string",editable: true }
                }
            }
        }
    });

  5. Answer
    Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 07 Nov 2014 Link to this post

    Hello Alex,

    it's unlikely that the issue you are facing is related to the grid or the remote datasource - they can't influence the string primitive or the JSON.parse implementation. You may try to extract your implementation in a normal javascript function which you will call from the template. This should make it easier to debug and hopefully give you some idea on what the actual problem is. 

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Alex
    Alex avatar
    25 posts
    Member since:
    Dec 2012

    Posted 07 Nov 2014 in reply to Petyo Link to this post

    Yes you are correct is really the Javascript that is the issue as opposed to the kendoui framework. I implemented this function below the grid declaration as you suggested and had the same results where I get an array type returned for the JSON object created, but it does not have any properties and cannot be enumerated/accessed.  Must be something I am not getting with regards to Javascript;  in any case is not a problem with the framework. Thanks for your assistance.

    template: function (e) {
    /*
    e.Genre is a string of format [{"id":"22","genre":"punk"}] retrieved from a REST datasource stored in a remote MySQL db and saved in a text field as json_encoded value from the insert/update of a kendoui multiselect control;
    */
                    var obj  = jQuery.parseJSON(e.Genre);

                   //all the below generate a null properties error
                    return(obj.genre);
                    return(obj[0].genre);
    }
  7. Alex
    Alex avatar
    25 posts
    Member since:
    Dec 2012

    Posted 07 Nov 2014 in reply to Alex Link to this post

    Actually it was  the syntax difference between an array and an object in javascript ; it should  have been:

    myObj[0]["genre"]);

    If that might help some later.
                    
Back to Top
Kendo UI is VS 2017 Ready