-1

I am using monaca IDE + phonegap to build a phone app.

I have created a restful server - http://engridmedia.com/next/api/channel/user/id/1

And i am trying to consume the json rest service with this jquery script in my js file. 

$(document).ready(function() {
$.ajax({
    url: "http://engridmedia.com/next/api/channel/user/id/1"
}).then(function(data) {
   $('.ch-name').append(data.ch_name);
   $('.ch_logo').append(data.ch_logo);
});

});

and calling it it in the body like this

    <div>
<p class="ch_logo"> </p>
<p class="ch_name"> </p>
</div>

should this not be working? I have included the jquery.min.js file and the ajax file to the page . but it just wont show a thing.

Andi Pavllo
  • 2,506
  • 4
  • 18
  • 30
Richard Otabil
  • 37
  • 8
  • Did you check the console for any error message? Try log the data in the promisse function. (console.log(data) in .then.) – Juan Marcos Armella Jun 30 '15 at 14:58
  • Please am new to jquery. I only know a bit about javascript , so its quit impossible for me to write the right syntax to log the data input . I can do that in javascript though . Anyway , my unedited code has no errors when i checked . the only thing , like you suggested , is to check the data if its streaming in . thank you – Richard Otabil Jun 30 '15 at 16:15
  • Maybe you are having cross domain conflicts? I tried to run the code and received: XMLHttpRequest cannot load http://engridmedia.com/next/api/channel/user/id/1?_=1435681247893. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://stackoverflow.com' is therefore not allowed access. Read this http://docs.phonegap.com/en/1.9.0/guide_whitelist_index.md.html – Juan Marcos Armella Jun 30 '15 at 16:22
  • I can run the url on my pc without any problem. i visit the site directly . Anyway , i changed the javascript code a bit ... it said success. but nothing shows in my app . ` $(document).ready(function() { $.ajax({ cache: false, url: "http://engridmedia.com/next/api/channel/user/id/1", data: "[]", type: 'GET', crossDomain: true, dataType: 'json', success: function() { alert("Success"); }, error: function() { alert('Failed!'); }, }).then(function(data) { $('.ch-name').append(data.ch_name); $('.ch-logo').append(data.ch_logo); }); }); ` – Richard Otabil Jun 30 '15 at 16:42
  • I also just checked what you just sent . i added the domain origin . but still!!!! by default it was even granting access to all domains. – Richard Otabil Jun 30 '15 at 16:52
  • i just logged the data and i got [object object],[object object],[object object],[object object],[object object] – Richard Otabil Jun 30 '15 at 17:15
  • You are receiving an array, give me a second and i post a answer for you. – Juan Marcos Armella Jun 30 '15 at 17:34

1 Answers1

1

Try this:

$(document).ready(function() {
  $.ajax({
    cache: false,
      url: "http://engridmedia.com/next/api/channel/user/id/1",
    type: 'GET',
    crossDomain: true,
    dataType: 'json',
    success: function() {
        alert("Success");
    },
    error: function() {
        alert('Failed!');
    },
}).then(function(data) {
    var result = data [0];
    console.log(result)
    $('.ch-name').append(result.ch_name);
    $('.ch-logo').append(result.ch_logo);
});
});

You are returning a object in a array. You need to get the first object in that array.

Juan Marcos Armella
  • 737
  • 6
  • 13