How do I get a list of users from the Json API?

Question

I want to download the AJAX user list available at http://zadanie.ee/users.json, And I would like to display

1.The number of all users, 2.The Number of active users, 3.The Number of active women, 4.The Number of active men,

from JSON API, using jquery/javascript etc,

How can I achieve this? or can some one provide me a simple tutorial to start with?

Here is what I have done so far :

CODE:

<script>

function ViewData()
{

  $.getJSON("http://zadanie.ee/users.json",
   function(data)
   {
     var items = [];

     $.each(data.Users,
      function(key, value)
      {
        items.push("<li>" +
         value.username + "<br />" +
         value.active + "<br />" +

         + "</li>");
      });
     $('<ul/>', {html: items.join(")}).
      appendTo('body');
   });
}
</script>

Any help or any idea will be appreciated, Thanks.

How come the gender is a list? There are some people that have male and female as gender. So are they considered as men, female or both? — Samuel Toh, Jul 25 '17 at 04:28
@SamuelToh I guess it could be both to recognize a transgender — Danyal Imran, Jul 25 '17 at 04:30
Possible duplicate of [Ajax tutorial for post and get](https://stackoverflow.com/questions/9436534/ajax-tutorial-for-post-and-get) — Wasif Khan, Jul 25 '17 at 04:35

score 2 · Accepted Answer · answered Jul 25 '17 at 04:42

2

Please try this code.

$(document).ready(function (){
         $.getJSON("http://zadanie.laboratorium.ee/users.json",function(data)
        {
             var items = [];
             var number_of_user = 0;
             var number_of_active_user = 0;
             var number_of_active_men = 0;
             var number_of_active_women = 0;
                 $.each(data,
                  function(key, value)
                  {
                    number_of_user += 1;
                    if(value['active'] == true){
                        if(value['gender'][0] == 'Female' || value['gender'][0] == 'female'){
                            number_of_active_women +=1;
                        }
                        else if(value['gender'][0] == 'Male' || value['gender'][0] == 'male'){
                            number_of_active_men +=1;
                        }
                    }

                  });
                console.log("number_of_user ==> "+number_of_user +" number_of_active_user ==> "+ number_of_active_user +" number_of_active_men ==> "+ number_of_active_men +" number_of_active_women ==> "+ number_of_active_women);
       });
     });

Hope this helps.

answered Jul 25 '17 at 04:42

Emipro Technologies Pvt. Ltd.

14,598
5
45
75

hii bro can you put it in jsfiddle? – Jefferson X Masonic Jul 25 '17 at 05:03
This link is not working well in jsfiddle because in fiddle we need to use https instead of the http.And i did only jQuery/javascript code nothing else. – Emipro Technologies Pvt. Ltd. Jul 25 '17 at 05:14
I had some problems on my computer now it works, how to put those output in HTML (the best way)? – Jefferson X Masonic Jul 25 '17 at 05:35
You just need to this thing in part
and in jQuery you just need to use (".div-output").html("number_of_user ==> "+number_of_user +" number_of_active_user ==> "+ number_of_active_user +" number_of_active_men ==> "+ number_of_active_men +" number_of_active_women ==> "+ number_of_active_women). So it will set all the console.log data in div and one more thing is html() will clear your previous result. So instead of the html() you also used append() both will work. Append add data without clearing old one. – Emipro Technologies Pvt. Ltd. Jul 25 '17 at 05:39
hii, I tried your method I get error "div.output".html is not a function, – Jefferson X Masonic Jul 26 '17 at 03:02
solved the issue thank you for your support though I was missing $ :( – Jefferson X Masonic Jul 26 '17 at 03:57
if I want to display the number of users who logged in over the last 6 months, what function should I use? – Jefferson X Masonic Jul 26 '17 at 04:25
For that you need to use javascript date object.Here you just need to increment is_active_user if date is <= 6 months. – Emipro Technologies Pvt. Ltd. Jul 26 '17 at 04:36
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/150133/discussion-between-jefferson-x-masonic-and-emipro-technologies-pvt-ltd). – Jefferson X Masonic Jul 26 '17 at 04:37

score 0 · Answer 2 · answered Jul 25 '17 at 04:29

Use AJAX to read data and then parse it accordingly.

$.ajax({ 
    type: 'GET', 
    url: '"http://zadanie.laboratorium.ee/users.json"', 
    dataType: 'json',
    success: function (data) { 
        $.each(data, function(index, element) {
            console.log(element.username);
        });
    }
});

How do I get a list of users from the Json API?

2 Answers2