1. ホーム
  2. jquery

rails 3でajaxでフォームを送信する(jQuery使用)

2023-09-08 10:33:16

質問

私はrailsとjQueryの初心者です。私は1つのページに2つの別々のフォームを持っていて、私はそれらをajax方法で別々に送信したいと思っています(jQueryで)。これは私が得た方法です。誰かがそれを動作させるためにこのコードを追加または修正することができます。私はRails 3.1とjQuery 1.6を使用しています。事前にありがとうございます。

アプリケーション.js

$(".savebutton").click(function() { 
    $('form').submit(function() {
         $(this).serialize();
    });
}); 

第一フォーム

<%=form_for :users do |f| %>
  <fieldset>
    <legend>Basic details</legend>
    <%= f.label :school %>
    <%= f.text_field :school,:size=>"45",:class=>"round",:id=>"school" %><br/>      
  </fieldset>
  <p><%= button_to "save and continue",{:class=>"savebutton"} %></p>
<%end%>

第二形態

<%=form_for :courses do |c| %>
  <fieldset>
    <legend>Your current classes</legend>
    <label>class:</label><%= c.text_field :subject,:size=>"45",:class=>"round" %><br/>
  </fieldset>
  <p><%= button_to "save and continue",{:class=>"savebutton"} %></p>
<%end%>

SchoolController

class SchoolController < ApplicationController
  respond_to :json
  def create
    @school = current_user.posts.build(params[:school].merge(:user => current_user))
    if @school.save
      respond_with @school
    else
      respond_with @school.errors, :status => :unprocessable_entity
    end
  end
end

CourseControllerはSchoolControllerと同じ形で

どのように解決するのか?

あなたはしたい。

  1. submitの通常の動作を停止します。
  2. サーバーにajaxで送信する。
  3. 返信をもらい、それに応じて変更する。

下のコードがそうしてくれるはずです。

$('form').submit(function() {  
    var valuesToSubmit = $(this).serialize();
    $.ajax({
        type: "POST",
        url: $(this).attr('action'), //sumbits it to the given url of the form
        data: valuesToSubmit,
        dataType: "JSON" // you want a difference between normal and ajax-calls, and json is standard
    }).success(function(json){
        console.log("success", json);
    });
    return false; // prevents normal behaviour
});