Solved

Dynamic tables without line break

Posted on 2007-03-25
5
237 Views
Last Modified: 2007-03-25
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>
0
Comment
Question by:Stephen Manderson
  • 2
  • 2
5 Comments
 
LVL 19

Accepted Solution

by:
BrianGEFF719 earned 450 total points
ID: 18789361
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
 
LVL 19

Author Comment

by:Stephen Manderson
ID: 18789393
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
 
LVL 19

Expert Comment

by:BrianGEFF719
ID: 18789404
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
 
LVL 20

Assisted Solution

by:steelseth12
steelseth12 earned 50 total points
ID: 18789425
Steve did you check my last reply on your previouse post on how to do it with tables ?
0
 
LVL 19

Author Comment

by:Stephen Manderson
ID: 18789602
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

Featured Post

Easy Project Management (No User Manual Required)

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Consider the following scenario: You are working on a website and make something great - something that lets the server work with information submitted by your users. This could be anything, from a simple guestbook to a e-Money solution. But what…
Developers of all skill levels should learn to use current best practices when developing websites. However many developers, new and old, fall into the trap of using deprecated features because this is what so many tutorials and books tell them to u…
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now