简体   繁体   中英

Toggle Panels With PHP

I wonder whether someone may be able to help me please.

From some demos and tutorials I've found, I've put together this page which adds toggle panes to a page using values from a mySQL database to populate the fields.

The problem I'm having is that at each layer only the first out of multiple records is shown.

eg The screen currently shows 16/03/2012 as the only record, there should be one other record for the 23/02/2012.

Then within the 16/03/2012, the next level should show two items, whereas it is only showing one.

I've been working on this for a while now but I can't seem to find the solution of how to show the correct number of records.

I just wondered whether someone could perhaps have a look at this please and let me know where I'm going wrong.

I've added the full script below for reference.

<!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=UTF-8" /> 
<title>Panel Test</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function() {
  jQuery(".content").hide();
  //toggle the componenet with class msg_body
  jQuery(".heading").click(function()
  {
    jQuery(this).next(".content").slideToggle(500);
  });
});
</script>
<style type="text/css"> 
body {
    margin: 20px auto;
    font: 12px Verdana,Arial, Helvetica, sans-serif;
}
.layer1 {
margin: 0;
padding: 0;
width: 500px;
}

.heading {
margin: 1px;
color: #fff;
padding: 3px 10px;
cursor: pointer;
position: relative;
background-color:#c30;
}
.content {
padding: 5px 10px;
background-color:#fafafa;
}
p { padding: 5px 0; }
</style> 
</head> 
<?php
mysql_connect("hostname", "username", "password")or
die(mysql_error());
mysql_select_db("database");

$result = mysql_query("SELECT userdetails.userid, finds.dateoftrip, detectinglocations.locationname, finds.userid, finds.locationid, detectinglocations.locationid,   finds.findname, finds.finddescription FROM userdetails, finds, detectinglocations WHERE finds.userid=userdetails.userid AND finds.locationid=detectinglocations.locationid AND finds.userid = 1 ORDER BY dateoftrip DESC");

if (mysql_num_rows($result) == 0) 
// table is empty 
  echo 'There are currently no finds recorded for this location.'; 
  else
 { 
    while ($row = mysql_fetch_array($result)) 
    { 
    $dateoftrip = $row['dateoftrip']; 
    $findname = $row['findname'];   
{ 
}
}
}
?>
<body>
<div class="layer1"> 
        <p class="heading"><input name="dateoftrip" id="dateoftrip" type="text" value="<?php echo $dateoftrip;?>" disabled="disabled"/></p> 
        <div class="content"> 
            <input name="findname" id="findname" type="text" value="<?php echo $findname;?>" disabled="disabled"/>
        </div> 
</div> 
</body> 
</html> 

Many thanks and kind regards

You are fetching all the records but using only the last one. You should put this:

<div class="layer1"> 
        <p class="heading"><input name="dateoftrip" id="dateoftrip" type="text" value="<?php echo $dateoftrip;?>" disabled="disabled"/></p> 
        <div class="content"> 
            <input name="findname" id="findname" type="text" value="<?php echo $findname;?>" disabled="disabled"/>
        </div> 
</div> 

in the while loop which fetch the data:

    while ($row = mysql_fetch_array($result)) 
    { 
     $dateoftrip = $row['dateoftrip']; 
    $findname = $row['findname'];

So it will look like this:

        while ($row = mysql_fetch_array($result)) 
        { 
         $dateoftrip = $row['dateoftrip']; 
        $findname = $row['findname'];
echo '<div class="layer1"> 
            <p class="heading"><input name="dateoftrip" id="dateoftrip" type="text" value="'.$dateoftrip.'" disabled="disabled"/></p> 
            <div class="content"> 
                <input name="findname" id="findname" type="text" value="'.$findname.'" disabled="disabled"/>
            </div> 
    </div>';
       }

You need to put your output inside your loop. Also you may have to modify your javascript to account for the multiple content ids.

You should also make the form controls into arrays so you'll be able to parse them if needed (see below).

For example, this is how to modify the form.

?>
<body>
<div class="layer1"> 
<?php
   while ($row = mysql_fetch_array($result)) 
    { 
    $dateoftrip = $row['dateoftrip']; 
    $findname = $row['findname'];   

    $i++;
?>
    <p class="heading"><input name="dateoftrip[]" id="dateoftrip" type="text" value="<?php echo $dateoftrip;?>" disabled="disabled"/></p> 
    <div class="content"> 
        <input name="findname[]" id="findname" type="text" value="<?php echo $findname;?>" disabled="disabled"/>

<?php

{ 
}
}
}    
?>
    </div> 
</div> 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM