Javascript

JAVASCRIPT

///
/// Instead of requiring a form action, submit directly from a drop down.
/// Adjusts GET parameters based on key and selected option value extracted from select (this).
///
function dropdown_submit(key, select) {
    var val = (select.options[select.selectedIndex].value);
    get_paramter_submit(key, val);
}
///
/// Adjust GET parameters based on key and value and submit.
///
function get_paramter_submit(key, val) {
    if (val) {
            new_location = location.href;
            if (val.indexOf("none") > -1) { new_location = remove_get_parameter(key); }
            else {
                if (new_location.indexOf(key) > -1)
                        { new_location = remove_get_parameter(key); }
                if (new_location.indexOf("?") > -1)
                        { new_location = new_location + "&" + key + "=" + val; }
                else
                        { new_location = new_location + "?" + key + "=" + val; }
            }
            location.href = new_location
        }
}
///
/// Return location.href with GET parameter matching key removed
///
function remove_get_parameter(key) {
        two_parts = location.href.split("?");
        if (two_parts.length > 1) {
                params = two_parts[1].split("&");
                new_params = "";
                for (i=0; i < params.length; i++) {
                        kv = params[i].split("=");
                        if (kv[0].indexOf(key) == -1) {
                                new_params += params[i];
                        }
                }
                if (new_params.length > 0) {
                        return two_parts[0] + "?" + new_params;
                } else {
                        return two_parts[0];
                }
        } else {
                return location.href;
        }
}

HTML

        <SELECT name="filter_by_interest" onChange="dropdown_submit('filter_by_interest', this);">
                <OPTION value="none">No filter</OPTION>
                {% for interest in interests %}
                        <OPTION value="{{ interest.id }}" {% ifequal selected_interest interest.id %} selected {% endifequal %}>{{ interest.label }}</OPTION>
                {% endfor %}
        </SELECT>
        
        <DIV>
                <SPAN class="letter {% ifequal selected_letter "none" %}selected {% endifequal %}" onClick="location.href = remove_get_parameter('filter_by_letter');">all</SPAN>
                {% for letter in letters %}
                        <SPAN class="letter {% ifequal selected_letter letter %}selected{% endifequal %}" onClick="get_paramter_submit('filter_by_letter', '{{ letter }}');">{{ letter }}</SPAN>
                {% endfor %}
        </DIV>