Separate Submit Buttons For Forms Displayed With Jquery UI Tabs - ruby-on-rails-3

Question

Building a Rails 3.1 app Ruby 1.9 with Devise for user authentication.
Since i'm using Devise to authenticate users I used jquery UI tabs display in the users/edit view. I have one tab to display form for user profile settings and and another for user security settings.
Problem is when i click submit to update either profile or security information it attempts to submit the forms for both. I have the submit buttons set up for each tab separately. How can i set this up so that i can submit the forms on each tab individually?
My users/edit.html.erb file
div id="tabs">
<ul id="user-config-tabs">
<li>Profile Settings</li>
<li>Security Settings</li>
</ul>
<div id="profile-tab"> <!-- Start security settings tab info-->
<%= render 'profilesettings'%>
</div>
<div id="security-tab"> <!-- Start Profile settings tab info-->
<%= render 'securitysettings'%>
</div>
</div>
Profile settings PArtial
<h3 style = "text-align: left">Profile Settings</h3>
<div class="row">
<p id="privacy"><%=link_to "privacy policy", privacy_path%></p>
<div class="span6 offset3">
<%= form_for(resource, :as => resource_name, :url => registration_path(resource_name), :html => { :method => :put }) do |f| %>
<fieldset>
<legend>General Information</legend>
<div><%= f.label "First Name" %>
<%= f.text_field :name, :autofocus => true %>
<%= f.label "Last Name" %>
<%= f.text_field :last_name, :autofocus => true %>
<%= f.label "Age" %>
<%= f.text_field :age, :autofocus => true%>
<%= f.label "Gender" %>
<%= f.select :gender, User::GENDER_TYPES, prompt: 'Select'%>
</div>
</fieldset>
<div><%= f.submit "Update", class: "btn btn-large btn-primary" %></div>
<% end %>
</div>
</div>

Answer 1

Can't you just let the whole form submit but then only use the information that you want to ?
If you dont want the page to submit then I would use ajax to submit the form and serialize only what you need. For example:
$.ajax({
url: "/post_path",
type: 'POST',
cache: false,
async: false,
data: $("#security_form").serialize(),
success: function(data){
if(data.valid == "true"){
$('#notice').html("Updated succesfully").slideDown();
}else{
$('#errors').html(data.errors).slideDown();
}
}
});
Then you can handle this in the controller.