2013-10-07 7 views
0

Я работаю над приложением Rails. В index.html.haml я также создаю _form.html.haml (для новых действий и действий редактирования.) На индексной странице есть ссылка «Добавить группу», которая при нажатии должна отключать определенные поля в форме. Я написал код jquery для него. Моя проблема заключается в том, что когда я нажимаю ссылку, поля отключены (выделены серым цветом), но сразу снова включаются. Если я обновляю страницу, я вижу отключенные поля. Я хочу, чтобы это произошло, когда я нажимаю ссылку, а затем остаюсь отключенной.jquery disable not working

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' 

Я знаю, что такой простой кусок кода, но по какой-то причине отключения не работает, как ожидалось.

ответ

0

OK. Когда щелкнута ссылка «Добавить группу», загорится обработчик события клика, который, как вы ожидаете, отключит элементы управления 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.

+0

Привет, это сработало! Большое спасибо. Однако быстрый вопрос. Что вы имеете в виду, когда говорите «Чтобы подавить действие DOM по умолчанию» в этом случае? – bhvd

+0

Не обращайте внимания на то, что вы имели в виду. Еще раз спасибо. – bhvd

+0

Без проблем. Буду признателен, если вы отметите мой ответ. Спасибо. :) –