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

data connection between 2 grids on same page

6 Answers 346 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Rahul
Top achievements
Rank 1
Rahul asked on 07 Jan 2012, 03:23 PM
Hi,

i have a master grid displaying on a page, depending on the selection of the grid row, have to generate a dynamic url to be passed to the datasource of grid2 and this reloads the data into grid 2.

is there a way where on change event of grid 1: i can pass a parameter via datasource.read() for loading data into grid 2 dynamically.\


thanks in advance.

R

6 Answers, 1 is accepted

Sort by
0
Joel
Top achievements
Rank 1
answered on 11 Jan 2012, 05:46 AM
I thought that I could set the url property on the dataSource.transport.read object before called the dataSource.read method but I was wrong. So, I also need something similar, i.e. update dataSource url and no use of filters
0
Joel
Top achievements
Rank 1
answered on 11 Jan 2012, 06:05 AM
Figured it out. Thought not obvious from the documentation, you can update the dataSource read url in this fashion:

var grid = $grid.data("kendoGrid");
grid.dataSource.transport.options.read.url = dynamicUrl;
grid.dataSource.read();
0
Rahul
Top achievements
Rank 1
answered on 11 Jan 2012, 07:18 AM
so dynamicUrl gets updated inside the change function of the first grid and then dynamically updates the dratasource2 reads.
Below is my code for both grids with change function for grid reloading the datasource2 for grid2 :
var dynamicUrl;
$("#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");
        $("#log")
            .html(dataSource.get(id).get("parent_topic_name") + " > " + dataSource.get(id).get("name") + "        " +"\
                  Owned By :" + dataSource.get(id).get("owner_name"));
$("#desc")
            .html("Description : " + "<br>" + dataSource.get(id).get("description"));

dynamicUrl = id + "/properties.json";
var grid1 = $grid1.data("kendoGrid");
            grid1.dataSource.transport.options.read.url = dynamicUrl;
            grid1.dataSource.read();



    }


});


var dataSource2 = new kendo.data.DataSource({
        transport: {
            read: {url:"dynamicUrl",
                      dataType:"json"}
        },
       schema: {
            model: {
                id: "topic_property_id",
                fields: {
                    topic_property_id: { type: "string" },                    
                    name: { type: "string" },
data_type: { type: "string" },
                    sort_order: { type: "number" },
description: {type: "string"},
                }
            }
        },
        pageSize: 8,
    });



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

am i missing something ?  the json file at the url id/properties.json looks fine.



0
Joel
Top achievements
Rank 1
answered on 12 Jan 2012, 09:40 AM
I'm not sure if you have $grid1 initialized but if not, just $("#grid1") instead.

It would help if you had what you were trying to do set up under jsfiddle. You can use this sample as a starting point: http://jsfiddle.net/CuQDc/5/ 

0
durga bhavani
Top achievements
Rank 1
answered on 27 Jun 2012, 11:29 AM
hi ,
   I have two grids.I want to move the data from one grid to another grid when i click on the button.can u please send the sample code for moving data from one grid to another grid.
0
rupendra
Top achievements
Rank 1
answered on 10 Dec 2013, 08:22 AM
plz anybody can send me the two grid implementation code..its urgent
Tags
Data Source
Asked by
Rahul
Top achievements
Rank 1
Answers by
Joel
Top achievements
Rank 1
Rahul
Top achievements
Rank 1
durga bhavani
Top achievements
Rank 1
rupendra
Top achievements
Rank 1
Share this question
or