2013-01-01 22 views
0

我想讓AJAX在我的Rails應用程序中的窗體上工作,並且大約有75%的方式。我有一個表格,一個人可以創建一個活動並使用技能標記該活動。我希望爲他們提供在表格中創建新技能的能力。我可以用表單替換「創建新技能」鏈接,然後保存記錄沒有任何問題。我的問題是在記錄保存後,rails會將我重定向到我的主頁,而不是返回到帶有表單的頁面。如果用戶通過典型的HTML表單創建技能,則重定向是正常行爲。Create.js.erb不顯示在Rails的AJAX中

我的頁面上的鏈接以創建一個新的技能,變成了一種形式:

<%= link_to "Create A New Skill", new_skill_path, :id => "new-skill-link", remote: true %> 

新的技術形式,取代了鏈接:

<%= form_for Skill.new, :remote => true do |f| %> 
    <%= f.text_field :description %> 
    <%= f.submit "Save", :class => 'btn-large btn-primary' %> 
<% end %> 

我的技能控制器(新和創建方法):

def new 
    @skill = Skill.new 
    @tags = current_user.tags 

    respond_to do |format| 
    format.html 
    format.js 
    end 
end 

def create 
    @skill = current_user.skills.new(params[:skill]) 
    params[:skill][:tag_ids] ||= [] 

    respond_to do |format| 
    if @skill.save 
     flash[:success] = "Skill was successfully created!" 
     format.html { redirect_to home_page_url } 
     format.js { render action: "create" } 
    else 
     flash.now[:error] = "There was an error saving your skill." 
     format.html { render action: "new" } 
     format.js { render action: "new" } 
    end 
    end 
end 

我new.js.erb:

$("#new-skill-link").hide().after('<%= j render("skills/remote_form") %>'); 

我create.js.erb:

$("#new-skill").remove(); 
$("#new-skill-link").show(); 
$(".skill-list ul").append('<%= j render(@skill) %>'); 

看來,Rails是這樣解釋它與HTML頁面響應請求的HTML。我嘗試在技能表單中添加:format => :js,但rails只是在我的瀏覽器中呈現javascript而未解釋它。

當我查看Web服務器上的日誌時,看不到任何錯誤。我得到:

Started POST "/skills" for 127.0.0.1 at 2012-12-31 20:02:16 -0700 
Processing by SkillsController#create as HTML 
    Parameters: {"utf8"=>"✓", "authenticity_token"=>"xxxxx", "skill"=>{"description"=>"Example Skill"}, "commit"=>"Save"} 
    User Load (62.8ms) SELECT "users".* FROM "users" WHERE "users"."remember_token" = 'xxxxx' LIMIT 1 
    (0.1ms) begin transaction 
    SQL (15.4ms) INSERT INTO "skills" ("created_at", "description", "updated_at", "user_id") VALUES (?, ?, ?, ?) [["created_at", Tue, 01 Jan 2013 03:02:16 UTC +00:00], ["description", "Example Skill"], ["updated_at", Tue, 01 Jan 2013 03:02:16 UTC +00:00], ["user_id", 1]] 
    (1.4ms) commit transaction 
Redirected to http://localhost:3000/home_page 
Completed 302 Found in 96ms (ActiveRecord: 79.7ms) 

有什麼想法?

回答

1

的原因是,你不應該做的創建方法,怎麼那麼AJAX請求是一種失去了在中間內部重定向

(你可以通過螢火/ FF看到這一點)下面是一個示例代碼

例如:假設我有一個名爲項目

projects_controller.rb 

class ProjectsController < ApplicationController 
    @project = Project.new(params[:project]) 
    if @project.save 
     flash.now[:success] = ["#{@project.name} sucessfully created"] 
    else 
     flash.now[:errors] = @project.errors.full_messages 
    end 
end 
鑑於

支架/項目

_form.html.erb 

<div id="message"></div> 
<%= form_for @project :remote => true, :html => { :class => 'form-horizontal' } do |f| %> 
    <%= f.text_field :name, :class => 'span3', :placeholder => "Project name" %> 
    <%= f.submit nil, :class => 'btn btn-success' %> 
<% end %> 

create.js.erb 

$("#message").html("<%= escape_javascript raw(flash_display) %>"); 

in helper 

module ApplicationHelper 
    def flash_display 
    response = "<div class='alert #{alert_class}'>" 
    response += "<button type='button' class='close' data-dismiss='alert'>x</button>" 
    flash.each do |name, msg| 
     msg.each do |m| 
     response = response + content_tag(:p, m) 
     end 
    end 
    response += "</div>" 
    flash.discard 
    response 
    end 

    private 
    def alert_class 
    css_class = case flash.first[0] 
     when :errors then "alert-error" 
     when :success then "alert-success" 
     when :notifications then "alert-block" 
    end 
    css_class 
    end 
end 

所以,你可以看到,我沒有從我的創建方法重定向,保存後我只是傳遞狀態消息。因此,您的信息頁不會刷新,只會更新信息

HTH