Solved

Dynamic tables without line break

Posted on 2007-03-25
5
239 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

Is Your AD Toolbox Looking More Like a Toybox?

Managing Active Directory can get complicated.  Often, the native tools for managing AD are just not up to the task.  The largest Active Directory installations in the world have relied on one tool to manage their day-to-day administration tasks: Hyena. Start your trial today.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
Author Note: Since this E-E article was originally written, years ago, formal testing has come into common use in the world of PHP.  PHPUnit (http://en.wikipedia.org/wiki/PHPUnit) and similar technologies have enjoyed wide adoption, making it possib…
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

770 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