如何通过html.erb视图中的单选按钮使用if-else函数

Question

我有这样的视图（/app/views/projects/new.html.erb）我应该如何使用if-else函数来执行此操作？

<p>
<%= f.label :payment_type, "payment_type" %>
<%= f.radio_button :payment_type, 1, checked: true %>(1)
<%= f.radio_button :payment_type, 2 %>(2)
</p>
if payment_type == 1
  show these things
else(or payment_type == 2)
  show these things
end

我的控制器保存此视图（/app/controllers/projects_controller.rb）：

def new
  @project = Project.new
end
def create
  @project = Project.new(params.permit![:project])
end

如何使用它属性

Answer 1

Javascript

您需要使用Javascript来提供一些前端交互性。

为了给你一些细节——当你运行Rails应用程序时，系统的*Rails部分将在后端运行——这意味着每次你呈现"视图"时，你的控制器都会从你的模型中提取数据，让Rails为你创建一个纯HTML输出。

问题是，当您呈现此输出时，您无法再次为该调用调用调用Rails功能（查看stateless技术的工作原理——An example of a stateless protocol is HTTP, meaning that each request message can be understood in isolation.），这意味着您需要某种方法来管理接口的前端区域。

这是用Javascript完成的：

[Javascript]最常用于web浏览器实现允许客户端脚本与用户交互，控制浏览器，异步通信，并更改显示的文档内容

--

这就是你将如何处理它：

JSFiddle

1. 将无线电输入"绑定"到"更改"事件
2. 当触发变更事件时，直接在JS中执行业务逻辑
3. 将更改附加到视图（DOM）

---

轨道

以下是您需要做的具体操作：

#app/assets/javascripts/application.js
$(document).on("change", 'input[type="radio"]', function(){
    if($(this).val = "1") { 
        // something here
    }else{
        // something else here
    };
});
#app/views/controller/your_view.html.erb
<%= f.label :payment_type, "payment_type" %>
<%= f.radio_button :payment_type, 1, checked: true %>(1)
<%= f.radio_button :payment_type, 2 %>(2)

--

Ajax

除此之外，如果您想将基于Rails的业务逻辑返回到您的视图，那么您将需要使用ajax。我不会对此做太多详细说明，只是说这基本上会向你的浏览器发送一个"伪请求"。

以下是您的设置方法：

#config/routes.rb
resources :payments do
   get :type, on: :collection #-> domain.com/payments/type
end

这种自定义方法将允许您执行所需的业务逻辑：

#app/controllers/payments_controller.rb
class PaymentsController < ApplicationController
   def type
      type = params[:type]
      if type == "1"
         ...
      else
         ...
      end
   end
end

这将使您能够对以下方法进行ajax调用：

#app/assets/javascripts/application.js
$(document).on("change", 'input[type="radio"]', function(){
        $.ajax({
           url: "payments/type",
           data: { type: $(this).val() },
           success: function(data) {
              alert("Success");
           }
        });
});

Answer 2

<% if payment_type == 1  %>
    these
<% else %>
   those
<% end %>