0

我有一个使用此 railscast 创建的多步骤表单（向导）：http: //railscasts.com/episodes/217-multistep-forms 。

会话用于记住表单中输入的所有信息。在一个表单页面上，我有一个包含 3 个选项的选择框，每个选项在页面上显示不同的表单字段。选项有：“零售和办公室”（零售和办公室字段均显示）、“仅办公室”（仅显示办公室字段）、“仅零售”（仅显示零售字段）。

我使用 jquery 根据在选择框中选择的选项来显示和隐藏这些字段。所以这就是我遇到的问题。例如，假设我从选择框中选择了“仅限零售”。办公区域消失，只显示零售区域。我在字段中输入信息，然后继续下一步。但是，当我点击后退按钮返回此步骤进行编辑时，会显示办公室和零售字段。选择框中的“仅限零售”选项保持不变，我输入的信息仍然存在，但两个字段都显示了。

我假设问题出在 jquery 上，而不是 rails 会话。这与cookie有关吗？我该如何纠正？

应用程序.js

$(document).ready(function() {

$("#spaces").change(function(){
if ($("#spaces").val()=="Retail only") {$("#office_field").hide(); $("#retail_field").show(); }
if ($("#spaces").val()=="Office only") {$("#office_field").show(); $("#retail_field").hide(); }
if ($("#spaces").val()=="Retail and Office") {$("#office_field").show(); $("#retail_field").show(); }

});

uploads_controller.rb

class UploadsController < ApplicationController
  def index
    @uploads = Upload.all
  end

  def show
    @upload = Upload.find(params[:id])
  end

  def new
    session[:upload_params] ||= {}
    @upload = Upload.new(session[:upload_params])
    @upload.current_step = session[:upload_step]
  end

  def create
    session[:upload_params].deep_merge!(params[:upload]) if params[:upload]
    @upload = Upload.new(session[:upload_params])
    @upload.current_step = session[:upload_step]
    if @upload.valid?
        if params[:back_button]
        @upload.previous_step
    elsif @upload.last_step?
        @upload.save if @upload.all_valid?
        else
        @upload.next_step
        end
        session[:upload_step] = @upload.current_step
    end
    if @upload.new_record?
        render "new"
    else
        session[:upload_step] = session[:upload_params] = nil
        flash[:notice] = "Upload saved"
        redirect_to @upload
    end
  end
end
4

1 回答 1

0

在您的 application.js 中，您只有一个“更改”事件侦听器。您需要的是触发您的代码以显示/隐藏特定输入仅绑定到#spaces 的“更改”事件。

if ($("#spaces").val()=="Retail only") {$("#office_field").hide(); $("#retail_field").show(); }
if ($("#spaces").val()=="Office only") {$("#office_field").show(); $("#retail_field").hide(); }
if ($("#spaces").val()=="Retail and Office") {$("#office_field").show(); $("#retail_field").show(); }

基本上，您需要将此代码移动到一个函数中，并在页面加载和#spaces“更改”时调用此函数：

$(document).ready(function() {

  function retail_office_fields() {
    if ($("#spaces").val()=="Retail only") {$("#office_field").hide(); $("#retail_field").show(); }
    if ($("#spaces").val()=="Office only") {$("#office_field").show(); $("#retail_field").hide(); }
    if ($("#spaces").val()=="Retail and Office") {$("#office_field").show(); $("#retail_field").show(); }
  }

  retail_office_fields();

  $("#spaces").change(retail_office_fields);
});

它与会话无关。

于 2012-06-01T16:00:03.313 回答