Grails: загрузка данных на один ComboBox в зависимости от другого

Допустим, у меня есть комбинированный список с опциями 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, но я провел небольшое исследование в Google, и не все так просто, как я думал.

Кто-нибудь знает, что будет лучшим способом сделать это? Заранее спасибо!

FG

Источник

3 ответа

Похоже, вы захотите использовать 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>

Я уверен, что перепутал некоторый синтаксис, и вам определенно придется немного изменить его, чтобы работать с вашим кодом. Но, по крайней мере, у вас есть общая идея.

И чтобы использовать их, добавьте их в базу данных как ShippingOptions. Вот один из способов сделать это.

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

PS: Вы также сможете динамически отображать методы доставки.

См. Также: remoteFunction, g: select, шаблоны и AJAX.

Источник

Я хотел бы рассмотреть вопрос о перепроектировании вашего пользовательского интерфейса и изменении потока. Выпадающая зависимость, которую вы описываете, предполагает, что форму, вероятно, следует разделить, и принятие "подобного мастеру" решения приведет к более удобному и надежному решению, которое будет работать и без JavaScript.

Источник

У меня есть рабочий пример с использованием AngularJS и Grail здесь:

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

(извиняюсь, если это не подходит, так что "стиль", но я не "думаю, что размещение сотен строк кода и словоблудия тоже уместно).

Источник
Другие вопросы по тегам