Dynamic Valuelists with JQuery
Posted: Sat Jan 21, 2012 5:13 pm
I had some pretty good luck with the Wiki article http://xataface.com/wiki/Dynamic_select_boxes for my inventory management project. But after a while keeping track of all the JS and PHP code was beginning to be a pain. I'm sure this could be streamlined some more but I though I'd share if anyone is interested.
In this example when a user selects a manufacturer from the drop down the page will automatically narrow down the number available models based on which manufacturer was selected.
First, create a simple action to generate the options portion of a drop down select box.
Now in the class_<TABLE_NAME> add
In this example when a user selects a manufacturer from the drop down the page will automatically narrow down the number available models based on which manufacturer was selected.
First, create a simple action to generate the options portion of a drop down select box.
- Code: Select all
class actions_selectList {
function handle(&$parms) {
// SELECT * FROM <TABLE> WHERE BLAH=BLAH
$app =& Dataface_Application::getInstance();
$auth =& Dataface_AuthenticationTool::getInstance();
$request =& $app->getQuery();
$table =& $request['-table'];
$where =& $request['-where'];
$whereID =& $request['-whereid'];
$val =& $request['-val'];
$text =& $request['-text'];
$records = df_get_records_array($table, array($where=>$whereID));
if ( ! isset($request['-selected']) ) {
echo '<option value="" selected="selected">Please Select ...</option>' . "\n";
}
foreach ( $records as $record ) {
if ( isset($request['-selected']) ) {
echo '<option value="' . $record->val($val) . '" selected="selected">' . $record->val($text) . '</option>';
}
else {
echo '<option value="' . $record->val($val) . '">' . $record->val($text) . '</option>';
}
echo "\n";
}
}
}
Now in the class_<TABLE_NAME> add
- Code: Select all
function block__after_new_record_form() {
echo<<<END
<script language="javascript">
$('#ManufacturerID').change(function() {
if ( $('#ManufacturerID').val() == "" ) {
$('#ModelID').html("");
}
else {
$('#ModelID').html("<option >Loading Models</option>");
$('#ModelID').load('/<My SITE DIR>/index.php?-action=selectList&-table=Models&-val=ModelID&-text=Model&-where=ManufacturerID&-whereid=' + $('#ManufacturerID').val());
}
});
END;
}
</script>