ansaurus

Question

Grails: Load data on one ComboBox depending on another

Answer 1

+1 A:

Sounds like you'll want to use AJAX for this. One way you could do it is by using a combination of templates, and domain objects:

// 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 ])
    }
}

And the template:

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

And in your gsp with the select box on it:

<!-- ... 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>

I'm sure I've messed up some syntax, and you'll definitely have to refactor this a bit to work with your code. But at least you've got the general idea.

And to use them, add them to the database as ShippingOptions. Here's one way to do it.

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

PS: You'd also be able to render the shipping methods dynamically, as well.

See also: remoteFunction, g:select, templates, and AJAX

Pat 2010-09-22 16:05:56

But where do I give each "method" the options?? I get the general idea, I'm just a little lost. Like where do I give each one the options?

fgualda87 2010-09-22 20:32:00

See the edited answer.

Pat 2010-09-23 01:42:41

That last piece of code where should it go?? In the controller??

fgualda87 2010-09-24 13:50:58

Also, the code for the `g:select` seems to be the first one, what happened with the second?? I'm sorry I'm a little lost :/

fgualda87 2010-09-24 13:58:22

The last piece of code can go anywhere you want it. Maybe in the BootStrap.groovy file? If you don't want to add them via code, you can always use scaffolding and add them manually. The second select is the one with the id of "commodity". Since you're updating it via AJAX, you don't need it to be a `g:select`.

Pat 2010-09-27 14:49:26

Ok, I'm a little lost. The second box is not loading, but the first one is. GENERAL, GROUND, AIR, SEA. Should be the first box. And then depending on each one, different things should be available to select on the second dropdown box. Where, in the code you gave me, do I declare those different options?? The last piece of code??

fgualda87 2010-09-27 19:00:54

You'll need to make sure the different options are in the database - that's where its pulling it from. The closure working on `['fedex', 'ups']` will dynamically add them. If you add that to your BootStrap.groovy file, it will automatically add them to the database once the application is loaded. I wish I could offer more help, but its hard to debug the problem without being able to see the code.

Pat 2010-09-28 00:45:39

Where do I declare the options for the rest of the "methods". I see only general is described, what happened with the others??

fgualda87 2010-09-29 15:21:13

Also I'm getting an error when loading that code :( Exception Message: startup failed: C__Documents_and_Settings_density_grails_app_views_density__search_gsp: 20: expecting ')', found 'method' @ line 20, column 395. update:'commodity', params:''method=' + ^ 1 error

fgualda87 2010-09-29 15:21:41

For the error, trying playing around with the quotes in the params property. There may be an extra one in there. For the other "methods", you'll have to add them as you need them. You can do that via the closure on the list object (`['fedex', 'ups'`), or you can manually add them in.

Pat 2010-09-30 18:41:26

Answer 2

A:

I would consider re-designing your UI and changing the flow. A drop-down dependency that you are describing suggests the form should probably be split and adopting a 'wizard-like' solution will result in a more user-friendly and solid solution that will work also without JavaScript.

mfloryan 2010-09-24 08:38:53

Explain, I don't get what you are trying to say. I'm open to any suggestions. But I need the user to select an option and then depending on that have certain options.

fgualda87 2010-09-24 18:59:11

I assume the two drop-downs are to be on the same page and hence the problem. I'm suggesting that perhaps you could redesign the interface and create an alternative flow through the UI such, that does not require a dependant select drop-downs..

mfloryan 2010-09-24 21:08:31

No, it has to be like that

fgualda87 2010-09-27 18:54:13

ansaurus

tags:

views:

answers:

Grails: Load data on one ComboBox depending on another

related questions