This is a migrated thread and some comments may be shown as answers.

Multiple grids on same page : 2nd one loading dynamically

0 Answers 479 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Rahul
Top achievements
Rank 1
Rahul asked on 07 Jan 2012, 07:29 AM
Hi,

I have 2 grids on the same page. Selecting a record from the first one should pass and id to the datasource for the second grid and then the second grid loads according to the appropriate id selected.

how can i refresh the datasource2 to pass a new url to the second grid each time. I am using $("#grid1").data("kendoGrid").dataSource.read();
to refresh datasource2 each time on select but unable to pass the id to the other grid.

if i define it inside a function- grid 2 does not find datasource2. if the var declaration for datasource2 is open- unable to pass the dynamic id to it.

here is code snippet :
 dataSource2 = new kendo.data.DataSource({
        
                   transport: {
               read: {url:vid + "properties.json",
                         dataType:"json"}
        },
        pageSize: 3,     

               }); 
}


var dataSource = new kendo.data.DataSource({
        
        transport: {
            read: {url:"topics.json",
                      dataType:"json"}
        },
        schema: {
            model: {
                id: "topic_id",
                fields: {
                    TopicID: { type: "string" },                    
                    name: { type: "string" },
parent_topic_name: { type: "string" },
                    owner_name: { type: "string" },
description: {type: "string"},

                }
            }
        },

        pageSize: 8,       

    });



function creategrid1(){
 

$("#grid1").kendoGrid({
    dataSource: dataSource2,   
    pageable: true,
    selectable: true,
autoBind: false,
toolbar: kendo.template($("#template").html()),
   columns: ["topic_property_id", "name","data_type","sort_order","description"]
   
});
}


$("#grid").kendoGrid({
    dataSource: dataSource,   
    pageable: true,
    selectable: true,
toolbar: kendo.template($("#template").html()),
    columns: ["topic_id", "name","parent_topic_name","owner_name","description"],

    change: function() {
        var row = this.select();
        var id = row.data("id");


vid=id;
readid(vid)         

$("#grid1").data("kendoGrid").dataSource.read();


}
});

creategrid1();

No answers yet. Maybe you can help?

Tags
Grid
Asked by
Rahul
Top achievements
Rank 1
Share this question
or