ajax - Grails dynamic drop down Using remoteFunction is not working -

i'm trying make dynamic drop down menu in grails work. second drop down not populated after select on first drop down.

here's code on _form gsp:

<g:select name="department" from="${mcm.mgdepartment.list(sort:'dep')}" values="${mgmatricessrfapproversinstance?.department?.id}" optionkey="id" noselection="${[null: 'select one...']}"              onchange="${remotefunction (controller: 'mgmatricessrfapprovers', action: 'findjobtitlefordepartment', params: '\'department.id=\' + this.value', update: 'jobtitleselection')}"/>               <td id="jobtitleselection">     <select>         <option>select one...</option>         <g:select name="jobtitle.id" from="${mcm.mgjobtitle.list()}" optionkey="id"/>     </select> </td> 

code in controller:

def findjobtitlefordepartment = {   println "findjobtitlefordepartment"   def job = mgdepartment.get(params.department.id)   render(template: 'jobtitleselection', model:  [mgjobtitle: job.mgjobtitle]) }   

in create header have:

<g:javascript library="jquery"/>  

is there way make dynamic drop down work?

yes ,exactly

like 1 :

 <g:select name="departmentid" id="department" from="${mcm.mgdepartment.list(sort:'dep')}" values="${mgmatricessrfapproversinstance?.department?.id}" optionkey="id" noselection="${[null: 'select one...']}"                  onchange='loadjobtitles();'>      <g:select id="jobtitle" name="jobtitleid" from="${[]}" optionkey="id"/>   <script type="text/javascript">                function loadjobtitles(init)             {                 var root="${resource()}";                 var departmentid=document.getelementbyid('department').value;                                 var url = root+'/departemnt/findjobtitlefordepartment?departementid='+departmentid;                  jquery('#jobtitle').load(url);             }             </script> 

//and findjobtitlefordepartment should implemented this

 def findjobtitlefordepartment() {     def html=""      def jobtitle = null     def dep = null     def boolean empitystring = true        if(params?.departementid!='null') {              dep =department.get(params?.departementid?.tolong())             jobtitle= dep.mgjobtitle.sort{it.name} // can ignore sort here //just list                jobtitle.each {                 if(empitystring)                 {                     empitystring = false                     html=html + "<option selected='selected' value=\'null\'></option>"                     html=html + "<option value=\'${it.id}\'> ${it}</option>"                 }                 else                     html=html + "<option value=\'${it.id}\'> ${it}</option>"  } //if end upper root  render html             }