CODEWITHSUNDEEP
javascriptphphtmljsoncordova
Andre
Andre

Reputation: 145

JSON data to HTML

I am learning phonegap application, but I have some problem on the process. I have data on MySQL that showed at PHP page like this:

1 User80 112

2 User23 22

3 User11 1

4 User7 1

5 User8 1

6 User4 1

7 User9 1

8 User5 1

9 User10 1

10 User6 1

........

17 UserLogin 0

18 User22 0

How to convert it into JSON and how to save it into localStorage and show it into HTML?

Can someone help me?

Upvotes: 0

Views: 210

Answers (3)

Felix
Felix

Reputation: 2691

Based on your description I think your database table structure is as follow:

ID | Username | IsLoggedIn (112, 22, are little bit confusing??)

iterate over your table and put all into one php array (maybe with class objects; so you have better json structure):

//helper class
class dataset
{
    public $id;
    public $username;
    public $IsLoggedIn; // or something else
}

// .... iterating over table 
//export to json:
$output = json_encode($yourDatasetArray);


// a few other operations
//...
// output your json-string:
echo $output;

The last example code can also be used as backend for an ajax request (maybe better method when working with json). Next you implement your client code like @rob explained before.

Documentation about local storage as well as session storage can be found here: MDN Documentation

Upvotes: 0

rob
rob

Reputation: 1286

<body>
<div id="holder">
</div>
<script>
// Instead of writing HTML, write the JSON object to the page in PHP
var json = { users: [ 
    {id:1, name: 'user80'}, 
    {id:2, name: 'user23'}
] };
// Save the users to local storage
window.localStorage.users = JSON.stringify(json);
// Load json data from local storage
var loadedData = JSON.parse(window.localStorage.users);
// Render HTML from json data
var html = "";
for (var user in loadedData.users) {
  html += loadedData.users[user].name + "<br/>";
}
document.getElementById("holder").innerHTML = html;
</script>
</body>

Upvotes: 0

gfauchart
gfauchart

Reputation: 82

first if you are using phonegap you need to make an ajax request in javascript to you php server to fetch your user list, then you can inject to your html

see: http://tournasdimitrios1.wordpress.com/2011/11/04/how-to-generate-json-with-php-from-mysql-and-parse-it-with-jquery/

Upvotes: 1

Related Questions