I am struggling with how to add dynamically add form elements to a form based on user action. Now here is my situation: I have model Project that has_many line_items On the form to create a project I initially display form elements (some drop downs and text boxes) for adding just one line_item. There is also a button or a link on the page (not sure if this should be in the main form or outside). One the user selects that button/link I need to add another set form elements to add another line_item and this can continue to add more line items. It would be nice to provide another button/link to delete line_items. After the user all the form elements for the project and line_items, they can submit the form that will save the project and line_items. So far I have tried to use RJS to add a new line item. But seems like I have to keep a tab of line_items added so far so that name for elements for line_items like line_item1, line_item2 etc. So I have to pass each time to the RJS call that can generate approriate form elememts and also increment the line_item count. I was hoping to set a hidden element containing the line_item count and use rjs replace that hidden element every time the user adds a line_item. This seems a little kludgy to me and I was wondering if somebody can suggest a better approach or I am better off sending the whole form to the server and based name of button pressed either the save the project or redisplay the new project page by adding a new line_item. -- Posted via http://www.ruby-forum.com/.
I can''t say whether this is the "best" way, but it''s
*my* way. I use
observe_form on a radio button and have it call my own JavaScript instead of
making an AJAX call. There are a few of my helpers, so don''t worry
about
those. Here''s an example of the code:
<script type="text/javascript">
//<![CDATA[
function revealDetail()
{
del = $F(''change_lien_holder_user_action_delete'');
add = $F(''change_lien_holder_user_action_add'');
chg = $F(''change_lien_holder_user_action_change'');
if(!del && (add || chg)){
Effect.Appear(''moredetails'');
}
else {
Effect.Fade(''moredetails'');
}
return;
}
<% if @change_lien_holder.errors %>
revealDetail();
<% end %>
//]]>
</script>
<%= start_form_tag(nil, {:id => ''lien_holder'', :name
=> ''lien_holder''}) %>
<%= observe_form(:lien_holder, :frequency => 0.5, :function =>
"revealDetail();") %>
<table border="0">
<tr><td colspan="3" class="l2emphasis">Change
Lien Holder</td><tr>
<%= form_rows_from_collection([
[''*action'', radios_from_collection(:change_lien_holder,
:user_action,
[''add'', ''change'',
''delete''])],
[''*effective date'',
dynarch_date_select(''change_lien_holder'',
''effective_date'')],
]) %>
</table>
<div id="moredetails" style="display:none;">
<table border="0">
<%= form_rows_from_collection([
[''*bank name'', text_field(:change_lien_holder,
:bank_name)],
[''*address'', text_field(:change_lien_holder,
:address1)],
[''address'', text_field(:change_lien_holder,
:address2)],
[''*city'', text_field(:change_lien_holder, :city)],
[''*state'', select_from_hash(:change_lien_holder,
:state,
@state_hash, :sorted => true)],
[''*zip'', text_field(:change_lien_holder, :zip)],
]) %>
</table>
</div>
<%= submit_link ''send changes'' %>
<%= end_form_tag %>
--
View this message in context:
http://www.nabble.com/best-approach-to-add-form-elements-dynamically-tf1877805.html#a5134450
Sent from the RubyOnRails Users forum at Nabble.com.
Steve, That seems to be the solution to hide or show some form elements (fixed) based on some selection. It does not see to add for elements dynamically. Correct me if I am wrong? Steve Ross wrote:> I can''t say whether this is the "best" way, but it''s *my* way. I use > observe_form on a radio button and have it call my own JavaScript > instead of > making an AJAX call. There are a few of my helpers, so don''t worry about > those. Here''s an example of the code: > > <script type="text/javascript"> > //<![CDATA[ > function revealDetail() > { > del = $F(''change_lien_holder_user_action_delete''); > add = $F(''change_lien_holder_user_action_add''); > chg = $F(''change_lien_holder_user_action_change''); > if(!del && (add || chg)){ > Effect.Appear(''moredetails''); > } > else { > Effect.Fade(''moredetails''); > } > return; > } > <% if @change_lien_holder.errors %> > revealDetail(); > <% end %> > //]]> > </script> > >... rest of message deleted> > -- > View this message in context: > http://www.nabble.com/best-approach-to-add-form-elements-dynamically-tf1877805.html#a5134450 > Sent from the RubyOnRails Users forum at Nabble.com.-- Posted via http://www.ruby-forum.com/.
Correct. It presumes you have knowledge of what the possible fields are at
the point where you construct the original form. My presumption is that the
superset of all form fields is bounded by the attributes of my AR model, and
the widgets that may control visibility.
If you really want to add form elements dynamically, RJS is your best bet.
You can simply stick new stuff in divs on your page. E.g.,
# controller_name.rb
def add_a_field
@my_new_field = "Enter gibberish: #{text_field_tag(''whoa! a new
edit
box'')}"
end
# controller_name.rjs
page.insert_html :bottom, ''new_content_div'', @my_new_field
<!-- controller_name.rhtml -->
Whatever you know is going to be there.
<div id="new_content_div><!-- x --></div>
When the add_a_field action is invoked (via link_to_remote, possibly), the
new_content_div gets the new form field at the bottom of its innerHTML.
Give it a try. This kind of thing takes some messing around to get right.
--
View this message in context:
http://www.nabble.com/best-approach-to-add-form-elements-dynamically-tf1877805.html#a5154909
Sent from the RubyOnRails Users forum at Nabble.com.