load select option during on change event

[anony]

Hello

I am trying to load a select option depending on the value selected on another select option

<select id="state" onchange="SelectValue();">
    <option value="State1">State1</option>
    <option value="State2">State2</option>
    <option value="State3">State3</option>
</select>
<select id="district"></select>

<script type="text/javascript">
        function SelectValue()
        {
            var e = document.getElementById("mfr");
            var Val = e.options[e.selectedIndex].value;

        }
</script>

I want to call this function GetDistrict(Val) from javascript function SelectValue and display the result in select box with id district.

function GetDistrict($stateID)
{
    $query="select * from tabledistrict where stateId="+$stateId;
    ...............//here i am fetching the district names in this function
}

Any help will be greatly appreciated.
I have been browsing the net for this, and i have come across using ajax. As i am new to ajax, i want to know if this can be done with plain javascript??

[radhakrishna.p]

AJAX programing is best solution for this kind of requirements

go thru the following link it may helps you

http://www.w3schools.com/php/php_ajax_database.asp

http://www.w3schools.com/ajax/ajax_database.asp

let me know if you have any doubts in my clarification

[AARTI SHRIVAS]

use this ajax link very good examples are given here
http://www.9lessons.info/2011/01/gravity-registration-form-with-jquery.html