Member Avatar for k2k

i wanna try to use ajax to async something from the mysql database.. i have read many tutorial/book/article recently and there are many things that I don't clearly understand.

it looks like json is a good pick to do stuffs like loading things from a database. however, the examples i read didn't mention anything about database. And i don't really get what callWebService() and callBack() do.

any hint or good tutorial I can read to teach myself?

thanks

  • 2 Contributors
  • 2 Replies
  • 301 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by scrappedcola
Member Avatar for k2k

this is what i have so far (not working).. please lead me to the right direction.

// php file named "getOrder.php"
<?php
include('config.php');
$sql=mysql_query("select * from orders");

echo ' {"Order": [   ';

while($row=mysql_fetch_array($sql))
{
	$date = $row['order_date'];
	$time = $row['order_time'];
	
	echo '
	{
		"Order Date":"'.$date.'",
		"Order Time":"'.$time.'"
	},';
}
echo ']}';
	
?>
//html file

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="Content-Language" content="en-us" />
    <title>The Wall - Staff View</title>
    <link href="templatemo_style.css" rel="stylesheet" type="text/css" />
    <script src="js/json2.js" type="text/javascript"></script>
</head>

<body>
<script type="text/javascript">
$(function()        {									             $(document).ready(function()
{
$.getJSON("./php_lib/getOrder.php",function(data)
{
$.each(data.posts,function(i,data)							{
	var div_data ="<div ><a href='"+data.date+"'>"
        +data.time</a
        </div>";								     $(div_data).appendTo("#table1");							});	   
});										
return false;
											});
});
</script>

<div id="table1"></div>

</body>
</html>

please let me know if anything major is missing.. i am trying to understand the big picture of the whole thing.

Member Avatar for scrappedcola

I haven't worked with callWebService() but your callback function is the piece that handles the data that you get back from your server side code (the php in your case). You don't have to do anything special with your "ajax" call to interact with the database your server side code will do that. What happens is you make the XMLHttpRequest that sends data back to the server in either a post or get. Your server side code looks for those params if you need them. You perform whatever actions you want in your server side code and pass back your data using print statements. You really should do the ajax calls first by hand to see exactly what is going on and then learn to use a framework api such as jquery. I think you will get less confused by terminology that way. Using Firefox with firebug turned on (or conversely IE with fiddler) can help you see what the call does and the data that is being send in the request and response. From your code I don't think you are going to get the answers that you expect since you are looking for

data.date data.time

when in your object you are calling it "Order Date" and "Order Time". I don't think you can use a space in the naming of an object name value pair. Also it looks like you have a typo here:

+data.time</a
        </div>";

Looks like just a missing +">
This tutorial goes through a basic ajax call and steps though the basic concepts that you will run into with ajax: http://www.developertutorials.com/learn-ajax/understanding-ajax-2639.php

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.