Auto Load Second Dropdown using AJAX

Question

Im having a problem loading the AJAX and I tried to follow this answer by Praveen Kumar First drop down menu to auto change the options of a second dropdown and also read about ajax from http://codex.wordpress.org/AJAX_in_Plugins and it is quoted there

Since Version 2.8, The javascript global variable ajaxurl can be used in case you want to separate your javascript code from php files into javascript only files. This is true on the administration side only.

So i guess there is no problem loading ajax in my page. My code goes like this

HTML:

  <form action="#" method="POST">
    <select name="region" onchange="messi_code(this.value)">
        <option>Region Select</option>
        <option value="East">East</option>
        <option value="West">West</option>
        <option value="North">North</option>
            <option value="South">South</option>
    </select>
    <br>
    <select id="region_branch" name="region_branch">
        <option>Select City</option>
    </select>

</form>

AJAX:

<script type="text/javascript">
function  messi_code(parent){
     url= 'process.php?parent=' + parent,
     $.get(url,function(data){
       alert(data);
     /* $("#region_branch").html(data);*/
    });
}
</script>

by the way, in the ajax script I tried POST, GET and remove the type and still having an error in the J-console, error says Uncaught ReferenceError: ajaxfunction is not defined: onchange

would appreciate some help in this.

Answer 1

<form action="#" method="POST">
    <select name="region" onchange="messi_fan(this.value);">
        <option>Region Select</option>

        <option value="East">East</option>
        <option value="West">West</option>
        <option value="North">North</option>
            <option value="South">South</option>
    </select>
    <br>
    <select id="region_branch" name="region_branch">
        <option>Select City</option>
    </select>

</form>


<script>
     function  messi_fan(parent){
     url= 'process.php?parent=' + parent;
     $.post(url,function(data){
       alert(data);
    });
}
</script>

jsfiddle