Today's Posts Follow Us On Twitter! TFL Members on Twitter  
Forum search: Advanced Search  
Navigation
Marketplace
  Members Login:
Lost password?
  Forum Statistics:
Forum Members: 24,256
Total Threads: 81,169
Total Posts: 566,839
There are 33 users currently browsing (tf).
 
  Our Partners:
 
  TalkFreelance     Design and Development     Programming     Other Programming Languages :

jQuery and PHP

Thread title: jQuery and PHP
Closed Thread    
    Thread tools Search this thread Display Modes  
05-19-2008, 03:52 PM
#1
Jmz is offline Jmz
Status: Member
Join date: Jun 2007
Location: Newcastle, UK
Expertise:
Software:
 
Posts: 245
iTrader: 7 / 100%
 

Jmz is on a distinguished road

Send a message via MSN to Jmz

  Old  jQuery and PHP

I'm having a go at making a simple ajax script with PHP and jQuery. Basically it's a list that I want to be able to update without refreshing the page.

So far I can add new items to the list (which is working fine) but I want the query that gets the list to reload when you add a new item and I would also like to be able to delete items without refreshing the page aswell.

Can anybody show me or point me in the direction on how to do this?

So far I have this code:

Code:
<?php
session_start();
$UserName = $_SESSION['UserName'];
include("action/restrict.php");
	//Connect to the database
	include("config/connect.php");
	//Include the functions file
	include("config/functions.php");
	//include settings file
	include("config/settings.php");

		$IDQuery = "select UserID from tbl_users where UserName = '$UserName'";
		$IDResult = mysql_query($IDQuery);
		$IDr = mysql_fetch_array($IDResult);
		$UserID = $IDr['UserID'];
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head>
<title>List</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
	function add(){
		$.ajax({
			type: "POST",
			url: "action/add_item.php",
			data: 	"listtext=" + document.getElementById("listtext").value + 
					"&userid=" + document.getElementById("userid").value,
			success: function(html){
				$("#response").html(html);
			}
		});
		
		}
</script>
</head>

<body>
<div id="wrapper">
<div id="header">
<br/><a href="action/logout.php">Logout</a>
</div>
<div id="content">
<table class="listtable">
<?php
		
		$query = "SELECT * from tbl_list WHERE fld_UserID = '$UserID'";
		$result = mysql_query($query);
		$rownum = "0";
		
		while ($row = mysql_fetch_assoc($result)) {
		$rownum = $rownum+1;
		if ($rownum&1) {
			$rowclass = "row1";
		} else {
			$rowclass = "row2";
		}
		echo "<tr class=\"$rowclass\">";
		echo '<td>';
		echo "$rownum";
		echo '</td>';
		echo '<td>';
		echo '<img src="images/delete.png" class="listimage"/>';
		echo '</td>';
		echo '<td>';
		echo '<img src="images/edit.png" class="listimage"/>';
		echo '</td>';
		echo '<td>';
		echo $row['fld_listtext'];
		echo '</td>';
		echo '</tr>';
}
?>
</table>

<form action="" method="post">
<input type="text" name="listtext" id="listtext"/>
<input type="hidden" name="userid" id="userid"/>
<input type="button" name="submit" id="submit" value="Add" onclick="add()"/>
</form>

<div id="response"><!-- Our message will be echoed out here --></div>
</div>
</div>
</body>
</html>

Closed Thread    


Thread Tools
Display Modes

  Posting Rules  
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump:
 
  Contains New Posts Forum Contains New Posts   Contains No New Posts Forum Contains No New Posts   A Closed Forum Forum is Closed