xajax expanding list query
https://stackoverflow.com/questions/5006832
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian문제
As you'll see, I'm a newbie to all this ajax stuff but I can do a bit of php and so I plumped for xajax to take care of the javascript for me.
I've got an array with items listed in different section. I want to use this array to produce an unordered list that expands when someone clicks on a section.
I've adapted a script I found here:
My script currently looks like this:
<?php
include ("xajax_core/xajax.inc.php");
$subs = array(
"Mortice" => array("Union Deadlock 2.5", "Union Deadlock 3", "Union Sashlock 2.5", "Union Sashlock 3"),
"Cylinders" => array("30/30 Euro", "30/40 Euro", "30/50 Euro", "30/60 Euro"),
"uPVC" => array("30/92 Fullex", "35/92 Fullex", "Sash jammer")
);
function addsub($show, $key)
{
$objResponse=new xajaxResponse();
if ($show=="true") {
$objResponse->assign("list", "style.display", "block");
$objResponse->replace("$key","innerHTML","true","false");
}
else {
$objResponse->assign("list", "style.display", "none");
$objResponse->replace("$key","innerHTML","false","true");
}
return $objResponse;
}
$xajax = new xajax();
$xajax->registerFunction("addsub");
$xajax->processRequest();
?>
<!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" />
<?php $xajax->printJavascript() ?>
<title>Expand menu test</title>
<style type="text/css">
.list {display: none;}
</style>
</head>
<body>
<?php
echo "<ul>\n";
foreach ($subs as $key => $group) {
echo "<li id=\"".$key."\" onClick=\"xajax_addsub('true','$key');\">".$key."\n";
echo "<ul class=\"list\" id=\"list\">\n";
while (list($list, $each) = each($group)) {
echo "<li id=\"list\">".$each."</li>\n";
}
echo "</ul>\n</li>\n";
}
echo "</ul>";
?>
</body>
</html>
The idea is that when an element is clicked on it changes the style display to block (thus showing the rest of the list) and sets the function to 'false' so if it's clicked again it will change the display back to none and hide the list.
Needless to say it doesn't work so if someone could point out to me why I'd be eternally grateful.
Cheers,
Nick.
Solved - I sorted it by placing the lists to be shown (or hidden) into <divs> and assigning them each a unique id and setting their style as display: none.
Then I just had to make a request to set the style as block when it was clicked on.
Thanks.
