Datasource not read

[Christophe]

I manage to make anything work with the , where ever I try to use one, grid or .

my code is: 

 

thanks for the assistance

 

 var customersData = new kendo.data.DataSource({
            dataSource: {
                type: "odata",
                transport: {
                    read: {
                        url: SCH.webapp_api + '/scheduler/customers/data',
                        dataType: "json",
                        type: "GET",
                        cache: false,
                    },
                    schema: {                       
                        model: {
                            fields: {
                                id: { type: "number" },
                                name: { type: "string" },
                                company: { type: "string" },
                            }
                        }
                    }
                },
                autoSync: true,
                serverFiltering: true,
            }
        });

        $("#customers").kendoDropDownList({
            optionLabel: "Choose a customer",
            filter: "contains",
            dataTextField: "name",
            dataValueField: "id",
            dataSource: customersData,
            index: 0
        });

[Petar]

Hello Christophe,

What I can conclude you are trying to do is to bind your remote data to a DropDownList. 
To do so you may take a look at this example from our documentation. It represents how one can bind remote data to a DropDownList.

If you want to do more complex data binding with the DropDownList I would recommend to check this server filtering demo and this DropDownList virtualization demo. 

Also, be sure that your API is returning data in the correct format. This is an example of properly structured data that could be read by the DropDownList:

[
{ProductID: 1, ProductName: "Chai", UnitPrice: 18, UnitsInStock: 39, Discontinued: false},
{ProductID: 2, ProductName: "Chang", UnitPrice: 19, UnitsInStock: 17, Discontinued: false},
{ProductID: 3, ProductName: "Aniseed Syrup", UnitPrice: 10, UnitsInStock: 13, Discontinued: false}
]

All of the above are just suggestions what you want to do and where the problems in your code might come from.

If you don't succeed to run your project with the above examples, to be able to help you we will need more details about your project, what are you trying to achieve and what is the structure of data you return. The best scenario would be to send us a Dojo with your code containing a link to your API.


Regards,
Petar
Progress Telerik

[Christophe]

Petar, I've looked at all the examples and I find a way to handle the response of my REST API

my data source is in this format

 

[

 currentPage: 1,

 perPage: 25,

 : 2,

 data: [
   {ProductID: 1, ProductName: "Chai", UnitPrice: 18, UnitsInStock: 39, Discontinued: false},
   {ProductID: 2, ProductName: "Chang", UnitPrice: 19, UnitsInStock: 17, Discontinued: false},
   {ProductID: 3, ProductName: "Aniseed Syrup", UnitPrice: 10, UnitsInStock: 13, Discontinued: false}

   ]

]

 

How do I fetch the data in the DropdownList please?

[Petar]

Hello Christophe,

Please take a look at this example. In it, the data for the DropDownList is being fetched from a remote location. 

What is different here compared to the examples you may have seen is that we fetch the data and after the data from the remote server come we pass selected elements from it to the DropDownList. As you can see in the console, our API returns 77 records but we use only 4 of them in the DropDownList. 

You should do the same with your application. When you get the data from your API you must pass the data array to the DropDownList's dataSource. 

In your case, following the structure you've sent, in the above example, you must change

dataSource: [data[1], data[2], data[6], data[10]]

to 

dataSource: data[3]

Note that I've removed the square brackets in the second code snippet. This is because dataSource expects to receive a data array. In my example, I am packing the selected elements to an array. Your API returns an array of data which element 3 is another array with the data you want to visualize in the DropDownList. This is why you should directly pass element 3 of your API response to the dataSource.  
 

Regards,
Petar
Progress Telerik