S
S
sergeytroinin2014-07-14 16:10:52
Angular
sergeytroinin, 2014-07-14 16:10:52

How to work with complex forms Rails + AngularJS?

Hello. There is a project on Rails4 + Mongoid + AngularJS. One of the components of the project is a complex form that is used to add content. The form is dynamic, implemented on the client using AngularJS. The second dynamic form is used for content search. The problem is that now this form is a few disparate partials, in which the necessary fields are hardcoded. Now, to add another characteristic to an object, you need to add the corresponding field to both forms. Is it possible to somehow simplify the process of storing and updating the form.
I considered the following options:
1. Store all the data about the data structure in a separate mongo collection and each time build a table on the client based on this data. In the administrative part, add functionality to update data about the form structure. But the structure is quite confusing in places, and constantly building the form on page load can slow down the site.
2. Somehow update the rail templates themselves, then load problems are solved, but I'm not even sure that it is possible to edit the templates directly from the rail application.
If anyone has any ideas on how to simplify the work with this form, I will be very grateful.
UPD. I will give an approximate structure of the form.

<%= form_for @realty, url: {action: 'create'} do |f| %>

   <div id="static">

     <%= f.radio_button :action, 'sell', :'ng-model' => 'action' %>
     <%= f.radio_button :action, 'rent', :'ng-model' => 'action' %>

     <%= f.radio_button :object, 'flat', :'ng-model' => 'object' %>
     <%= f.radio_button :object, 'house', :'ng-model' => 'object' %>

   </div>

  <div id="dinamic">
      <%= f.fields_for :options do |f| %>

      <div id="sell-flat" ng-if="action='sell' && object='flat'">
          <%= render 'sell_flat_attributes', :f => f %>
      </div>

      <div id="rent-flat" ng-if="action='rent' && object='flat'">
          <%= render 'rent_flat_attributes', :f => f %>
      </div>

      <div id="sell-house" ng-if="action='sell' && object='house'">
          <%= render 'sell_house_attributes', :f => f %>
      </div>

      <div id="rent-house" ng-if="action='rent' && object='house'">
          <%= render 'rent_house_attributes', :f => f %>
      </div>

      <% end %>

  </div>

<% end %>

For each combination of some attributes from the first block of the table, there is a corresponding set of fields from the second block. Each such set is placed in a separate partial. The question actually is whether it is possible to somehow organize it so as not to rule by hand with every change. I will clarify. The attributes in the options hash of each object are mostly dynamic. They are entered as is and no schema is defined for them in the model. That is, using a model in mongoid for this will not work.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question