使用ajax将选定下拉列表的值作为参数传递给另一个下拉列表中的函数

Question

I need some advice with an ajax function I am building and haven't been able to figure it out so far. So I have select order_by dropdown which uses ajax function called searchFilter to change this.value which is a variable called $orderr_by:

<select name="order_by" 
        onchange="searchFilter('0',
                               '<?php echo $maxRows;?>',
                               this.value);">

I have another select condition dropdown that calls the same searchFilter function and should get the new $orderr_by argument, when the onchange event is triggered for order_by dropdown.

Below I have got it to work for three static arguments but I need to make it work when the $orderr_by argument is changed:

<select name="condition" id="condition" 
        onchange="searchFilter('<?php echo $pageNum;?>',
                               '<?php echo $maxRows;?>',
                               '<?php echo $orderr_by; ?>');">

My Axaj looks like this:

function searchFilter(pageNumbr,maxRows,order_by) {

    var filter  = jQuery.noConflict();

    filter.post(
        MYSURL+'ajaxphp/searchFilters.php?page_no='+pageNumbr+'&max_rows='+maxRows+'&order_by='+order_by, 
        filter('#filterFrm').serialize(), 

        function(html){  
            arrHtml = html.split('<####>');
            filter('#resultContainer').html(arrHtml[0]);    
        }
    );

    } // function searchFilter()

Answer 1

Select the value of the [name=order_by] element.

In pure JS you do this as follows:

var element = document.getElementById("order_by");
var order_by = element.options[element.selectedIndex].value;

jQuery has cleaner ways of doing this.

You do not need order_by in your function declaration. If you do for some reason need to pass order_by from other code, you have to make sure order_by is not already defined:

if (order_by === undefined) {
   ...
}