I’ve been trying to get my chained drop boxes to work for a week, with limited success, but I’ve narrowed down the problem.
Using 5 Pieces’ Tutorial and Code Assembly’s Tutorial, I’ve set up chained dropdown boxes. The combobox page works (when I disable the input), the before:function works, and I’ve made sure my javascript pages are in the place specified. But the function stops before sending back the second dropbox items.
My code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Chained comboboxes demo</title>
[removed][removed]
[removed][removed]
[removed]
$(function()
{
$('#blogcategory').chainSelect('#entrydrop','/Orders/combobox/',
{
before:function (target)
{
$("#loading").css("display","block");
$(target).css("display","none");
},
after:function (target)
{
$("#loading").css("display","none");
$(target).css("display","inline");
$(".jumpmenu").change(function() {
var val = $(this).selectedValues();
if (val != '') {
location.href=val;
}
});
if ($(target).val() == null)
{
$(target).css("display","none");
}
}
});
});
[removed]
<style>
#loading
{
position:absolute;
top:0px;
right:0px;
background:#ff0000;
color:#fff;
font-size:14px;
font-familly:Arial;
padding:2px;
display:none;
}
</style>
</head>
<body>
<div id="loading">Loading ...</div>
<h1>Chained select demo</h1>
<div id="categorypicker">
<form name="formname" method="post" action="">
<select id="blogcategory" name="blogcategory">
<option value="">Select a Category</option>
{exp:channel:categories channel="print_options" show_empty="no" style="linear" parent_only="yes"}
<option value="{category_id}">{category_name}</option>
{/exp:channel:categories}
</select>
<select name="entrydrop" id="entrydrop" class="jumpmenu"></select>
</form>
</div>
</body>And my combobox php (with the page parsing PHP on input):
<?php
$array = array();
/*$cat_id = $this->EE->input->get('_value');*/
$query = $this->EE->db->query("SELECT title, url_title FROM exp_category_posts INNER JOIN exp_channel_data USING(entry_id) INNER JOIN exp_channel_titles USING(entry_id) WHERE status ='open'");
$array[] = array(null => 'Choose an article');
foreach($query->result_array() as $row)
{
$entry_title = ($row['title']);
$entry_url_title = ($row['url_title']);
$custom_url = '/news/'.$entry_url_title;
$array[] = array($custom_url => $entry_title);
}
function php2js($a)
{
if (is_null($a)) return 'null';
if ($a === false) return 'false';
if ($a === true) return 'true';
if (is_scalar($a)) {
$a = addslashes($a);
$a = str_replace("\n", '\n', $a);
$a = str_replace("\r", '\r', $a);
$a = preg_replace('{(</)(script)}i', "$1'+'$2", $a);
return "'$a'";
}
$isList = true;
for ($i=0, reset($a); $i<count($a); $i++, next($a))
if (key($a) !== $i) { $isList = false; break; }
$result = array();
if ($isList) {
foreach ($a as $v) $result[] = php2js($v);
return '[ ' . join(', ', $result) . ' ]';
} else {
foreach ($a as $k=>$v)
$result[] = php2js($k) . ': ' . php2js($v);
return '{ ' . join(', ', $result) . ' }';
}
}
echo php2js( $array );
?>
Unfortunately, I’m a beginner at javascript, which is where the problem probably is…