View Full Version : Organize mysql results in html table with PHP

02-13-2010, 11:12 PM
Hi guys,

I was trying to make the title as explicit as possible. Also I'm posting this in the PHP part of the forum although my question involves html, javascript and mysql.

I have a table (in the database). Depending on what the user wants in my html form, a javascript script will work in conjunction with a small php code to fetch data from that table and display it on the html page without needing a page reload or form submit. The code as it is now works well for small amounts of data, but as soon as there is a lot of data, my html page will become "unreadable".

What I basically want is to dynamically create columns in the html table to organize the result from the php code depending on the amount of data that was fetched from the database.

For example: say the php code with the mysql query finds 10 records for the query, it will display only one column in the html table. But if it finds say, 20 records, it will split them in 2x10 records and display the results as 2 columns in the html table:

10 records: |1x10|
20 records: |1x10|1x10| and not |1x20|
40 records: |1x10| 1x10|1x10|1x10| and not |1x40|
and so on, see?

Until now, it's the php code that creates the html with an echo. I've been trying various ways to get to the solution with for loops in my php code. Maybe the answer is to modify the javascript but I'm a total n00b at JS!

Suggestions and solutions are welcome, here are the bits of code:


<script language="javascrip" src="rates.js"></script>
<table width="100%" cellpadding="0" cellspacing="0" align="center" border="1">
<tr valign="top">
<td width="1024">
<select id="indicatif" onChange="displayId();">
<option value="021-">021-</option>
<option value="022-">022-</option>
<option value="031-">031-</option>
<select id="bloc" onChange="displayBloc();">
<option value="555-" class="021-">555-</option>
<option value="666-" class="021-">666-</option>
<option value="556-" class="022-">556-</option>
<option value="667-" class="022-">667-</option>
<option value="111-" class="031-">111-</option>
<option value="222-" class="031-">222-</option>
<input type="text" id="blabla" onfocus="showNumbers(this.value);"/>
<table id="result" width="100%" cellpadding="0" align="center" border="1">
<tr valign="top">



var xmlhttp;

function showNumbers(str) {
if (xmlhttp==null) {
alert("Browser does not support HTTP Requestion");

var url="getrate.php";

function stateChanged() {
if (xmlhttp.readyState==4) {

function GetXmlHttpObject() {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();

if (window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
return null;

$con = mysql_connect('localhost','root','roottest');
if (!$con) {
die ('Could not connect: ' . mysql_error());


$sql="SELECT Number FROM ebitsNumbers WHERE Number LIKE '$q%' and Available='yes'";
$rows = mysql_num_rows($result);
//echo $rows;

while ($row=mysql_fetch_array($result)) {
echo '<input type="radio" value="\$row[Number]\">','<font color=blue>',$row['Number'],'</font><br/>';

02-13-2010, 11:46 PM

Found the solution myself, for those interested:


while ($row=mysql_fetch_array($result)) {
echo '<tr valign=\"top\"></tr>';
echo '<td width=\"150\"><input type="radio" value="\$row[Number]\">','<font color=blue>',$row['Number'],'</font><br/></td>';