load second dropdown values based on the first (how to implement AJAX)

[eluser]bhakti.thakkar[/eluser]
Hi,
i am new to CI.
View:

Code:

[removed]
function LoadSubprograms(Project_ID)
  {
//      alert(Project_ID);
    var ObjHttp= new CreateNewHttpObject();
    if(ObjHttp)
    {
      var dataSource = "<?=base_url()?>certificates/get_subprograms/"+Project_ID;

      ObjHttp.open("post", dataSource);
      ObjHttp.onreadystatechange = function()
      {
          alert('here');
        if (ObjHttp.readyState == 4 && ObjHttp.status == 200)
        {
          var returnVal=ObjHttp.responseText;
          alert(returnVal);
          document.getElementById(Subprogram_ID).value=returnVal;
        }
        ObjHttp.send(null);
      }
    }
  }

  function CreateNewHttpObject()    //Create an Instance of HTTP request.
{
    var xmlHttp=null;
    try{      // Firefox, Opera 8.0+, Safari
     xmlHttp=new XMLHttpRequest();
    }
    catch (e){          // Internet Explorer
      try{
        xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
      catch (e){
       xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
     }
     return xmlHttp;
  }

[removed]
<TABLE width="100%" class="table" cellpadding=3 cellspacing=1>
&lt;form name="mainform" method=post&gt;
<TR>
    <TD width="20%" class="tdheader">Projects</TD>
    <TD class="datatd"><select name="Project_ID" id="Project_ID">
        &lt;? foreach($query->result() as $row) { ?&gt;
            <option name="Project_ID" value="&lt;?=$row->Project_ID?&gt;">&lt;?=$row->Project_ID?&gt;</option>
        &lt;? } ?&gt;
    </select></TD>
</TR>
<TR>
    <TD class="tdheader">Subprogram</TD>
    <TD class="datatd">
<select name="Subprogram_ID" id="Subprogram_ID">
        &lt;? foreach($subprog_query ->result() as $row2) { ?&gt;
            <option value="&lt;?=$row2->Subprogram_ID?&gt;">&lt;?=$row2->Subprogram_ID?&gt;</option>
        &lt;? } ?&gt;
    </select> </TD>
</TR>
<TR>
    <TD class="tdheader">Certificate type</TD>
    <TD class="datatd">
    <select name="CertificateType">
        <option value="1">Transaction certificate</option>
        <option value="2">Import / Transaction certificate</option>
    </select></TD>
</TR>

Controller :

Code:

function get_subprograms($Project_ID)
{
        $this->load->library('ajax');
        $this->load->model('projects_model');

        $subprog_query = $this->projects_model->getSubprograms($Project_ID);
//        print_r($subprog_query);
        return $subprog_query;
        
    }

}

Nothing happens. can anyone please help me in this