|
Coding the View
As I mentioned in the previous page, we'll assume that there's a parent table called
manufacturers and we want our select box to pull results from this table.
We'll assume that manufacturers has a parent-child relationship with categories
and each manufacturer has many categories.
First we need to modify our search form in our view to add the select box. All changed
lines are marked in bold font
<form method="POST" action="/controller_name/search" name="search_form" >
Search
<%
man_list = ['-- all manufacturers --', 0]
manufacturers = Manufacturer.find(:all, :conditions => ['deleted_flag = 0'], :order => 'name')
manufacturers.each do |man| { man_list << [man.name, man.id] }
%>
<%= select_tag :man_names, options_for_select(man_names, params[:id].to_i) %>
<%= text_field_with_auto_complete :category, :short_desc, {:min_chars => 3},
{:with => "value + '&man_id=' + document.search_form.man_names.value" %>
<input type="submit" value="search" />
</form>
The first change you'll notice is that we're no longer using the rails form_tag() function to
generate our form. Instead, we've changed it to use HTML code for a form tag instead. The reason for
this is that there was no way that I found to set the name of the form using the form_tag() function
and I need to do that for some javascript code below in the text_field_with_auto_complete_function. Since
we no longer use the form_tag() function, we explicitly need to fill in the actual controller_name in the
action= attribute.
The next thing you'll notice is that I build an array called man_list which is populated with two fields
from the manufacturers table (we'll assume you've created the model Manufacturer already). Note
that this should really have been done in the controller, but I am demonstrating it in the view instead,
so that I have less code to edit for this example. While creating man_list, note that I have a default
option for all manufacturers.
The next thing we need to do is create the select box that contains the list of manufacturers, that we
accomplish with the select_tag() function. Note that I set the default for the select to params[:id].to_i,
the reason being that in my actual code, I used this whole form as a partial template in a number of forms
some of which were individual manufacturer pages.
The next REALLY REALLY BIG thing to note is how text_field_with_auto_complete is now being called with
more arguments. The key is the fourth argument (the :with specification). What I'm doing here is telling
it that when the text field makes its XMLHttpRequest to populate the drop-down, it should pass extra parameters
in the query string. The first param to the :with option is value, which contains the argument for the text that is populated in the text-box already.
I found this out by examining the javascript code that is generated by the text_field_with_auto_complete function.
The man_id parameter is built using more javascript and contains the value of what is selected in the SELECT box (it does this by evaluating document.search_form.man_names.value). This
is why I needed the form to have its name= attribute set. Now when the user types something in the text box, the
actual XMLHttpRequest that goes back to the server contains what is in the select field as well as what was typed
in the text box.
The final change is to merely close the form tag.
Next we'll explore how to change the controller to handle selecting with these two parameters
|
|