0

I have a static page and static controller. In the page am using Jquery UI Accordion in a four category. Each category has separate controller, model and view. I am trying to render all the category into the accordion and work like it does separately. I got a problem with that, So, I tried to create a form in the static page and do like the following. But all the forms opened in the first tab. I want to open and save the form separately as per the tabs. Any idea would be more appreciated. Thanks

<div class="funding_form">
  <%= form_for(@funding_source, :remote => true) do |f| %>
    <fieldset>
      <legend>Funding Source</legend>
      <div class="control-group">
        <%= f.label :Source_name, 'Funding Source Name' %>
        <%= f.text_field :Source_name %>
      </div>
      <div class="action">
        <%= f.submit 'Save Source name', :class => 'funding_save', remote: true %> | <%= link_to 'Cancel', "#",  {:remote => true, :class => 'funding_cancel_button' } %>
      </div>
    </fieldset>
  <% end %>
</div>

<div class="packages_form">
  <%= form_for(@package, :remote => true) do |f| %>
    <fieldset>
      <legend>Packages</legend>
      <div class="control-group">
        <%= f.label :Package_name, 'Package Name' %>
        <%= f.text_field :Package_name %>
      </div>
      <div class="action">
        <%= f.submit 'Save Packages', :class => 'package_save', remote: true %> | <%= link_to 'Cancel', "#",  {:remote => true, :class => 'package_cancel_button' } %>
      </div>
    </fieldset>
  <% end %>
</div>

1 Answer 1

2

Why don't you put an ajax request on the click action of the tab, to call an action in the controller. I.e. have a method in your @package controller which when called, will render the partial packages form. You can then call this with an ajax request :)

For example, in your controller you may want to render the partial "form" you can have a controller method like such:

def return_data
 @package = Package.find(params[:id])

 render partial "form"
end

and you could call it using an ajax request such as:

 $.ajax({
  url: '/your_path/return_data',
  dataType: 'html',
  success: function(data){
    console.log(data)
  },
  error: function(data){
    console.log(data)
  });

you could then display it, perhaps assign the partial to a div and overwrite it every time you make an ajax request so one only ever displays :)

Sign up to request clarification or add additional context in comments.

2 Comments

Thanks. I did in some other way. Thanks for your help.
@Learner Can you post answer?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.