Kendo UI Mobile + datasource + listview + PHP

8 posts, 0 answers
  1. Robin
    Robin avatar
    40 posts
    Member since:
    Jul 2012

    Posted 18 Sep 2012 Link to this post

    I can't seem to work out how to populate the listview with jsonp data from PHP. I know there's a very good sample in the demos, but as I can't see the serverside, it's hard for me to know where it all goes wrong. 

    If anyone could have a look at my source and give me some hints in the right direction I'd be forever grateful!

    PHP: http://pastebin.com/h5e3eN3q
    HTML/JS: http://pastebin.com/4rUeJwuh

    Robin

  2. Ali
    Ali avatar
    16 posts
    Member since:
    Aug 2012

    Posted 19 Sep 2012 Link to this post

    You may refer to this JSFiddle to see how it works: http://jsfiddle.net/wZsGc/

    Notes:
    I'm using the JSFiddle Echo JSONP service, to simulate the output I require.

    Your PHP output must be similar to:
    {result: [{name: "a", letter: "a"}, {name: "b", letter: "b"}]}

    Now the reason I'm using:
    parse: function(response) {
               response.result = JSON.parse(response.result);
               return response;
           }
    Because jsfiddle outputs Stringified, thus I'm parsing it. If your PHP output is similar to the above output, then parsing isn't required.

    And you may not require to submit data to your PHP, but I'm submitting the data I want back to the echo service.
  3. Robin
    Robin avatar
    40 posts
    Member since:
    Jul 2012

    Posted 19 Sep 2012 Link to this post

    Thanks a lot Ali, but I still can't make it work when the datasource is the PHP file. 

    I've set it to a static output, which is this:
    {"result":[{"name":"Test","letter":"A"},{"name":"sd1234df","letter":"B"}]}
    (http://www.robinhavre.no/kendo/json.php - source: http://pastebin.com/h5e3eN3q)

    It's just loading without displaying the results. I've also tried removing the parsing bit to no success.

    Updated fiddle: http://jsfiddle.net/wZsGc/2/
  4. Ali
    Ali avatar
    16 posts
    Member since:
    Aug 2012

    Posted 19 Sep 2012 Link to this post

    Add this to your PHP file:
    header("Access-Control-Allow-Origin: *");

    And change the data type to json instead of jsonp. I don't have PHP installed here, I can test it for you once I get home. Or just modify the php file and I can test from jsfiddle on your PHP file.

    To output a JSONP from PHP you need to output the call back function too, your PHP script is only outputing json. If you require a JSONP PHP Script I can help you do so.
  5. Robin
    Robin avatar
    40 posts
    Member since:
    Jul 2012

    Posted 19 Sep 2012 Link to this post

    Tried making the changes but with no luck. I've added a page to edit the PHP directly if you have a chance to take a look at it.

    http://www.robinhavre.no/kendo/edit.php 

    It will edit the json.php file.
  6. Ali
    Ali avatar
    16 posts
    Member since:
    Aug 2012

    Posted 19 Sep 2012 Link to this post

    Done working now!

    http://jsfiddle.net/wZsGc/4/

    Looks like PHP doesn't allow Origin * anymore, thus I had to modify it to http://fiddle.jsfiddle.net

    Also the Javascript removed the content-type header request and changed it to json instead of jsonp. Works without parsing.

    Edit: If you require JSONP for cross domain, I can help you modify your PHP script, but later when I get back home.
  7. Robin
    Robin avatar
    40 posts
    Member since:
    Jul 2012

    Posted 19 Sep 2012 Link to this post

    Thanks a lot for all your help, it works splendidly. Are you a freelancer? In case we need more help in the future perhaps we could contact you. Please drop me an e-mail if you're interested: robin.havre (a) gmail.com.

    PS: header('Access-Control-Allow-Origin: *'); works now.
  8. Ali
    Ali avatar
    16 posts
    Member since:
    Aug 2012

    Posted 23 Sep 2012 Link to this post

    You are welcome Robin. I sent you an email.
Back to Top