Forums

  • TWG
    # February 19, 2013 at 11:40 am

    I have a internal JSON list that I need to parse into a table on a page. The data is in no order but I would like it alphabatized based on the “Name” attribute. I have the connection to the data working and can see the response in Firebug, but I’m completely lost on how t o sort it and put it in a table. Can anyone help me.

    <html>
    <head>
    <title>DB API Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    $.ajax({
    type: "POST"
    ,url: "https://test.my.site.com/api/api/db/"
    ,contentType: "application/json; charset=utf-8"
    ,dataType: "jsonp"
    ,data: "{}"
    ,success: function(res) {
    $.each(res, function() {

    });
    }
    });
    });
    </script>
    </head>
    <body>
    <p>This is a test</p>
    <table id="Results"></table>
    Check out this Pen!

    This is the structure of my JSON data: [{“id”: ###, “Name”:”This is a test”,”Vendor”:null/text,”URL”:”http://www.google.com”,”Coverage”:”Full”,”Avability”:null/text,”Descriptions”:,”Description here.”},{“id”: ###, “Name”:”This is a test”,”Vendor”:null/text,”URL”:”http://www.google.com”,”Coverage”:”Full”,”Avability”:null/text,”Descriptions”:,”Description here.”}]

    # February 19, 2013 at 12:01 pm

    on success, convert json string to javascript object

    use: http://api.jquery.com/jQuery.parseJSON/

    $.ajax({
    type: “POST”
    ,url: “https://test.my.site.com/api/api/db/"
    ,contentType: “application/json; charset=utf-8”
    ,dataType: “jsonp”
    ,data: “{}”
    ,success: function(res) {
    var obj = $.parseJSON(res);
    console.log(obj);
    //continue work here..
    }
    });

    # February 19, 2013 at 3:40 pm

    i have created example codes for this:
    https://dl.dropbox.com/u/12386479/json_example.zip

    hope it helps.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag