Question

假设我有一个带有GENERAL，AIR，GROUND和SEA选项的组合框

<g:select name="group" from="${['GENERAL', 'AIR', 'GROUND', 'SEA']}" valueMessagePrefix="default.category" value="${tipoN}" />

然后是另一个组合框，根据您是选择GENERAL，AIR，GROUND还是SEA来加载某些信息。

假设GROUND有3个选项FedEx, USPS, DHL，但AIR有完全不同的选项，AIRPLANE, JET, HOT AIR BALLOON。

其他<g:select>的名称应为"commodity"

我考虑过创建一个javascript文件并处理HTML等所有内容，但我做了一些谷歌研究，并不像我想的那么简单。

有谁知道最好的方法是什么？提前谢谢！

FG

Answer 1

听起来你会想要使用AJAX。一种方法是使用模板和域对象的组合：

// grails-app/domain/ShippingOption.groovy

class ShippingOption = {
    String method, // can be 'ground', 'sea', 'air', or 'general'
           name    // can be 'fedex', 'ups', etc.

    def options = {
        def meth = params.method ?: "general"
        def comList = ShippingOption.findByMethod(meth)
        render(template:"shippingList", model: [ commodityList: comList ])
    }
}

模板：

<!-- grails-app/views/_shippingList.gsp -->
<g:each var="opt" in="${commodityList}">
    <option value="${opt.name}">${opt.name}</option>
</g:each>

在你的gsp中有选择框：

<!-- ... other stuff is before here ... -->
<g:select name="method" from="${['GENERAL', 'GROUND', 'SEA', 'AIR']}"
    onchange="${remoteFunction(action:'options', update:'commodity', 
        params:''method=' + this.value' )}" />
<select id="commodity"></select>

我确定我已经搞砸了一些语法，你肯定要重构一下这一点来处理你的代码。但至少你有一般的想法。

要使用它们，请将它们作为ShippingOption添加到数据库中。这是一种方法。

["fedex", "ups"].each { name ->
    def so = new ShippingMethod(method: "ground", name: name )
    so.save()
}

PS：你也可以动态渲染出货方式。

另请参阅：remoteFunction，g:select，templates和AJAX

Answer 2

我会考虑重新设计您的UI并更改流程。您正在描述的下拉依赖项表明该表单可能应该被拆分，并且采用“类似向导”的解决方案将导致更加用户友好且可靠的解决方案，该解决方案也可以在没有JavaScript的情况下运行。

Answer 3

我在这里使用AngularJS和Grail有一个有用的例子：

http://wordpress.transentia.com.au/wordpress/2013/12/24/keeping-up-with-the-joneses/

（道歉，如果这不合适''风格'，但我不认为发布100行代码和措辞也是合适的。

Grails：根据另一个ComboBox加载数据

3 个答案: