JQuery hide and show function in RoR

Question

i'm doing a form that require JQuery , when the combobox selected 1 value , the label and textbox will show or hide depends on the situation. When i try in googlechrome with debug , it runs properly . But when i try in my localhost , it doesn't work.

This is my JQuery

<script type="text/javascript">
   $(document).ready(function(){
        $("#combine_category_id").change(function(){
        if ($(this).val() == 1){
        $("#type").hide();
        $("#block").show();
        $("#road").show();
        $("#level").show();
        $("#facing").show();
        $("#size").show();
        $("#value").hide();
        $("#asking").show();
        $("#project").show();
        $("#unit").hide();
        $("#match").show();
    }
        else if ($(this).val() == 2){
        $("#type").hide();
        $("#block").hide();
        $("#road").show();
        $("#level").hide();
        $("#facing").show();
        $("#size").show();
        $("#value").hide();
        $("#asking").show();
        $("#project").hide();
        $("#unit").show();
        $("#match").show();
    }
        else if ($(this).val() == 3){
        $("#type").show();
        $("#block").show();
        $("#road").show();
        $("#level").show();
        $("#facing").show();
        $("#size").show();
        $("#value").show();
        $("#asking").show();
        $("#project").hide();
        $("#unit").hide();
        $("#match").hide();
    }
   });
    });
  </script>

This is _form.html.rb in Ruby on Rails

<div class="field" id="combine_category_id">
    <%= f.label :category_id %><br />
   <%= f.collection_select(:category_id ,  @get_master, :id , :category) %>
   </div>

   <div class="field" id="type">
    <%= f.label :type %><br />
    <%= f.number_field :type %>
    </div>

   <div class="field" id="project">
    <%= f.label :project_name %><br />
    <%= f.text_field :project_name %>
    </div>

    <div class="field" id="no">
    <%= f.label :unit_no %><br />
    <%= f.number_field :unit_no %>
    </div>

   <div class="field" id="block">
    <%= f.label :block_no %><br />
    <%= f.text_field :block_no %>
    </div>

   <div class="field" id="road">
    <%= f.label :road_name %><br />
    <%= f.text_field :road_name %>
    </div>

   <div class="field" id="level">
    <%= f.label :level %><br />
    <%= f.number_field :level %>
    </div>

   <div class="field" id="facing">
    <%= f.label :facing %><br />
    <%= f.text_field :facing %>
    </div>

   <div class="field" id="size">
    <%= f.label :size %><br />
    <%= f.number_field :size %>
    </div>

   <div class="field" id="value">
    <%= f.label :value %><br />
    <%= f.number_field :value %>
    </div>

   <div class="field" id="match">
    <%= f.label :match_bank %><br />
    <%= f.number_field :match_bank %>
    </div>

   <div class="field" id="asking">
    <%= f.label :asking %><br />
    <%= f.number_field :asking %>
    </div>

  <div class="actions">
    <%= f.submit %>
  </div>

is there any solution to solve this ?
Thanks alot for helping me .

Kevin · Accepted Answer · 2012-12-07 03:03:07Z

1

You are selecting the div, not the input.

$("#combine_category_id select").change(...

edited Dec 7, 2012 at 3:03

answered Dec 7, 2012 at 1:46

Kevin

5835 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Anonymous Over a year ago

i don't know much about jquery. In that case , what should i change ?

Kevin Over a year ago

All you need to change is the portion I've posted above. Add input to your jQuery selector ($("#combine_category_id") in this case.

Anonymous Over a year ago

Doesn't work either with $("#combine_category_id input").change(function(){ and should i changed this <div class="field" id="combine_category_id"> ?

Kevin Over a year ago

Sorry, forgot you were working on a select field. Change input to select and you should be good to go.

Collectives™ on Stack Overflow

JQuery hide and show function in RoR

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related