need assistance with an application I am developing

[webguync]

Hello,

 

I am developing a web application where there will be an html table with text being displayed within the table cells. The text is being stored in a MySQL database. The user will be able to select different names from a drop down menu and selects information to be stored into a database. When the user selects a table cell, the cell will be highlighted to indicate the selection, and when they submit the information will be entered into the database.

 

Right now the only thing that I have working is the HTML table displays with the fields that are in a database

 

the list of items I am still trying to figure and need help with are:

 

1) Right now the table cells are coded with a form checkbox, ideally I would like the user to just be able to click on a cell, and have it highlight, instead of a checkbox, is this at all possible?

 

2) Would I need to create a separate database table with the names in the dropdown menu in order to record the results of which cells were selected?

 

3) The first cell for each row should be static, and doesn't need to be in the database. Right now the way I have it coded, the cell with text 'Open Purposefully' repeats as the title of each row. This is what I want to name the first cell in the first row, but the remaining rows will have different cell titles. What is the best way to do this..with an array?

 

4) Currently 5 cells are being displayed in each row, and actually what I need is 5 cells in the first row, 4 in the 2nd, 3rd, 4th and 5th rows and 3 in the 6th row. Can this be handled via PHP? Again the data foe these cells are being stored in a MySQL DB.

 

here is the code I have so far. The javascript isn't highlighting as it should.

 

<?php
/*--------- DATABASE CONNECTION INFO---------*/
//set up table and database names
$db_name ="MyDB";
$table_name ="grid";

//connect to server and select database
$connection = @mysql_connect( "localhost" , "UserName" , "PassWord" )
or die(mysql_error());
$db = @mysql_select_db($db_name, $connection) or die (mysql_error() );

//Build and issue query
$sql="SELECT * from $table_name";
$result = @mysql_query($sql,$connection)or die(mysql_error());

$fields_per_row = 5;
echo '<form action="" method="post">
<table id="employees">
<tr>
<td>
<form action="">
<select name="employees">
<option value="employee1">Employee1</option>
<option value="employee2">Employee2</option>
<option value="employee3">Employee3</option>
<option value="employee4">Employee4</option>
</select>
</form>
</td>
</tr>
<table id="matrix"><tr><th colspan="6">Title Goes Here</th></tr><tr>';
//for ($i = 1; $i <= $fields; $i++) {
for($i = 0;$row = mysql_fetch_assoc($result);$i++){
  if (!($i % $fields_per_row)) {
    echo '</tr><tr><td id="title">OPEN PURPOSEFULLY</td>';
  }
  echo '<td><input type="checkbox" name="grid[]" value="'.$row['Id'].'" class="inactive" onclick="changeState(this);">'.$row['Text'].'</td>';
}
echo '</tr></table><div align="right"><input type="image" src="Submit.png" value="submit" /></div></form>';
?>

 

[JavaScript]

// changeState

 

function changeState(fieldObj) {

 

  if (fieldObj.className=='active') {

    newClass = 'inactive';

  } else {

    newClass = 'active';

  }

 

  fieldObj.className = newClass;

  return;

}

 

I have different background colors set up in my CSS for the 'active' and 'inactive' classes, but this isn't currently working. I know this isn't a JavaScript forum, but if there is anything obvious I am leaving out, please let me know.

 

Also, If I need to clarify any of the PHP solutions I am seeking, I would be happy to do so.

 

thanks in advance for any assistance.

 

[/javascript]

 

 

[Buddski]

The Javascript script will only change the Class Name of the input inside the td. Not the TD itself if thats what you are wanting..

 

to change the TD className you need to move the onclick event to either the TD or TR which contains the checkbox

[webguync]

number 3 from my list above, I was able to resolve with just creating two HTML tables inside a big table, so that can get crossed off.

 

I was able to get the hi-lighting to work so thank-you there.

 

what I still need is to be able to select an employee from a list and click on the different boxes, and hit submit and have this information be entered into a MySQL database table.

 

any guidance would be appreciated.

 

here is my updated code:

 

<?php
/*--------- DATABASE CONNECTION INFO---------*/
//set up table and database names
$db_name ="NN";
$grid_name ="grid";
$employee_table="employees";
//connect to server and select database
$connection = @mysql_connect( "localhost" , "UserName" , "Password" )
or die(mysql_error());
$db = @mysql_select_db($db_name, $connection) or die (mysql_error() );

//gather data from employee list
$sql = "SELECT ID,Employee_Name FROM $employee_table ORDER BY ID ASC";
$result = mysql_query($sql) or die(mysql_error());

//begin building HTML table

echo '<table id="main"><tr><td>';

echo '<table><tr><td><select>';
while(list($id,$name) = mysql_fetch_row($result)){
    echo '<option value="'.$id.'" />'.$name.'</option>'."\n";
}
echo '</select></td></tr></table>';



//Build and issue query
$sql="SELECT * from $grid_name";
$result = @mysql_query($sql,$connection)or die(mysql_error());

$fields_per_row = 5;
echo '<form action="" method="post">
<table id="matrix"><tr><th colspan="6">Title Goes Here</th></tr><tr>
<td>
<table>
<tr>
<td id="title">OPEN PURPOSEFULLY</td>
</tr>
<tr>
<td id="title">UNCOVER NEEDS</td>
</tr>
<tr>
<td id="title">PROVIDE SOLUTIONS AND DELIVER CORE MESSAGES</td>
</tr>
<tr>
<td id="title">RESOLVE OBJECTIONS</td>
</tr>
<tr>
<td id="title">GAINING COMMITMENT</td>
</tr>
<tr>
<td id="title">TRANSITIONING</td>
</tr>
</table>
</td>
<td>
<table>
';
//for ($i = 1; $i <= $fields; $i++) {
for($i = 0;$row = mysql_fetch_assoc($result);$i++){
  if (!($i % $fields_per_row)) {
    echo '</tr><tr>';
  }
  echo '<td class="inactive" onclick="changeState(this)"><input type="checkbox" name="grid[]" value="'.$row['Id'].'" ;">'.$row['Text'].'</td>';
}
echo '</tr></table><div align="right"><input type="image" src="Submit.png" value="submit" /></div></form></table></td></table>';
//end of HTML table
echo '</td></tr></table>';
?>