All geek questions in one place

Creating a table with mysql, php and ajax (with jquery)

For my new project, I want this modern approach not to require a page reload for each database request. :) I want the script to query the database and create a table with the information about the request.

I tried different scripts that I found on the Internet. The one below was closest to my needs.

index.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'> <head> <title>Display Page</title> <meta http-equiv='Content-Type' content='text/html; charset=utf-8' /> <script language='JavaScript' type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'></script> </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>

getdata.php

 <?php include('conn.inc.php'); //Query of facebook database $facebook = mysql_query('SELECT * FROM users') 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 { $output_string = ''; $output_string .= '<table border="1">'; while($row = mysql_fetch_assoc($facebook)) { $output_string .= '<tr>'; foreach($row as $value) { $output_string .= '<td>{$value}</td>'; } $output_string .= '</tr>'; } $output_string .= '</table>'; } mysql_close(); // This echo for jquery echo json_encode($output_string); ?>

But I get a table with a relationship {$ value} inside the table. I tried only $ value but got a bunch of zeros.

I tried a simple script

 $query = "SELECT users_name, users_password FROM users WHERE users_name = 'name'"; $result = mysql_query($query) or die(mysql_error()); $row = mysql_fetch_array($result); echo $row['users_name'];

And then I get som results, but with this script I need to refresh the page with every search. To be clear, I want to be able to create a table with information from the mysql database and display it on the screen with a page reload.

Any ideas?

+4
source share
3 answers

You just need to use $ value instead of {$ value}. You do not need another foreach loop inside the while loop.

 $output_string = ''; $output_string .= '<table border="1">'; while($row = mysql_fetch_assoc($facebook)) { $output_string .= '<tr>'; $output_string .= '<td>'.$row['Your table column name here'].'</td>'; $output_string .= '</tr>'; } $output_string .= '</table>';
+2
source

Instead

 $output_string .= '<td>{$value}</td>';

to try

 $output_string .= "<td>{$value}</td>";

i.e. replace single quotes with double quotes.

See the document here that says:

When a string is indicated in double quotes ... variables are parsed in it.

and

variables ... will not expand when they appear in single quoted strings.

0
source

You can invert the logic and do it on the client side using a library that does this automatically, for example http://phery-php-ajax.net Instead of creating a table on the server side, send it as JSON to the browser, what happens faster and create a table:

 Phery::instance()->set(array( 'load' => function(){ /* rest of mysql code */ $rows = array(); while($row = mysql_fetch_assoc($facebook)) { $rows[] = $row; } return PheryResponse::factory()->json($rows); })->process();

then on the client side inside $(function(){});

 $(function(){ var $result_table = $('#result_table'); $result_table.phery('make', 'load'); $result_table.bind('phery:json', function(e, data){ var $this = $(this); for (var i = 0; i < data.length; i++) { $this.append($('<tr/>', { 'html': '<td>' + data[i].row_name + '</td>' })); } }); $result_table.phery('remote'); });
0
source

Source: https://habr.com/ru/post/1444741/

More articles:


All Articles