Question

我只是在学习Rails，并感谢任何帮助。我在:remote => true上查看了form_for的大约10个教程，它们似乎都互相复制（同样令人困惑）。

本教程就是其中之一：http://tech.thereq.com/post/18910961502/rails-3-using-form-remote-true-with-jquery-ujs

我的网络应用程序几乎全部在一个页面上，我的“提交表单”位于弹出式灯箱内。这意味着form_for代码实际上在我的index.html.erb中。它还意味着为index创建了一个新的@playlist实例变量（而不是将其放在new中）

我的最终目标是：

if @playlist.save返回true，我想将用户重定向到root_path并注意：通知。无需使用成功消息或类似内容更新表单。我希望在保存成功时进行硬重定向。

if @playlist.save返回false，我想在create.js.erb中呈现代码，这会将错误附加到灯箱形式而不刷新页面。注意许多教程似乎都希望将整个表单重新呈现为html，然后替换内容。我宁愿（如果可以的话），只是将错误发送到表单并插入它们，我认为重新渲染和替换整个表单似乎比它必须更复杂。

截至目前，我的代码有点混乱，尤其是：

respond_to块。这是关于实际发生的事情的最大混淆点，我尝试了很多不同的代码而且没有任何作用
我不知道create.js.erb是否正确
我没有create.html.erb - 我认为这是正确的，因为我只想重定向

我表单的第一行：

<%= form_for @playlist, :remote => true do |f| %>

我的整个播放列表控制器

class PlaylistsController < ApplicationController

  before_filter :load_genres, :only =>[:index, :user]
  before_filter :new_playlist, :only => [:index, :new, :create]

  def index
    @playlists = Playlist.order('created_at DESC').page(params[:page]).per(30)
  end

  def new
  end

  def create
    respond_to do |format|
      if @playlist.save
        # ???
        format.html { redirect_to root_path, :notice => "Playlist submitted" }
      else
        # ???
        format.js { render :js => @playlist.errors, :status => :unprocessable_entity }
      end
    end
  end

  def user
    @playlists = Playlist.order('created_at DESC').where(:username => params[:username]).page(params[:page]).per(30)
  end

  def listen
    playlist = Playlist.find(params[:playlist_id])
    playlist.update_attribute(:listens, playlist.listens + 1)
    render :nothing => true
  end

  private

  def load_genres
    @genres = Genre.order(:name)
  end

  def new_playlist
    @playlist = Playlist.new(:title => params[:title], :url => params[:url], :description => params[:description])
  end

end

create.js.erb

jQuery(function($) {
    alert('createjs called');
    $('#submit-form form').on('ajax:error', function(event, xhr, status, error){

        var responseObject = $.parseJSON(xhr.responseText), 
            errors = $('<ul />');

        $.each(responseObject, function(index, value){
            errors.append('<li>' + value + '</li>');
        })

        $(this).find('.submit-playlist-errors').html(errors);
    });
});

Answer 1

如果我理解正确，您有一个表单，如果表单已保存，您希望使用flash通知重定向。如果表单无效，则需要显示错误。

您可以将表单（或任何请求）以不同的格式（通常是html，json和js）发送到rails应用程序。这在您提供的网址中指定。

playlist_path(@playlist)
# => /playlists/1

playlist_path(@playlist, :format => "json")
# => /playlists/1.json

playlist_path(@playlist, :format => "html")
# => /playlists/1.html
# ... etc

格式告诉我们respond_to块中指定的响应类型。

现在，如果清楚，您必须决定使用哪种格式。

如果您指定js格式，则响应将被视为已执行的script。如果表单有效，您可以发送用户javascript，将其重定向到您想要的页面。如果表单无效，您可以修改HTML，以便显示错误消息。无需客户端代码。

respond_to do |format|
  if valid
    format.js { render "valid" }
  else
    format.js { render "invalid", :status => :unprocessable_entity }
  end
end

# valid.js.erb
window.location = <%= your_path %>

# invalid.js.erb
// whatever to display errors

当您使用json时，如果表单无效，您可以返回重定向网址以重定向用户或错误。请注意，此解决方案需要客户端上的Javascript来处理它。

# controller
respond_to do |format|
  if valid
    format.json { render :json => your_path }
  else
    format.json { render :json => @object.errors, :status => :unprocessable_entity }
  end
end

# client side javascript
$("form")
  .on("ajax:success", function(event, data, status, response) {
    window.location = data
  })
  .on("ajax:error", function(event, response, error) {
    // logic to handle errors
  })

您还可以使用html格式（通过将格式设置为html或根本不指定格式）。但是，如果您使用:remote => true，则必须以与json相同的方式对待它（具有客户端javascript）。如果您使用redirect_to作为回复，则会重定向请求，而不是您的用户。

我不确定在用户重定向后显示Flash消息，但您可以这样尝试：

respond_to do |format|
  if valid
    format.html { 
      flash[:notice] = "Playlist submitted"
      render :json => your_path }
  else
    format.html { render :json => @object.errors, :status => :unprocessable_entity }
  end
end

# client side javascript
//...

希望这会干掉你的respond_to块。

：remote =＆gt;与form_for真正的混淆

1 个答案: