没有域的 Grails 链选择

Question

我正在尝试使用 Ajax 将两个，可能是三个 <g:select ...> 语句链接在一起，就像这里显示的 Populate dropdown list using ajax In grails 但我发现的所有示例都与我使用的有两个很大的不同。 1. 我使用的是 jQuery 库，而不是原型。 2. 我的选择值没有域对象，它们是通过服务调用从 Oracle 表中提取的。

我的问题是这样的：

<g:select name="degreeSubject" from="${majors}" noSelection="${['':'-Choose Subject-']}" value="${degreeInstance?.degreeSubject }"/>
<g:select name="degreeConcentration" from="${concentrations}" noSelection="${['':'']}" value="${degreeInstance?.degreeConcentration }"/>

专业和浓度来自控制器，但填充在服务类中。

我在想控制器方法看起来像

def updateSelect = {
    def concentrations = degreeService.getConcentrations(params.selectedValue)
    render (template:"selectConcentration", model : ['concentrations' : concentrations])

}

但是，我无法让它工作。

想法？或者有人有一个使用 jQuery 执行此操作的示例，并且没有使用 Grails 2.2.4 的域对象？

Answer 1

您可以真正做到这一点，而无需特定于 javascript 库。如果您使用 grails 内置的 remoteFunction，它将为您处理 jQuery 部分。然后，您想要的学位主题选择是：

<g:select name="degreeSubject" 
          from="${majors}" 
          noSelection="${['':'-Choose Subject-']}" 
          value="${degreeInstance?.degreeSubject }"
          onChange="${remoteFunction(
            controller: 'yourControllerName', 
            action: 'updateSelect', 
            params: '\'value=\' + escape(this.value),
            onSuccess: 'updateConcentration(data)')}/>

关键是调用remoteFunction的onChange事件。远程函数将对您想要的任何控制器操作进行 ajax 调用，但您需要调用 javascript 函数来获取控制器操作的结果并填充另一个选择。如果你想用简单的 js 做到这一点，你可以这样做：

function updateConcentration(items) {
    var control = document.getElementById('degreeConcentration')

    // Clear all previous options
    var i = control.length
    while (i > 0) {
        i--
        control.remove(i)
    }

    // Rebuild the select
    for (i=0; i < items.length; i++) {
        var optItem = items[i]
        var opt = document.createElement('option');
        opt.text = optItem.value
        opt.value = optItem.id
        try {
                control.add(opt, null) // doesn't work in IE
        }
        catch(ex) {
                control.add(opt) // IE only
        }
    }
}

最后你的控制器动作应该是这样的：

def updateSelect(value) = {
    def concentrations = degreeService.getConcentrations(value)
    render concentrations as JSON // or use respond concentrations if you upgrade to 2.3
}