How Do I Build More Than 1 Drop-down Selector Menu On The Same Table/layer In Google Fusion Table?

I've created a series of Google Fusion Table maps on my site, Community Media Database, which allow the user to toggle on and off multiple layers. For each layer, I've also built

Solution 1:

Well issue one is being able to retrieve values from your select lists. I give all my select lists an id and use jQuery.js to access those values using:

var value = $('#program_select_id').val();

Second is chaining your query conditions via ' AND ' which your code already seems to grasp.

Here's an example of some jQuery dependent code that I use:

<scriptsrc="http://code.jquery.com/jquery-1.7.1.min.js"></script><scripttype="text/javascript">functionsetQuery(ft_layer, current_table_id, location_col)
{
    var query = [];

    var value = $('#program_select_id').val();
    if(value !== ''){
        query.push("'program' = '" +  value + "'");
    }
    value = $('#provider_select_id').val();
    if(value !== ''){
        query.push("'data_provider' = '" +  value + "'");
    }
    value = $('#observable_select_id').val();
    if(value !== ''){
        query.push("observables CONTAINS '" + value + "'");
    }

    var where = query.join(' AND ');

    var qryOpts = {
      query: {
        select: location_col,
        from: current_table_id,
        where: where
      }
    };
    ft_layer.setOptions(qryOpts);
}

</script>