Parsing json data in phonegap using jquery

Question

Following is my json data URL http://bluestonesolutions.in/Connect4mJson/GetEmployees.svc/getnotice?InstanceId=604&EnoticeType=Flash%20News&UserID=112730&IsGlobalNotice=0

I want display data in table using jquery Mobile for Phonegap. I can fetch data easily but can display in mobile.

Here is working example. Please guide me how to parse it for phonegap

$(document).ready(function() {
    $.ajax({
        url : 'http://bluestonesolutions.in/Connect4mJson/GetEmployees.svc/getnotice?InstanceId=604&EnoticeType=Flash%20News&UserID=112730&IsGlobalNotice=0',
        type : 'GET',
        dataType : 'JSON',
        crossDomain: true,
        success : function(data) {      
            document.write('<table width="400" height="288" align="center"  style="border:5px solid #10A3D8; ">')
            $.each(data, function() {
                console.log(this.Subject);
                document.write('<tr style="background:#D4D2D2;" >')
                document.write('<td style="color:#041DB3;">'+'Subject:-</td>')
                document.write('<td style="color:#041DB3;">'+this.Subject+'</td>')
                document.write('</tr>')
                document.write('<tr style="background:#04A273;">')
                document.write('<td>'+'Description:-</td>')
                document.write('<td>'+this.ENoticeDescription+'</td>')
                document.write('</tr>')
            });
            document.write('<table>');          
            // open console debugging tools on google and see the parse value
        },
        error : function() {}
    });
});

I can make out document.write('') document.write('') document.write, what on Earth is that O_o This erases the whole document. — Jeremy Thille
– Jeremy Thille, Commented Apr 2, 2015 at 12:29

user1832200 · Accepted Answer · 2015-04-02 12:25:27Z

2

Try using this to parse JSON

jQuery.parseJSON()

answered Apr 2, 2015 at 12:25

user1832200

Sign up to request clarification or add additional context in comments.

1 Comment

Jeremy Thille Over a year ago

Nope. No need, OP is using dataType : 'JSON' (hard to read, I know). Besides, jQuery.parseJSON() doesn't do anything on its own. This is not a proper answer.

Dhivya · Accepted Answer · 2015-04-02 12:32:27Z

0

You can parse JSON like var JsonStringify_ExecResData = JSON.stringify(data); var obj = jQuery.parseJSON(JsonStringify_ExecResData);

and like

localStorage.setItem("userEmail", userEmail);

You can set the parameters and get in another page like

localStorage.setItem("userEmail", userEmail);

answered Apr 2, 2015 at 12:32

Dhivya

1521 gold badge2 silver badges13 bronze badges

Comments

lshettyl · Accepted Answer · 2015-04-02 13:04:18Z

I am no expert in Phonegap, but this is how you'd create/populate a table in jQuery for your specific scenario. You may then append the table to an exising element on the page or like I did, to the body (as it's a demo). Adapt this code to suit your needs, such as replace everything between success : function(data) { and }) with my code except the var dat = [....];

var data = [{"CategoryName":"Flash News","DisplayOrder":"0","ENoticeDescription":"","ENoticeId":19619,"NoticeDocument":"","Subject":"Singing competitions will be conducted this Month, interested candidates can come to office room and enroll.","createddate":"12 Jun 2014","noticedate":"6\/12\/2014 12:00:00 AM"},{"CategoryName":"Flash News","DisplayOrder":"0","ENoticeDescription":"","ENoticeId":19623,"NoticeDocument":"","Subject":"Flowers day celebrations will be conducted on 1st Saturday of next Month, Students are instructed to bring 5 different Flowers.","createddate":"12 Jun 2014","noticedate":"6\/12\/2014 12:00:00 AM"},{"CategoryName":"Flash News","DisplayOrder":"0","ENoticeDescription":"","ENoticeId":19624,"NoticeDocument":"","Subject":"Painting competitions for Senior Program will be conducted on 30th of this month.","createddate":"12 Jun 2014","noticedate":"6\/12\/2014 12:00:00 AM"},{"CategoryName":"Flash News","DisplayOrder":"0","ENoticeDescription":"Debate competition for Senior class students will be conducted on 2nd of April month, interested students contact Head of Senior Program Staff.","ENoticeId":19660,"NoticeDocument":"","Subject":"Senior Program - Debate Competition","createddate":"12 Jun 2014","noticedate":"6\/12\/2014 12:00:00 AM"}];

var $table = $('<table width="400" height="288" align="center"  style="border:5px solid #10A3D8;">');
var $trs = $();
$.each(data, function() {
    var $tr = $("<tr/>").css("background", "#D4D2D2");
    var $td = $("<td/>").css("color", "#041DB3").text("Subject:");
    $tr.append($td);
    $td = $("<td/>").css("color", "#041DB3").text(this.Subject);
    $tr.append($td);
    $trs = $trs.add($tr);
    
    $tr = $("<tr/>").css("background", "#04A273");
    $td = $("<td/>").css("color", "#041DB3").text("Description:");
    $tr.append($td);
    $td = $("<td/>").css("color", "#041DB3").text(this.ENoticeDescription);
    $tr.append($td);
    $trs = $trs.add($tr);
});
$table.empty().append($trs);
$("body").empty().append($table);

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

Use CSS classes instead of .css("prop", "value") as it's against performance when you have 100s of elements. It's okay for this specific case as the data is not that huge. But, I'd still suggest that you use classes.

Collectives™ on Stack Overflow

Parsing json data in phonegap using jquery

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related