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

Change datasource url on Grid

9 Answers 4618 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Tycho
Top achievements
Rank 1
Tycho asked on 17 Jan 2012, 03:52 PM
Hi,

I've got a dropdown and a grid. The idea is to change the data displayed in the grid depending on the selection made in the dropdown.
The datasource uses a json service. When the page is loaded the grid is filled with the data from the json service. After changing the selection in the dropdown the transport url is changed according to the alert. But capturing the network traffic reveals that the original url is called instead of the one with the new parameter. 

The html excerpt:
<input id="ddlFacility" />
 
<div id="SiteOverviewTabStrip">
            <ul>
                <li class="k-state-active">Regional dashboard</li>
                <li>Production summary</li>
            </ul>
            <div class="placeholder table">
                <div id="regionalGrid">
                </div>
            </div>
            <div class="placeholder graph">
                <div id="productionGrid">
                </div>
            </div>
</div>


The script:
// bind to the change event and update the data source url
 var ddlFacility = $("#ddlFacility").data("kendoDropDownList");
ddlFacility.bind("change", function () {
     var grid = $("#regionalGrid").data("kendoGrid");
     grid.dataSource.options.transport.read.url = "/_layouts/SharePoint.Services/ProxyService.svc/GetFacilityRegionalData?origin=" + this.value();
 
  grid.dataSource.read();
      grid.refresh();
  alert(grid.dataSource.options.transport.read.url);
});


Any suggestions?

Kind regards,
Tycho

9 Answers, 1 is accepted

Sort by
0
Accepted
Joel
Top achievements
Rank 1
answered on 17 Jan 2012, 04:02 PM
You have transport and options reversed. Here's what you want set
dataSource.transport.options.read.url = "/_layouts/SharePoint.Services/ProxyService.svc/GetFacilityRegionalData?origin="this.value(); 


Joel
0
Tycho
Top achievements
Rank 1
answered on 17 Jan 2012, 04:03 PM
Thanks! That did it.
0
Tycho
Top achievements
Rank 1
answered on 25 Jan 2012, 02:28 PM
Is there a way to update the columns after changing the datasource on a grid?
I'm changing the url to another json call that returns other data so i would like to update the column names.

I tried the following but that didn't update the column names. 
var grid = $(gridname).data("kendoGrid");
grid.columns =[ { title: "NewNameColumn1" },{ title: "Column 2" },{ title: "Column 3" }] ;
grid.refresh();
0
Joel
Top achievements
Rank 1
answered on 27 Jan 2012, 02:56 AM
Hmm, interesting ... I've wondered about this in the past. I haven't tried it as yet but I'm willing to bet the only way to do this right now is to reconfigure/build the entire grid.
0
Tycho
Top achievements
Rank 1
answered on 27 Jan 2012, 10:51 AM
Would you happen to have an example on how to rebuild/reconfigure a grid ?

I've tried adding a placeholder div around the grid, call $('PlaceHolder').empty(), append a new div and create the grid again, but can't get it working.
0
Rahul
Top achievements
Rank 1
answered on 02 Feb 2012, 12:47 PM
wow thanks guys, this kept me hooked up for a while. Works perfect. thanks tycho and Joel !
0
Shaun
Top achievements
Rank 1
answered on 27 Mar 2015, 03:12 PM
Thanks for this. 
0
Mohammed
Top achievements
Rank 1
answered on 12 Aug 2016, 04:54 PM
this is not working bcz datasource.transport does not exist.
0
T. Tsonev
Telerik team
answered on 18 Aug 2016, 07:20 AM
Hello Mohammed,

Please open a separate thread with more details for your case.

Without a reproduction case it's hard to tell if the problems you're experiencing are related to the discussion here.

Regards,
T. Tsonev
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
Tags
Grid
Asked by
Tycho
Top achievements
Rank 1
Answers by
Joel
Top achievements
Rank 1
Tycho
Top achievements
Rank 1
Rahul
Top achievements
Rank 1
Shaun
Top achievements
Rank 1
Mohammed
Top achievements
Rank 1
T. Tsonev
Telerik team
Share this question
or