AJAX : GET/POST FORM Submit with Drop Down Menu

Lets start from view:
Drop Down Menu In your JSP/HTML

<select id = "Language" onchange="javascript:AjaxEx.sendAjaxRequest();">

<option value ='en'>EN</option>

<option value ='fr'>FR</option>

</select> 

AJAX code that reqired to be include in the view

(function() {
 AjaxEx = {
  init: function(url, elId) {
   if (!url || !elId) {
    alert("Invalid input!");
    return;
   }
   this.url = url;
   var el = document.getElementById(elId);
   if (!el) {
    alert("Container Element, to place Ajax response doesn't exists!");
    return;
   }
   this.el = el;
   this.sampleHtml = "
This will be replaced with AJAX response!
";
   // create xml http request object for AJAX requests
   this.xmlHttp = this.initXmlHttp();
  }, // End of init()
 
  initXmlHttp : function () {
   if (window.XMLHttpRequest)
    // Firefox, Opera, IE7, etc.
    return new XMLHttpRequest();
   if (window.ActiveXObject)
    // IE6, IE5
    return new ActiveXObject("Microsoft.XMLHTTP");
  }, // End of initXmlHttp()
 
  resetContent : function () {
   this.el.innerHTML = this.sampleHtml;
  }, // End of resetContent()
 
  sendAjaxRequest : function () {
   // initialize XML Http object if not available
   if (!this.xmlHttp)
    this.xmlHttp = this.initXmlHttp();
 
   if (this.xmlHttp) {
    var ajaxObj = this;
    this.xmlHttp.onreadystatechange = function() {
     if (ajaxObj.xmlHttp.readyState==4 && ajaxObj.xmlHttp.status==200) {
      // 4 = "loaded", 200 = "OK"
      ajaxObj.el.innerHTML = ajaxObj.xmlHttp.responseText;
     }
    };
    var selBox = document.getElementById("Language");
    // prepare parameters
    var langSalect = selBox.options[selBox.selectedIndex].value;
    if (langSalect == "") {
     alert("Please select language!");
     return;
    }
    var params = "langSalect=" + langSalect;
    // for multiple parameters separate them by '&' as given below
    // var params = "empCode=E1001&dept=TestDept"
    this.makePOSTRequest(params);
    // this.makeGETRequest(params);
   } else
    alert("Your browser does not support AJAX.");
  }, // End of sendAjaxRequest()

  makePOSTRequest : function (params) {
   this.xmlHttp.open("POST", this.url, true);
   //Send the proper header information along with the request
   this.xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
   this.xmlHttp.setRequestHeader("Content-length", params.length);
   this.xmlHttp.setRequestHeader("Connection", "close");
   this.xmlHttp.send(params);
  }, // End of makePOSTRequest()

  makeGETRequest : function (params) {
   this.xmlHttp.open("GET", this.url + "?" + params, true);
   this.xmlHttp.send(null);
  } // End of makeGETRequest()

 } // End of AjaxEx
})();

Create Your AJAX content object as fallows for submission of the perticular url and the tag id whose content need to be set Asynchronously

<script type="text/javascript">

<var url = "...../DBServlet">

<var ajaxObj = document.getElementById('.....')>

<AjaxEx.init(url, "ajaxObj">

</script>