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

Proper Syntax for transport READ on a GET (ASP.Net MVC)

3 Answers 399 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Rich
Top achievements
Rank 1
Rich asked on 26 Jul 2012, 03:00 PM
Hi There, i cannot get the datasource to work. Specifically the issue is passing the GET parameter. The only way i've gotten the read to work is to place the paramter directly in the READ URL:


$(document).ready(function () {
            var dsCategories = new kendo.data.DataSource({
                transport: {
                    read: "/CostDriver/GetCostDriverCategoriesByRegion/" + $("input[name='region']:checked").val() ,
            ...

The issue is, on the click of radio button from where this value is coming from, the read uses the ORIGINAL value from the radiobuttongroup from when the page initially loads. Onclick of this radiobuttongroup calls the datasource read but the new value is NEVER sent.

HOW HOW HOW do you properly use the DATA property in the transport? I have tried everything and it does not work.

$(document).ready(function () {
            var dsCategories = new kendo.data.DataSource({
                transport: {
                    read: "/CostDriver/GetCostDriverCategoriesByRegion/",
                    data: { "regionId": $("input[name='region']:checked").val() }
                }
            });
            $("#selectCategory").width(180).kendoComboBox({
                dataTextField: "CostDriverCategoryName",
                dataValueField: "CostDriverCategoryId",
                dataSource: dsCategories
            });

            $("#selectCommodity").width(180).kendoComboBox({ enabled: false });

            $("input[name='region']").click(function () {
                alert($("input[name='region']:checked").val());
                dsCategories.read();
            });
        });

3 Answers, 1 is accepted

Sort by
0
Accepted
Atanas Korchev
Telerik team
answered on 26 Jul 2012, 03:20 PM
Hi,

Using the data parameter is as simple as:

transport: {
       read: {
             url: "/CostDriver/GetCostDriverCategoriesByRegion/" , 
             data: {
               region: $("input[name='region']:checked").val() 
             }
       }
}

Please refer to the documentation for additional info.

All the best,
Atanas Korchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Rich
Top achievements
Rank 1
answered on 26 Jul 2012, 03:31 PM
Hi Atanas, Yes that does seem to pass the parameter! Thanks. But the parameter is always the same.. set at page load even though i am changing the value. I know it's changing correctly in the page.. please see below (alerted values are correct)

Here is my current implementation:

$(document).ready(function () {
            var dsCategories = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "/CostDriver/GetCostDriverCategoriesByRegion/",
                        data: {
                            "regionId": $("input[name='region']:checked").val() }
                        }
                    }
            });

            $("#selectCategory").width(180).kendoComboBox({
                dataTextField: "CostDriverCategoryName",
                dataValueField: "CostDriverCategoryId",
                dataSource: dsCategories
            });

            $("#selectCommodity").width(180).kendoComboBox({ enabled: false });

            $("input[name='region']").click(function () {
                alert($("input[name='region']:checked").val());
                dataSource.read();
            });
        });


This syntax works... in that the paramater is actually sent. I must add {} directly after the read: for it to sent the data. The issue now is what i had before. the "regionId": $("input[name='region']:checked").val() } value is NEVER updated. Whatever was set when the page loads is sent everytime $("input[name='region']") is clicked. It's like the value is cached or scope issue?? Does calling dataSource.read() cached or something?



**** Edit *** ok got it to work by changing the parameter value in the data to a function:

data: {
                            "regionId": function () { return $("input[name='region']:checked").val(); }
                        }

Would be nice to have a simple demo that shows this scenario as i'm sure this would be very common. Make ajax call passing value from html element.. thanks!
0
Daniel Cuba
Top achievements
Rank 1
answered on 14 Nov 2012, 09:23 PM
Rich, thank you very much, it works to me. I wasted a lot of time trying to solve it.

Is very curious that needed put the value inside a function, no?

In my case a have a single javascript variable.

For example:
var myVar = "testing"
This not works:
myDS: new kendo.data.DataSource({
        transport: {
            read: {
                // the remote service url
                url: "../../api/MyMethod/",
                data: {
                    Id: myVar
                },
                datatype: "json"                
            }
        }

But this works:
myDS: new kendo.data.DataSource({
        transport: {
            read: {
                // the remote service url
                url: "../../api/MyMethod/",
                data: {
                    Id: function () { return myVar; }
                },
                datatype: "json"                
            }
        }
Tags
Data Source
Asked by
Rich
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
Rich
Top achievements
Rank 1
Daniel Cuba
Top achievements
Rank 1
Share this question
or