How to assign skip and take value in kendo dropdown

Question

I need to populate a lot of data into a kendo dropdown list(probably could go to millions). SO I am trying to use serverFiltering of kendo to achieve that. I checked their official api in github and they are using parameters skip and take and it seems to be working fine for them. I am trying to send skip and take through the following code

$("#parentProductId").kendoDropDownList({
        filter: "startswith",
        dataTextField: "ProductName",
        dataValueField: "id",
        optionLabel: ' --Select--',
        dataSource: {
            serverFiltering: true,
            data: { 
                skip:0 , 
                take: 10
            },
            transport: {
                read: {
                    url: webApiUri + '/Product/ProductSel',
                    beforeSend: function (xhr) {
                        xhr.setRequestHeader("Authorization", "Bearer " + accessToken);
                    }
                }
            }
        }
    });

My Apicontroller is as follows: -

[Route("api/Product/ProductSel")]
public List<SpProductSel_Result> ProductGet(int skip, int take)
   {

      //return result
   }

Now my problem is this api controller is not being called. What am I doing wrong here?

Answer 1

One of the possibility can be you need to use correct transport.read configuration. When using Tranport configuration we specify data as a part of read please see the code snippet below.Refer to kendo documentation transport.read.data

Example # 1 SEND ADDITIONAL PARAMETERS As Object

transport: {
read: {
  url: "http://demos.telerik.com/kendo-ui/service/twitter/search",
  dataType: "jsonp", // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
  data: {
    q: "html5" // send "html5" as the "q" parameter , like int skip and take 
  }
}

EXAMPLE # 2 - SEND ADDITIONAL PARAMETERS BY RETURNING THEM FROM A FUNCTION

 transport: {
    read: {
      url: "http://demos.telerik.com/kendo-ui/service/twitter/search",
      dataType: "jsonp", // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
      data: function() {
        return {
          skip: 0,     // send 0 as the "skip" parameter
          take:10      // send 10 as the "take" parameter
        };
      }
    }
  }