javinladish Posted October 24, 2011 Share Posted October 24, 2011 Hello, What I am looking to do is have a series of buttons laid out and when the user 'onClick', a table from my MySQL database will load into a scrollable textbox within the same webpage. I figure I need to go about this using AJAX, which unfortunately I have basically no experience in. For example purposes here is what I have going: This php code basically just displays the table we want to tie the button click to. <?php include("connect.php"); //Query of facebook database $facebook = mysql_query("SELECT * FROM facebook") or die(mysql_error()); //Output results if(!$facebook) { echo "There was an error running the query: " . mysql_error(); } elseif(!mysql_num_rows($facebook)) { echo "No results returned"; } else { $header = false; echo "<table border='1'>\n"; while($row = mysql_fetch_assoc($facebook)) { if(!$header) { echo "<tr>\n"; foreach($row as $header => $value) { echo "<th>{$header}</th>\n"; } echo "</tr>\n"; } echo "<tr>\n"; foreach($row as $value) { echo "<th>{$value}</th>\n"; } echo "</tr>\n"; } echo "</table>\n"; } mysql_close(); ?> I'd really like to make this as easy as possible. After doing research, I figured that just Javascript would not be enough because it is client-side. It would be great if someone could point me in the right direction. Thanks in advance to anyone who replies. Link to comment Share on other sites More sharing options...
jotorres1 Posted October 24, 2011 Share Posted October 24, 2011 I can probably give you basic help on this. Edit: had to modify your first 2 echo's for json_encode, sorry. I have modified your file just a bit to be able to handle json output. <?php // This file I have named it getdata.php // And you will see why include("connect.php"); //Query of facebook database $facebook = mysql_query("SELECT * FROM facebook") or die(mysql_error()); //Output results if(!$facebook) { mysql_close(); echo json_encode("There was an error running the query: " . mysql_error()); } elseif(!mysql_num_rows($facebook)) { mysql_close(); echo json_encode("No results returned"); } else { $header = false; $output_string = ""; $output_string .= "<table border='1'>\n"; while($row = mysql_fetch_assoc($facebook)) { if(!$header) { $output_string .= "<tr>\n"; foreach($row as $header => $value) { $output_string .= "<th>{$header}</th>\n"; } $output_string .= "</tr>\n"; } $output_string .= "<tr>\n"; foreach($row as $value) { $output_string .= "<th>{$value}</th>\n"; } $output_string .= "</tr>\n"; } $output_string .= "</table>\n"; } mysql_close(); // This echo for jquery echo json_encode($output_string); ?> The html file, (php for me) I have named it display.php <!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"> <script language="JavaScript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Display Page</title> </head> <body> <button type="button" name="getdata" id="getdata">Get Data.</button> <div id="result_table"> </div> <script type="text/javascript" language="javascript"> $('#getdata').click(function(){ $.ajax({ url: "getdata.php", type:'POST', dataType: 'json', success: function(output_string){ $("#result_table").append(output_string); } // End of success function of ajax form }); // End of ajax call }); </script> </body> </html> Since I have no idea what your page looks like, I just made a simple button, that when clicked, it will look inside the DB, grab data, and return it, placing it inside the div. Now I have not tested this, but this is how it should be looking like. If you get any errors let me know, I will help out. Link to comment Share on other sites More sharing options...
javinladish Posted October 25, 2011 Author Share Posted October 25, 2011 Hey! This actually works perfectly. Thanks so much. Is there a way to limit it to only able to print once? Right now, as you keep clicking the button, it continues to print the table over and over. Link to comment Share on other sites More sharing options...
jotorres1 Posted October 25, 2011 Share Posted October 25, 2011 Yes. Try change this line: $("#result_table").append(output_string); to this: $("#result_table").html(output_string); The html will rewrite what you have thus making it appear only once. Link to comment Share on other sites More sharing options...
javinladish Posted October 25, 2011 Author Share Posted October 25, 2011 That works perfect. Thanks. MISSION COMPLETE! Link to comment Share on other sites More sharing options...
jotorres1 Posted October 25, 2011 Share Posted October 25, 2011 Glad it worked for ya! Link to comment Share on other sites More sharing options...
AnishThapaliya Posted June 7, 2022 Share Posted June 7, 2022 hey guys stuck on a similar problem I tried to run this code that you have up there and i'm using xampp but it's not working for me and i don't even see the error msg Link to comment Share on other sites More sharing options...
Barand Posted June 7, 2022 Share Posted June 7, 2022 Don't resurrect 10 year old posts. Create your own topic and state your problem with code you've tried (use <> button) The code in this topic uses mysql_ functions which no longer exist in PHP. (Use mysqli or PDO functions) Turn your error reporting and display option ON. Link to comment Share on other sites More sharing options...
Recommended Posts