0

我正在开发一个 Rails 应用程序。在 index.html.haml 上，我还渲染了 _form.html.haml（用于新操作和编辑操作。）索引页面上有一个“添加组”链接，单击该链接应禁用表单中的某些字段。我已经为它编写了 jquery 代码。我的问题是，当我单击链接时，这些字段被禁用（灰显）但立即又重新启用。如果我刷新页面，我会看到禁用的字段。我希望它在我单击链接然后保持禁用状态时发生。

jQuery 代码

$(function(){
    $("#add_requirement_group").click(function() {
        $("#requirement_text_full, #requirement_requirement_type").prop("disabled", true);
    });
});

用于新建和编辑操作的表单。

= form_for ([@requirement.requirements_template, @requirement]), html: { class: "form-horizontal" } do |f|
  - if @requirement.errors.any?
    #error_explanation
      %h2= "#{pluralize(@requirement.errors.count, "error")} prohibited this requirement from being saved:"
      %ul
        - @requirement.errors.full_messages.each do |msg|
          %li= msg   %fieldset
    .control-group
      = f.hidden_field :parent_id
    .control-group
      = f.label :text_brief, class: "control-label"
      .controls
        = f.text_field(:text_brief, class: "input-block-level")
    .control-group
      = f.label :text_full, class: "control-label"
      .controls
        = f.text_area(:text_full, rows: 5, class: "input-block-level")
    .control-group
      = f.label :obligation, class: "control-label"
    .control-group
      = f.label :requirement_type, class: "control-label"
      .controls
        = f.select :requirement_type, options_for_select([:text, :numeric, :date, :enum]), include_blank: true
      .actions.pull-right
    %br/
    = f.submit 'Save', class: 'btn btn-info'
    = button_to 'Finish', '#', class: 'btn btn-info', method: :get

index.html.haml

%hr
.row-fluid
  .span4
    %fieldset.template_outline
      %strong Template Outline
      %br
      = link_to 'Add Group', new_requirements_template_requirement_path(@requirements_template), id: "add_requirement_group"
      %hr
       = render 'form'

我知道这是一段如此简单的代码，但由于某种原因，禁用没有按预期工作。

4

1 回答 1

0

好的。单击“添加组”链接时，单击事件处理程序将触发，这将禁用 HTML 控件，如您所料。但是，它将继续并重定向到“new_requirements_tempate_reqquirement_path”，我认为您不希望它这样做。为了抑制 DOM 元素的默认操作，您可能需要使用“preventDefault().

$(function(){
    $("#add_requirement_group").click(function(e) {
        e.preventDefault();
        $("#requirement_text_full, #requirement_requirement_type").prop("disabled", true);
    });
});

您所描述的行为告诉我您正在使用 Turbo-Links，它是 Rails 4 的标准配置。

于 2013-10-07T20:31:54.247 回答