Display JSON Data from database using php using jquery ajax

Display JSON Data from database using php using jquery ajax

Welcome on Pakainfo.com – Examples ,The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to Display JSON Data from database using php using jquery ajax

In this post we will show you Best way to implement how to retrieve data from database in php using jquery ajax, hear for How to Display JSON Data with jQuery and Ajax with Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

JSON stands for for (Java Script Object Notation) is a simple lightweight parametrs data passing format and some human readable very easy contains java structures.
In this post I will be learn to explain Creating simple JSON file as well as PHP source and Display some JSON data using call back of jquery and Ajax.
Using JSON you can interchange all the data between the client side browsers and the server Like as a PHP.

Also Read :  Difference Between CSV and XLS file Formats

index.html

<website_list>
 
<post_name>live24u | web - devlopig - Programming Blog</post_name>
<web-url>http://www.Pakainfo.com</web-url>
 
<post_name>jQuery and Ajax Demos</post_name>
<web-url>Display-JSON-Data-with-jQuery-and-Ajax</web-url>
 
</website_list>

JSON Structure

{"website_list": 
[
{ 
"post_name":"live24u | Programming Blog", 
"web-url":"http://www.Pakainfo.com" 
}, 
{ 
"post_name":"live24u - jQuery and Ajax Demos", 
"web-url":"Display-JSON-Data-with-jQuery-and-Ajax"
}, 
]
}

Javascript Code

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(function() 
{
	$(document).ready(function()
	{
		$.getJSON("data.js",function(data)
		{
			$.each(data.website_list, function(i,data)
			{
				var div_data =
				"<div ><a href='"+data.web-url+"'>"+data.post_name+"</a></div>";
				$(div_data).appendTo("#appendData");
		});
	}
);
return false;
});
});
</script>

Load Click using jquery

$(".data-load").click(function()
{
----//your some code
----//your some code
return false;
});
 
<div>
<input type="button" value=" Load " class="data-load" />
</div>

Creating JSON file with PHP : Database Table live_post

CREATE TABLE live_post
{
id INT PRIMARY KEY AUTO_INCREMENT,
post_name VARCHAR(200),
web-url VARCHAR(200)
}

live_json.php – Contains simple PHP code.

<?php
include('config.php');
$my_sql=mysql_query("select * from live_post limit 20");
echo '{"website_list": [';
while($data_row=mysql_fetch_array($my_sql))
{
$post_name=$data_row['post_name'];
$web-url=$data_row['web-url'];
echo '
{
"post_name":"'.$post_name.'",
"web-url":"'.$web-url.'"
},'; 
}
echo ']}';
?>

Loading PHP file

If we want to data-load PHP file replace some javascript code jquery $.getJSON(“data.js”,function(data)to

Also Read :  Facebook Graph API Search Multiple Parameters Queries

$.getJSON("live_json.php",function(data)

Example

I hope you have Got Display JSON Data in HTML Table using jQuery and AJAX And how it works.I would Like to have FeadBack From My Blog(Pakainfo.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(Pakainfo.com) Are Most Always Welcome.

Leave a Reply

Your email address will not be published. Required fields are marked *