Dynamic tables without line break

Hi all

Thanks to a previous question I have this script that dynamically displays the contents of my db table and hides the decription until the row cell is clicked.
 
The question is how can I get it to display the values in the divs without spaces between the rows & how could I have the expanding rows to only expand one at a time, for instance if one is opened it will close it before expandng a new one?

<?

/*##########SQL TABLE#################


CREATE TABLE `record` (
  `ID` int(11) NOT NULL auto_increment,
  `Date` date NOT NULL,
  `UpdateName` varchar(255) NOT NULL,
  `Description` text NOT NULL,
  PRIMARY KEY  (`ID`)
);



*/

$db_name = "dbname";

$db = mysql_connect("localhost","user","pw");
mysql_select_db($db_name,$db);

      $get_record = mysql_query("SELECT * FROM record ORDER by Date");

?>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Simple Content system</title>
<script type="text/javascript">
<!--
function show_hide(obj) {
      var el = document.getElementById(obj);
      if ( el.style.display != "none" ) {
            el.style.display = 'none';
      }
      else {
            el.style.display = '';
      }
}
//-->
</script>
<style type="text/css">
.style1 {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-weight: bold;
      font-size: 10px;
      color: #FFFFFF;
}
body {
      background-color: #3a8abb;
}
</style>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<?

      while($row = mysql_fetch_object($get_record)) {
     
            print "<div style='background-image: url(bar.jpg)' onClick='show_hide(\"d_".$row->ID."\")'><p class='style1'><b><a>".$row->Date."</a></b><a>".$row->UpdateName."</a></p></div>";  
            print "<div id='d_".$row->ID."' style='display:none;border:#000000 solid 1px;' class='style1'>";
            print $row->Description;
            print "</div>";

      }
?>

</body>
</html>
LVL 19
Stephen MandersonSoftware EngineerAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

BrianGEFF719Commented:
Try something like this:

<script>
var lastObj;
var hasDone;
function show_hide(obj) {
     
      var el = document.getElementById(obj);
      if (hasDone){
            lastObj.style.display = '';
      }
      if (el != lastObj)
      {
            hasDone = true;
            lastObj = el;
            el.style.display = '';
      }
}

</script>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Stephen MandersonSoftware EngineerAuthor Commented:
Thanks for that quick reply,

Thanks for that, changed to lastObj.style.display = 'none'; and it works great, any ideas on the gap between the div rows ?

Thanks Again
Steve
0
BrianGEFF719Commented:
Try:

   
            print "<div style='background-image: url(bar.jpg)' onClick='show_hide(\"d_".$row->ID."\")'><p class='style1'><b><a>".$row->Date."</a></b><a>".$row->UpdateName."</a></p>";  
            print "<div id='d_".$row->ID."' style='display:none;border:#000000 solid 1px;' class='style1'>";
            print $row->Description;
            print "</div></div>";
0
steelseth12Commented:
Steve did you check my last reply on your previouse post on how to do it with tables ?
0
Stephen MandersonSoftware EngineerAuthor Commented:
Many thanks to you both for your help, got another question with regards to your example seth,

is there a simple way to show the date in the format dd-mm-yyyy ? and inc time so the output can be sorted into time aswell?

Regards
Steve
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
PHP

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.