# How to use update\_page to dynamically add form elements?

**URL:** <https://www.ruby-forum.com/t/how-to-use-update-page-to-dynamically-add-form-elements/123522>\
**Category:** Rails\
**Created:** [December 18, 2007, 12:37pm UTC](https://www.ruby-forum.com/t/how-to-use-update-page-to-dynamically-add-form-elements/123522 "2007-12-18T12:37:26Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![carpeliam](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/e19adc/32.png) [@carpeliam](https://www.ruby-forum.com/u/carpeliam)\
**Post date:** [December 18, 2007, 12:37pm UTC](https://www.ruby-forum.com/t/how-to-use-update-page-to-dynamically-add-form-elements/123522/1 "2007-12-18T12:37:26Z")

</div>

I’ve got a form with some upload boxes, and I’d really like to add more  
boxes when the user clicks on a link, a la Gmail attachments. I was  
thinking I could just use any javascript for this, it’s not hard, but I  
had two thoughts:

1. Rails is gravitating towards less dependency on typing your own  
javascript, for example RJS
2. I’m not just inserting regular textfields, I’m inserting  
text\_field\_with\_auto\_complete, which gets pretty messy if I want to put  
that in a JavaScript function somehow. I want to make this as simple as  
possible.

So here’s what I’ve got at the moment.

\<%= link\_to\_function ‘add another song’,  
update\_page { |page| page.insert\_html :before, ‘album\_submit’,  
“Name:” + text\_field\_with\_auto\_complete(:songs, :name,  
:index =\> 2) +  
" " + file\_field\_tag(‘songs[2][uploaded\_data]’) + ‘  
’  
} %\>

The problem is, I’ve got the number “2” hardcoded in there. I don’t want  
to reference “2” here in the index, I want to reference something that  
will be incremented every time this is called. Now, if I have it  
reference a Ruby value, that doesn’t help me, because this block is  
evaluated when the page is loaded, not when the link is clicked.

Ideas:

1. Reference a JavaScript function somehow. This is kind of naive, as  
both the ID and NAME of the text field will have this index value.
2. Instead of making this inline, make this true AJAX, and a ruby  
variable can be incremented on the remote side. This is overkill,  
though, there’s no reason why I should be executing anything on the  
server side just to add fields to my form.

I’ve been fighting with this something fierce, so any advice would be  
much appreciated.

---

<div class="post-metadata">

**Author:** ![carpeliam](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/e19adc/32.png) [@carpeliam](https://www.ruby-forum.com/u/carpeliam)\
**Post date:** [December 18, 2007, 6:57pm UTC](https://www.ruby-forum.com/t/how-to-use-update-page-to-dynamically-add-form-elements/123522/2 "2007-12-18T18:57:35Z")

</div>

On Dec 18, 4:37 pm, Liam M. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid)  
wrote:

> I’ve got a form with some upload boxes, and I’d really like to add more  
> boxes when the user clicks on a link, a la Gmail attachments.  
> \<%= link\_to\_function ‘add another song’,

“link\_to\_function” is the right way to do this.

> 1. Instead of making this inline, make this true AJAX, and a ruby  
> variable can be incremented on the remote side.

Refer to this excellent screencast which does something similar to  
what you are trying to do.

> **[\#73 Complex Forms Part 1 - RailsCasts](http://railscasts.com/episodes/73-complex-forms-part-1)**
>
> Short Ruby on Rails screencasts containing tips, tricks and tutorials. Great for both novice and experienced web developers.

You are right. Making a round trip to the server using Ajax is  
overkill for adding a form element.

hth  
ponnada