表格不会与AJAX一起提交

时间:2016-03-05 23:42:07

标签: javascript ruby-on-rails ajax

应用程序/资产/ Javascript角/ profiles.js

这是我的表单的javascript。 jQuery hide / show正在运行,但AJAX请求不是..

$(document).on('page:load ready', function() {
  $('#pair-search').hide();
  $('#date-search').hide();
  $('input[type="radio"]').click(function() {
    if ($(this).attr("value") == "pair") {
        $("#pair-search").show();
        $("#date-search").hide();
    }
    else {
        $("#date-search").show();
          $("#pair-search").hide();
    }
  $('#search-form').on('submit', function(e) {
    e.preventDefault();
  $.ajax({
    url: $(this).attr('action'),
    type: $(this).attr('method'),
    dataType:'script',
    data: $(this).serialize(),
    success: function(data) {
      if (data) {
    $('#profiles').html(data);
  }
}
  });
});
  });
});

这是我的个人资料(#index)页面上的表单...它呈现两个部分。我将发布部分用于“配对搜索”,以便您可以了解表单如何协同工作。

应用程序/资产/视图/简档/ index.html.erb

用户搜索

<div id = "first_option">
  <%= form_tag users_path, method: :get, id: 'search-form' do %>
  <label>Who are you looking for?</label><br>
  <input type="radio" id=pairchoice name="choice" value="pair"> Paired <br>
  <input type="radio" id=datechoice name="choice" value="date"> Date <br>
  <% end %>
</div>

<div class = "choices">
  <div id = "pair-search">
    <%= render 'pair_search' %>
  </div>

  <div id = "date-search">
    <%= render 'date_search' %>
  </div>
</div>

<div id = "profiles">
</div>

配对搜索部分:

应用程序/资产/视图/简档/ _pair_search

<%= form_tag(profiles_path, method: :get, :id =>'search-form') do %>
  <%= label(:language, 'What are your preferred languages?') %><br>
    <%= check_box_tag('search[language]', 'Ruby') %>
    <%= label_tag('search[language]', 'Ruby') %>
    <%= check_box_tag('search[language]', 'JavaScript') %>
    <%= label_tag('search[language]','JavaScript') %>
    <%= check_box_tag('search[language]', 'Python') %>
    <%= label_tag('search[language]', 'Python') %>
    <%= check_box_tag('search[language]', 'Java') %>
    <%= label_tag('search[language]','Java') %>
    <%= check_box_tag('search[language]', 'PHP') %>
    <%= label_tag('search[language]','PHP') %>
    <%= check_box_tag('search[language]', 'C++') %>
    <%= label_tag('search[language]','C++') %><br>

  <%=label_tag(:operating_system,"What is your Operating System of choice?") %><br>
    <%= check_box_tag('search[operating_system]', 'Unix') %>
    <%= label_tag('search[operating_system]','Unix') %>
    <%= check_box_tag('search[operating_system]', 'Linux') %>
    <%= label_tag('search[operating_system]','Linux') %><br>

  <%= label_tag(:age, 'What age-range are you looking for?')%><br>
    <%= check_box_tag('search[age]', '20-25') %>
    <%= label_tag('search[age]','20-25') %>
    <%= check_box_tag('search[age]', '25-30') %>
    <%= label_tag('search[age]', '25-30') %>
    <%= check_box_tag('search[age]', '30-35') %>
    <%= label_tag('search[age]', '30-35') %>
    <%= check_box_tag('search[age]', '40-45') %>
    <%= label_tag('search[age]','40-45') %><br>
    <%= check_box_tag('search[age]', '50+') %>
    <%= label_tag('search[age]','50+') %>

  <%= label_tag(:gender, "Gender:") %>
    <%= check_box_tag('search[male]') %>
    <%= label_tag('search[male]', 'Male' )%>
    <%= check_box_tag('search[female]')%>
    <%= label_tag('search[female]', 'Female')%>
    <%= check_box_tag('search[other]') %>
    <%= label_tag('search[other]', 'Other')%>


  <%= label_tag(:location, "Where do you want the person you're searching for to live?") %>
    <%= text_field_tag ('search[location]') %>

  <%= submit_tag("Search", :id => "search") %>
<% end %>

0 个答案:

没有答案