Text box and check box dependency in haml

Question

I have a form in htaml.haml (ruby on rails) that consists of a list of check boxes and two text boxes. These two text boxes are dependent on two check boxes. If a check box is clicked , corresponding text box should be editable, otherwise it should be non-editable. My form Looks like this

%script(src ="/app/assets/a.js")
%h1 Registration
%h2 User Information
.row
  .col-md-6.col-md-offset-3
     = form_for(@user) do |f|
       = f.label :cisco_email,'Cisco Email'
       = f.email_field :cisco_email
       = f.label :name, 'Current group'
       = f.text_field :current_group
       = f.label :name, 'Current work location,city'
       = f.text_field :work_city     
%h2 Area of Interests: check at least one box that apply, can select maximum of 2
.row
 .col-md-6.col-md-offset-3
   = form_for(@user) do |f|
     = f.check_box :conflict_resolution
     = f.label :conflict_resolution, 'Conflict Resolution'
     = f.check_box :customer_know_how
     = f.label :customer_know_how, 'Customer Know How'
     = f.check_box :exec_acheive_results
     = f.label :exec_acheive_results, 'Executive to achieve results'
     = f.check_box :personal_branding
     = f.label :personal_branding, 'Personal Branding'
     = f.check_box :leading_change 
     = f.label :leading_change, 'Leading Change'
     = f.check_box :align_and_influence    
     = f.label :align_and_influence, 'Align and Influence'
     = f.check_box :managing_without_authority
     = f.label :managing_without_authority, 'Managing Without Authority'
     = f.check_box :win_win_negotiation
     = f.label :win_win_negotiation, 'Win-Win Negotiation'
     = f.check_box :career_exploration
     = f.label :career_exploration, 'Career Exploration'
     = f.check_box :effective_communication
     = f.label :effective_communication, 'Effective Communication'
     = f.check_box :think_out_box
     = f.label :think_out_box, 'Creative Thinking/Think Out Of the box'
     = f.check_box :tech_know
     = f.label :tech_know, 'Technical Know-How, List Areas'
     = f.text_field :other
     = f.label :other, 'Any Other'
     = f.check_box :other_areas
     = f.text_field :tech_areas
     = f.submit "Register Me", class: "btn btn-primary"

I'm doing this in JavaScript file

$(document).on('click', '#user_tech_know', function (event) {
if (this.checked) {
$('#user_other').show();
} else {
$('#user_other').hide();
}
});

I am new to all this. Can someone help me please?

Answer 1

This should work:

$(document).on('click', '#tech_know', function (event) {
  if (this.checked) {
    $('#other').show();
  } else {
    $('#other').hide();
  }
});

Caveat

Use Firebug or view source to see the actual IDs of the fields in question and adjust code to match them. So, for instance, if ID of what you want to show/hide is 'foo', replace '#other' above with '#foo' (# is jQuery for "this is an ID").