根据输入值确认框

Question

我是 javascript 的新手，所以不要强行判断（任何建议或意见将不胜感激）。

我的 rails 应用程序（haml 文件）中有一个表单：

= simple_form_for(@book, remote: true) do |f|
  .row
  .form-group
    = f.input :book_title, as: :string, label: "Title of a book"
    %br
    = f.input :pages_number, as: :string, label: "Number of pages"
    %br
  .form-actions
    = f.button :submit, "Create", class: "btn btn-success"
    = link_to t('buttons.cancel'), '#', onclick: "$.modal.close()", class: 'btn btn-warning pull-right'

打开表单的控制器中的动作：

  def new
    @book = Book.new
  end

controller中保存表格的动作：

  def create
  end

我想做的是检查输入的页数是否大于 10。我想创建一个确认框。

我试图在 create 操作中保存 @pages_number = params[:pages_number]，并在视图中使用 data: (@pages_number < 10 ? { confirm: "Are you sure?" } : nil)，但没有成功。

在这种情况下我需要使用 Javascript 吗？

Answer 1

对于Rails表单，在定义输入数值字段时，我们可以设置该字段可接受的数值范围。

:min - 可接受的最小值。 :max - 最大可接受值。

以上属性可用于rails中的数值输入字段，控制取值范围

相当于

<input id="quantity" name="quantity" max="9" type="number" />

Answer 2

永远记住Ruby = Server； Javascript = Client

如果您根据 服务器 设置的条件进行评估，您的代码将有效。

但是，由于您是针对动态创建的条件进行评估，因此您需要使用 javascript 来确定该值是否值得调用确认对话框：

#app/assets/javascripts/application.js
$(document).on("ajax:beforeSend", "#form", function(event, xhr, settings) {
   var $el    = $(this);
   var $pages = $el.find("input[name='page_numbers']");
   if ($pages.val() > 10) {
      var response = confirm($el.data('confirm') || 'Are you sure?'); // not sure if this will pull the rails confirm
      if (!response) { return; }
   }
});

以上内容虽然需要调整，但应该评估输入到 page_numbers 框中的值。如果用户不确认，它将return，从而阻止进度。

当您使用 ajax 时，您可以使用 ajax:beforeSend 挂钩在请求发送到 ajax 驱动程序之前插入。如果您没有使用 remote: true，您需要查看绑定到 form.on("submit" 方法。

更新

经过长时间的聊天讨论，我们最终解决了以下问题：

#app/assets/javascripts/application.js
function validateForm() { 
var x = $('.value').val(); 
  if (x < 10) { 
    var res = confirm("Are you sure?"); 
    if (res == false) { return false; } 
  } 
}

#app/views/books/new.html.erb
<%= form_for @book, onclick: "return validateForm();", remote: true do |f| %>

我们还使用了this reference。

根据输入值确认框

Confirm box depending on input value

javascript

ruby-on-rails

haml

simple-form

:min - 可接受的最小值。 :max - 最大可接受值。