没有域的Grails链选择 [英] Grails chain selects without domains

问题描述

我正在尝试使用Ajax将两个，可能是三个<g:select ...>语句链接在一起，如下所示

I'm trying to chain two, possibly three <g:select ...> statements together using Ajax like is shown here Populate dropdown list using ajax In grails but all the examples I find have two big differences from what I'm using. 1. I'm using the jQuery library, not prototype. And 2. I don't have domain objects for my select values, they are pulled from an Oracle table via a service call.

我的问题是这样的:

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

主修科目和专修科目通过控制器到达，但填充在服务类别中.

Where the majors, and concentrations come through the controller but are populated in a service class.

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

I was thinking the controller method would look something like

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

}

但是，我无法正常工作.

But, I can't get it to work.

有什么想法吗?还是有人有使用jQuery而不使用Grails 2.2.4来实现域对象的示例?

Thoughts? Or someone have an example of doing this with jQuery and no domain objects using Grails 2.2.4?

推荐答案

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

You can really do it without being javascript-library specific. If you use the grails built-in remoteFunction it will handle the jQuery portion for you. What you would then want for your degreeSubject select is:

<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做到这一点，则可以这样做:

The key being the onChange event calling the remoteFunction. The remote function will make an ajax call to whatever controller action you want, but you'll need to call a javascript function to take in the results of your controller action and populate the other select. If you wanted to do this with simple js you could do this:

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

最后，您的控制器动作应如下所示:

and finally your controller action should look like this:

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

这篇关于没有域的Grails链选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！