help getting started with javascript generated forms

How does one generate a form within a view using javascript?

Specifically, assume views/premise/new.html.erb looks like this:

<%= form_for(Premise.new) do |f| %>
  <%= f.hidden_field :full_address, :value => $FULL_ADDRESS %>
  <%= f.hidden_field :geocoding, :value => $GEOCODING %>
  <%= f.submit :value => "use this address" %>
  <%= f.label :formatted_address, $FULL_ADDRESS %>
<% end %>

... but with the twist that this form must be generated on the client
side by javascript. (In this case, $GEOCODING and $FORMATTED_ADDRESS
are placeholders for values generated by the Google geocoding service,
which requires client-side javascript.)

One approach would be to look at the HTML generated by the above .erb
code and write javascript functions that emit HTML directly. But this
approach reeks -- there must be a better way!

Assuming there is a better way, where do I look for documentation and
examples?

How does one generate a form within a view using javascript?

Specifically, assume views/premise/new.html.erb looks like this:

<%= form_for(Premise.new) do |f| %>
<%= f.hidden_field :full_address, :value => $FULL_ADDRESS %>
<%= f.hidden_field :geocoding, :value => $GEOCODING %>
<%= f.submit :value => "use this address" %>
<%= f.label :formatted_address, $FULL_ADDRESS %>
<% end %>

... but with the twist that this form must be generated on the client
side by javascript. (In this case, $GEOCODING and $FORMATTED_ADDRESS
are placeholders for values generated by the Google geocoding service,
which requires client-side javascript.)

One approach would be to look at the HTML generated by the above .erb
code and write javascript functions that emit HTML directly. But this
approach reeks -- there must be a better way!

Another would be to have the form created server side (ie normally),
but fill in the form values client side once they become known (and if
you care you can have the form hidden initially and show it only once
the geocoding data is available)

Fred

Frederick Cheung wrote in post #960432:

Another [approach] would be to have the form created server side (ie normally),
but fill in the form values client side once they become known (and if
you care you can have the form hidden initially and show it only once
the geocoding data is available)

Fred

When I first read this, I slapped my head and said "doh! -- it's
javascript, so of course it can modify the form generated by the
server".

But then I realized that it won't exactly work in my case. I
oversimplified the original problem statement: the javascript can
generate an arbitrary number of these forms, and I don't know how many
that will be beforehand.

I s'pose I could let the server generate a single form, as Fred
suggests, and use that as a template for the javascript code to
replicate/modify as needed. This approach is still a little bizarre but
might be easier to maintain.

Right now, I'm doing it the stupid way (described in the OP) and it's
working.

- ff

Fearless Fool wrote in post #960459:

Frederick Cheung wrote in post #960432:

Another [approach] would be to have the form created server side (ie normally),
but fill in the form values client side once they become known (and if
you care you can have the form hidden initially and show it only once
the geocoding data is available)

Fred

When I first read this, I slapped my head and said "doh! -- it's
javascript, so of course it can modify the form generated by the
server".

But then I realized that it won't exactly work in my case. I
oversimplified the original problem statement: the javascript can
generate an arbitrary number of these forms, and I don't know how many
that will be beforehand.

In that case, you may want to use the Ajax approach. Instead of having
the JS generate the form itself, have it request a rendered partial from
the server. That way you can still use ERb (or better yet, Haml) rather
than building the form in JavaScript, but the rendered forms don't all
have to go into the DOM in advance.

Best,