# AJAX rendered select doesn't get submitted

**URL:** <https://www.ruby-forum.com/t/ajax-rendered-select-doesnt-get-submitted/53424>\
**Category:** Rails\
**Created:** [February 4, 2006, 10:01pm UTC](https://www.ruby-forum.com/t/ajax-rendered-select-doesnt-get-submitted/53424 "2006-02-04T22:01:10Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![jason\_cartwright](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/j/ecd19e/32.png) [@jason\_cartwright](https://www.ruby-forum.com/u/jason_cartwright)\
**Post date:** [February 4, 2006, 10:01pm UTC](https://www.ruby-forum.com/t/ajax-rendered-select-doesnt-get-submitted/53424/1 "2006-02-04T22:01:10Z")

</div>

I have implemented the AJAX observe\_field to filter the state/province  
options  
in my address form. This works great except when I submit the form,  
@params  
doesn’t contain the select element.

\_address\_form.rhtml relevant snippet:

\<%= collection\_select(:address, “country”, Country.find(:all, :order =\>  
“position”), :code, :name, {:prompt =\> “-- Select Country --”}, {:class  
=\>  
“siteText”, :style =\> “width: 175px;”}) %\>  
\<%= observe\_field(“address\_country”,  
:frequency =\> 0.25,  
:update =\> “address\_state\_container”,  
:url =\> {:controller =\> ‘state’, :action =\>  
:filtered\_state\_select},  
:with =\> “‘country\_code=’ + value”)  
%\>

* * *

StateController#filtered\_state\_select

def filtered\_state\_select #ajax action  
country = Country.find\_by\_code(@params[“country\_code”])  
@state\_groups = StateGroup.find\_all\_by\_country\_id(country.id)  
@state\_groups.each {|g| g.name = ‘- ’ + g.name + ’ -’}

```
render(:partial => 'options')

```

end

* * *

\_options.rhtml partial that gets rendered:

– Select State/Province –  
\<%=  
option\_groups\_from\_collection\_for\_select(@state\_groups,  
:states, :name, # \<- groups  
:code, :name, nil) # \<- items  
%\>

* * *

contents of @params on form submit

Parameters: {“user”=\>{“name”=\>"", “fax\_number”=\>"", “company\_name”=\>"",  
“password\_confirmation”=\>"", “phone\_number”=\>"", “password”=\>"",  
“email”=\>""},  
“x”=\>“48”, “y”=\>“10”, “action”=\>“create\_account”,  
“controller”=\>“breeder”,  
“address”=\>{“city”=\>"", “postal\_code”=\>"", “country”=\>“US”,  
“street\_ext”=\>"",  
“street”=\>""}}

---

<div class="post-metadata">

**Author:** ![jason\_cartwright](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/j/ecd19e/32.png) [@jason\_cartwright](https://www.ruby-forum.com/u/jason_cartwright)\
**Post date:** [February 6, 2006, 4:58pm UTC](https://www.ruby-forum.com/t/ajax-rendered-select-doesnt-get-submitted/53424/2 "2006-02-06T16:58:03Z")

</div>

I had another, more AJAX experienced railer review my code. In the  
process we  
discovered that the code works in IE6 but fails in Firefox. I don’t know  
if this  
is a prototype bug or if I’m missing some larger issue. As far as I  
know, there  
should be no issue dynamically altering the form on the client-side with  
AJAX.

I’m still fishing for answers, but at least I’m confident the code is  
correct.

---

<div class="post-metadata">

**Author:** ![jason\_cartwright](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/j/ecd19e/32.png) [@jason\_cartwright](https://www.ruby-forum.com/u/jason_cartwright)\
**Post date:** [February 7, 2006, 4:54am UTC](https://www.ruby-forum.com/t/ajax-rendered-select-doesnt-get-submitted/53424/3 "2006-02-07T04:54:32Z")

</div>

Another railer that I’m working with finally resolved this issue. It  
seems that  
Firefox prefers CSS-based layouts over Table-based layouts. When I  
switched over  
to using a purely CSS layout, everything worked fine.

So, if you are seeing a problem submitting AJAX rendered elements in a  
form, try  
to avoid using Tables to layout the form.

---

<div class="post-metadata">

**Author:** ![jason\_cartwright](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/j/ecd19e/32.png) [@jason\_cartwright](https://www.ruby-forum.com/u/jason_cartwright)\
**Post date:** [February 8, 2006, 2:24pm UTC](https://www.ruby-forum.com/t/ajax-rendered-select-doesnt-get-submitted/53424/4 "2006-02-08T14:24:25Z")

</div>

jason cartwright wrote:

> Another railer that I’m working with finally resolved this issue. It  
> seems that  
> Firefox prefers CSS-based layouts over Table-based layouts. When I  
> switched over  
> to using a purely CSS layout, everything worked fine.
> 
> So, if you are seeing a problem submitting AJAX rendered elements in a  
> form, try  
> to avoid using Tables to layout the form.

…and finally using tables for layout fires back to the designer…

even being a weird bug, it’s a userful one to teach not to use tables  
for layout.

Form Layout 101:  
Use floated labels with CSS-specified width and right-aligned text.

---

<div class="post-metadata">

**Author:** ![jason\_cartwright](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/j/ecd19e/32.png) [@jason\_cartwright](https://www.ruby-forum.com/u/jason_cartwright)\
**Post date:** [February 8, 2006, 3:01pm UTC](https://www.ruby-forum.com/t/ajax-rendered-select-doesnt-get-submitted/53424/5 "2006-02-08T15:01:06Z")

</div>

Boy, what a coincidence, just had the same problem over here and  
wondering what to do. This is really a weird bug.

> even being a weird bug, it’s a userful one to teach not to use tables  
> for layout.

But we need a table, not to do layout (all our layout is pure CSS) but  
it’s a table. Of course you can fake tables with CSS, but using CSS  
layout to build tables is just as evil as using tables for layout.

I hope its just a prototype bug.

Cheers,

Erik.