DevExtreme jQuery/JS - JSON Data
To bind the List to data in a JSON format, assign the data's URL to the dataSource option.
JavaScript
- $(function() {
- $("#listContainer").dxList({
- dataSource: "https://jsonplaceholder.typicode.com/posts",
- itemTemplate: function(data, _, element) {
- element.append(
- $("<i>").text(data.id + " | "),
- $("<b>").text(data.title), $("<br />"),
- $("<p>").text(data.body).css({
- "margin-top": 10,
- "white-space": "normal"
- })
- )
- }
- });
- });
Note that you can also use a JSONP callback parameter supported by jQuery.ajax().
JavaScript
- $(function() {
- $("#listContainer").dxList({
- dataSource: "http://www.example.com/dataservices/jsonpdata?callback=?",
- // ...
- });
- });
If you need to process data after obtaining it, implement the CustomStore. For details, see the Custom Sources topic.
See Also
Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.