:: Forum >> Version 2 >>

AJAX with Combo

More information on this topic is available in the documentation section: /ui.combo/.

How can I use AW.UI.Combo to act like a real AJAX control with dynamic DB access? Can I perform filtering of multiple combos using this control? For example, can I filter on state in combo1, county in combo2 (based on combo1 selection) and city in combo3 (based on combo2 selection.

Here is how Ruby on Rails does it:
http://mudabone.com/aietc/?page_id=410

Harshit
Saturday, September 30, 2006
I'm trying to find rounds for a particular depot (selected in a combo box) on a milk delivery application.

I tried to do this with 2 AW combo boxes and got stuck. I have to admit I spend ages frustratedly trying to make AW work.

In the end I used the AW.HTTP.Request to send the contents of the first 'normal' (non AW) combo box to a separate little php program which then found the right items for the second combo box.

This then sends them back in a string which is then untangled by another javascript routine which dynamically fills the second normal combo box.

On the change of the first combo box (the depot selection), a js routine called findRound is called, which is..

function findRound(){
var r = new AW.HTTP.Request;
r.setURL("lookup/find_rounds.php");
r.setRequestMethod("POST");
r.setParameter("round_id", formname.temp_depot_id.value);
r.request();

r.response = function(data){
showComboOptions(data,document.forms[0].temp_round_id);
}
}

The php bit looks like...

<?php
require_once(whatever the connection string is);
mysql_select_db($database_dbase, $dbase);

$query = "SELECT round_id,round_name FROM rounds where round_depot_id = '" . $_POST['round_id'] . "' ";
$dataset = @mysql_query($query, $dbase);

$rec_ids = '';
$rec_names = '';

while ($record = @mysql_fetch_assoc($dataset)) {
$rec_ids .= $record['round_id'] . '|';
$rec_names .= trim($record['round_name']) . '|';

}
echo $rec_ids,$rec_names;

This basically makes 2 strings, being the record id's and the text to put into the next combo box which are sent back as a long combined string.

I think I should be able to pass it across in the form in which javascript would read it as an array but I'm too confused to do this by now.

Then, when the response comes back to the js routine above, it runs a separate function which fills in the second combo box...

The string which has been passed back uses '|' to delimit the items of data, so the js routine turns them back into arrays. the comboName is the name of the second combo bos where the values are to be put in as options.

function showComboOptions(data,comboName){

var dataNames = data.split('|');
var actLen =((dataNames.length -1) /2 );
var optList = new Array();
var optRecnos = new Array();
for (i=0;i<actLen;i++){
optList[i] = dataNames[i+actLen] ;
optRecnos[i] = dataNames[i];
}
var box2 = comboName;
box2.options.length = 0;

for(i=0;i<optRecnos.length;i++)
{
box2.options[i] = new Option(optList[i],optRecnos[i]);
}

}

I'm sure this could be done better and more efficiently but it does seem to work. Hope it helps.

Ian B
Tuesday, October 3, 2006



This topic is archived.

Back to /ui.combo/

Documentation:

Forum search