Trying to get data from json through javascript and display on jquery mobile page

Question

I want get the data coming in JSON through a php url using JAVASCRIPT and displaying that data in JQuery mobile "li" tag(it'll be a complete category list) but using the code given below isn't displaying anthing. I'll be very thankful, I am stuck in this thing from last 8 hours.

<script>
                  var session_id = localStorage.getItem('session_id');
                  var user_id = localStorage.getItem('user_id');  
            $(document).ready(function() {
             //$('#output').html('somestuff');

                $('#loginForm').submit(function() {
                    //$('#output').html('Connecting....');
                    var postTo = 'http://localhost/categories.php';
                    //alert(postTo);
                    $.post(postTo,{userid: $('[name=user_id]').val() ,   sessionid:  $('[name=session_id]').val()} , 
                        function(data) {

                            if(data.status == 'true') {

                                $("#userdata tbody").html("");
                                $.getJSON(postTo,function(data){
                                $.each(data.members, function(i,user){
                                var tblRow =
                                "<li data-theme="e">"
                                 +"<a data-transition="flow" href="">"+user.category+"</a>"
                                  +"</li>";
                                $(tblRow).appendTo("#userdata tbody");
                                });
                                });


                            } else {

                                window.open("./MyApp.html","_self");
                            }

                        },'json');

                    return false;
                });
            });
            </script>

put a debugger after function(data) { and check what it returns in data as well as check your console if der is anything wrong — Curiousdev
– Curiousdev, Commented Apr 24, 2017 at 11:47
Can I see your complete code ? (e.g html and categories.php) — Ahmed Ginani
– Ahmed Ginani, Commented Apr 24, 2017 at 11:56

Ad5001 · Accepted Answer · 2017-04-24 11:47:58Z

0

You have a syntax error at +"<a data-transition="flow" href="">"+. "flow" is outside quotes (so it's counted as a var, but you didn't used "+") so you should only put single quotes before and after "flow". Same goes for the href.

answered Apr 24, 2017 at 11:47

Ad5001

7535 silver badges19 bronze badges

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

Comments

Community · Accepted Answer · 2017-05-23 12:25:54Z

0

this $(tblRow).appendTo("#userdata tbody"); should be

something like

$("#userdata tbody").appendTo(tblRow);

Read more here about appending content to element

and

 var tblRow ="<li data-theme="e">"  
                             +"<a data-transition="flow" href="">"+user.category+"</a>"
                             +"</li>";

change it into

 var tblRow ='<li data-theme="e">' 
                             +'<a data-transition="flow" href="">'+user.category+'</a>'
                             +'</li>';

Check your console what it says to precise on your errors and where exactly it fails.

Refer this question for writing html with jQuery

edited May 23, 2017 at 12:25

CommunityBot

11 silver badge

answered Apr 24, 2017 at 11:47

Nagaraju

1,8852 gold badges28 silver badges49 bronze badges

1 Comment

Nagaraju Over a year ago

Check your console for errors and tell us exactly where it fails?

Collectives™ on Stack Overflow

Trying to get data from json through javascript and display on jquery mobile page

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related