Using AJAX to generate complex forms interactively - any guides?

hi guys,

Consider this scenario in relation to a blog posting application.

- a form has been loaded for a user to create a new blog entry - attributes are: title, content, category and sub-category

  -user goes ahead and fills in text to the title and content attributes   - user selects an option from the drop down (select) box representing the 'category' attribute. Possible values are:    "politics", "finance" and "entertainment".   - upon selecting a category value, the "sub-category" attribute's drop down (select) should be populated.

  For example, if a user selects "politics", the sub-categories that can be selected are: "US,AU,NZ" whilst when "finance" is selected, the sub-categories that can be selected are: "mining", "bonds" and "interest rates" and when "entertainment" is selected as a category, the sub-categories that can be selected are: "sports", "music" and "theatre".

I know that the scenario above would have Ajax as its' solution. Roughly, I figure it would be the case that the onChange javascript attribute is to be used on the category select box. When the value changes, an Ajax request is made to the necessary controller and the controller will return the sub-category values of the selected category.

Has anyone got a link to a good tute I can look at? I read the rails books i have but I can't find anything similar to this.

Thank you

Hi    You can have a look at protype helper observe_field


hi, all,

I found this railscast as per another ruby talk.

It does what I want but I would really like to figure out how to do it in ajax on rails.

I have some code put up based on observe_field. A few bumps here and there but will keep trying.

Cheers! :slight_smile:

I learned how to create dynamic select boxes by reading


thank you. Just had a look at it.

Whenever you load data into objects in the controller (which gets received by the view), how do you stop the first element from being selected by default when you load the page?

In relation to the example in, assume @artists has the following values: "Jimi Hendrix", "Prince", "Kenny Wayne Shepherd" and "Jonny Lang".

Now, when the index.html.erb page loads and builds the form, it's the case that the first entry, "Jimi Hendrix" will be preselected. How do you stop that? Would you add an "empty" /nil element? Sorry, I'm from the Perl world and am getting myself into Rails so I might not know the syntax of how to do certain things.

Thank you

I do something like this in my controller:

    part_numbers = Part.all(:order => "number")     @parts = [["None", nil]] + {|p| p.number}

and something like this in my view:

  <%= select_tag "clone_part",       options_for_select(@parts, @clone_part),       :onchange => "#{remote_function(:url => new_component_path,                             :with => "'clone_part='+$('clone_part').value")}"    %>

The first item in my list of part numbers is now "None". By giving it a value of nil, this parameter will not show up in my form if the user does not select a part. If the user does select a part, it gets passed to my controller as a parameter to the #new_component_path action.


hello, guys,

I read the docs for collection_select and by giving it ' {:include_blank => true}', an empty value will be generated and placed before all other select options.

Here's what I did only in my view:

--------------------------------- Start

"if @sub_categories == nil".

Hi    Check @sub_categories.blank?


I got it working.

Controller - just fetches sub categories based on the given category id. Returns @sub_category to the view.

View - it decides if a subcategory select box is to be displayed or not based on the size of the array ie. if @subcategory.length >0

I will try out "@sub_categories.blank?" to see if it works too or not. Thanks ,Sijo kg!

I'm pretty sure that #blank? is supposed to be used to check if a parameter is present or, if present, is blank. I think the method you're looking for here is #empty?

unless @sub_categories.empty?   do something, :here => :now end