Can't get klout score to show using ajax

Question

I am trying to display a klout score on a web page

this is my code

       <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
  var settings = {

    "url": "http://api.klout.com/v2/user.json/********/score?key=7fn6tcf3zvptq9sw47aknmjr&callback=?",
    "method": "GET",
    "dataType": "json",
    "headers": {}
  }

  $.ajax(settings).done(function (data) {
    console.log(data);
    $(data, function( inf ) {
       $("#score").append('<li>' + inf.score + '</li>');
     });

  });
</script>

<h2>Klout Score</h2>
<ul id="score"></ul>

the json data that im calling is as follows

{"score":10.0,"scoreDelta":{"dayChange":0.0,"weekChange":0.0,"monthChange":0.0},"bucket":"10-19","unscored":true}

i cant get the klout score to show What am i doing wrong ??

Any help would be great

score 0 · Answer 1 · answered Apr 18 '17 at 12:20

Don’t know why you don’t just use the data that you get back. Try this instead.

var settings = {

    "url": "http://api.klout.com/v2/user.json/233905743529873888/score?key=7fn6tcf3zvptq9sw47aknmjr&callback=?",
    "method": "GET",
    "dataType": "json",
    "headers": {}
  }

  $.ajax(settings).done(function (data) {
    console.log(data);
    $("#score").append(
      $('<li/>').text(parseInt(data.score, 10))
    );

  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id="score"></ul>

thank you for the response i upvoted , the code worked , but i used the one above as im new to ajax and json and undderstand that response better as iits closer to the code in my question. Thankyou for your help i will study your answer and learn from it — Machine Lad, Apr 18 '17 at 12:42

score 0 · Accepted Answer · answered Apr 18 '17 at 12:24

0

You have to remove that line of code after console.log, as it is not executed and the append do not work.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
  var settings = {

    "url": "http://api.klout.com/v2/user.json/233905743529873888/score?key=7fn6tcf3zvptq9sw47aknmjr&callback=?",
    "method": "GET",
    "dataType": "json",
    "headers": {}
  }

  $.ajax(settings).done(function (data) {
    console.log(data);
    if(data){  //response is not null or undefined
        $("#score").append('<li>' + data.score + '</li>');
    }else{
       alert('Empty response');
     }


  });
</script>

<h2>Klout Score</h2>
<ul id="score"></ul>

It is safe approach to wrap your append into if-else block as it will be easy and relevant in determining response type (is null or not)

answered Apr 18 '17 at 12:24

Ankit Agarwal

30,378
5
37
62

Thankyou this worked for me and i understand where you got it from thanks so much for your help – Machine Lad Apr 18 '17 at 12:43
Could you please add a upvote and mark is as accepted so that others can know it is really working. – Ankit Agarwal Apr 18 '17 at 12:46
i upvoted both of the answers and chose the one that worked best for me , iv only just joined stackoverflow so it didnt register the vote publically sorry – Machine Lad Apr 18 '17 at 19:02
No problem thanks. If you have any issues related to jquery, javascript or AngularJS you can mail me at ank9803@gmail.com – Ankit Agarwal Apr 19 '17 at 05:48

Can't get klout score to show using ajax

2 Answers2