ajax - Grails动态下拉菜单使用remoteFunction不起作用

Question

我正在尝试在Grails中创建一个动态下拉菜单。在第一个下拉菜单上进行选择后，第二个下拉列表未填充。

这是我在_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>

我的 Controller 中的代码:

def findJobTitleForDepartment = {
  println "findJobTitleForDepartment"
  def job = MGDepartment.get(params.department.id)
  render(template: 'jobTitleSelection', model:  [mGJobTitle: job.mGJobTitle])
}  

在我的 header 中，我有:

<g:javascript library="jquery"/> 

有没有办法使动态下拉菜单起作用？

Answer 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>

//发现findJobTitleForDepartment应该像这样实现

 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} // you 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
            }