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

Not able to read data from remote server

6 Answers 179 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Parag
Top achievements
Rank 1
Parag asked on 08 Oct 2013, 12:57 PM
var dataSource = new kendo.data.DataSource({
        transport: {
          read: {
            url: "http://localhost/apartment/data.php?api=profile",
            dataType: "json",
            type: "GET"
          }
        }

    });

    var viewModel = kendo.observable({
      datasource: dataSource
    });

   var listView = new kendo.View("profile-template", {
    model: viewModel
   });

    var listHtml = listView.render();
    $("#profile-view table").html(listHtml);

  My TEMPLATE: 
  
   <script id="profile-template" type="text/x-kendo-template">
   <tr>
     <td>Name</td><td> <span>#= datasource.name #</span></td>
   </tr>
   <tr>
     <td>Email</td><td>#= name #</td>
   </tr>
   <tr>
     <td>Mobile Number</td><td>9629014027</td>
   </tr>
   <tr>
     <td>Apartment</td><td>Green Age</td>
   </tr>
 </script>

6 Answers, 1 is accepted

Sort by
0
Ignacio
Top achievements
Rank 1
answered on 08 Oct 2013, 08:19 PM
There are many ways to do this.
here is a sample that resembles what you want to do
Read from a remote server and bind to a List.


0
Parag
Top achievements
Rank 1
answered on 09 Oct 2013, 07:26 AM
Hi,

 I am getting this error: 
  Uncaught TypeError: Object #<Object> has no method 'slice'

 I am working on mobile app. I followed your instructions and modified according to mobile events like this..

 var dataSource = new kendo.data.DataSource({
       transport: {
           read: {
               url: "http://localhost/apartment/data.php?api=profile",
               dataType: "json"
           }
       }
   });

   $("#profileList").kendoMobileListView({
       dataSource: dataSource,
       template: $("#profile-template").text()
   });




0
Parag
Top achievements
Rank 1
answered on 09 Oct 2013, 08:13 AM
Hi,

   I fixed this issue by changing  the response format . Initially i was getting JSON object  in reponse. Now i changed into JSON ARRAY.  Its working fine.  

 But i would like to know how to append JSON OBJECT into HTML? 
0
Ignacio
Top achievements
Rank 1
answered on 09 Oct 2013, 06:55 PM
So the way this works is that you assign a datasource to your html ListView.
And you assign a template to your ListView.
This template repeats itself for every element on the datasource.
So, to append elements to your html you just need to add those elements to your datasource.
Here is an example
0
Parag
Top achievements
Rank 1
answered on 09 Oct 2013, 10:45 PM
I believe list views works with a response of Collection type, but what if my response is not a collection. For example, I just want to append profile information which comes as a json object, and not a json array. What kind of view should be used in that case?
0
Parag
Top achievements
Rank 1
answered on 10 Oct 2013, 12:16 AM
OK. I finally figured it out. What you need is to specify the schema, and the model, and at least of field in your model

<div id="profile"></div>
    
<script type="text/x-kendo-template" id="template">
    <div>Name : #:name#</div>
    <div>Phone : #:phone#</div>
    <div>Landmark : #:landmark#</div>
    <div>City : #:city#</div>
</script>

<script>
var template = kendo.template($("#template").html());
var dataSource = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "http://54.254.164.98:8888/profile",
                        dataType: "jsonp"
                    }
                },
                schema: {
                    model: {
                        fields: {
                            user_id: { type: "string" },
                            name: { type: "string" },
                            phone: { type: "string" },
                            landmark: { type: "string" },
                            city: { type: "string" }
                        }
                    }
                }
,
                change: function() {
                    $("#profile").html(kendo.render(template, this.view()));
                }
            });

            dataSource.read();

</script>
Tags
Data Source
Asked by
Parag
Top achievements
Rank 1
Answers by
Ignacio
Top achievements
Rank 1
Parag
Top achievements
Rank 1
Share this question
or