jquery hide label and text that called from DB

Question

i have a problem about hiding label and data that shown from database after select . Because in my table , i have a lot column so if i call them all , it will be a lot of null data. To avoid the null data , i want to hide the them when display data.

show.html.erb

<p>
  <b>Category:</b>
  <%= @combine.master.category if @combine.master %>
</p>

<p id="type">
  <b>Type:</b>
  <%= @combine.type %>
</p>

<p id="project">
  <b>Project name:</b>
  <%= @combine.project_name %>
</p>

<p id="unit">
  <b>Unit no:</b>
  <%= @combine.unit_no %>
</p>

<p id="block">
  <b>Block no:</b>
  <%= @combine.block_no %>
</p>

<p>
  <b>Road name:</b>
  <%= @combine.road_name %>
</p>

<p>
  <b>Level:</b>
  <%= @combine.level %>
</p>

<p>
  <b>Facing:</b>
  <%= @combine.facing %>
</p>

<p>
  <b id="tc">Size:</b>
  <%= @combine.size %>
</p>

<p id="value">
  <b>Value:</b>
  <%= @combine.value %>
</p>

<p id="match">
  <b>Match bank:</b>
  <%= @combine.match_bank %>
</p>

<p>
  <b>Asking:</b>
  <%= @combine.asking %>
</p>

JQuery

$(document).ready(function(){
    if ($("#combine_category_id").val() == 1){
        $("#type").hide();
        $("#block").show();
        $("#level").show();
        $("#tc").text('Size');
        $("#value").hide();
        $("#project").show();
        $("#unit").hide();
        $("#match").show();
    }
        else if ($("#combine_category_id").val() == 3){
        $("#type").hide();
        $("#block").hide();
        $("#road").show();
        $("#level").hide();
        $("#facing").show();
        $("#size").show();
        $("#tc").text('Land size');
        $("#value").hide();
        $("#asking").show();
        $("#project").hide();
        $("#unit").show();
        $("#match").show();
    }
        else if ($("#combine_category_id").val() == 2){
        $("#type").show();
        $("#block").show();
        $("#road").show();
        $("#level").show();
        $("#facing").show();
        $("#size").show();
        $("#tc").text('Size');
        $("#value").show();
        $("#asking").show();
        $("#project").hide();
        $("#unit").hide();
        $("#match").hide();
    }
 });

Hope for anyone to help me solve this problem
Thanks alot :)

rorra · Accepted Answer · 2012-12-07 09:39:39Z

1

Do you really need javascript for that?

What about doing something like:

<%- unless @combine.type.blank? %>
  <p>
    <b>Type:</b>
    <%= @combine.type %>
  </p>
<%- end %>

And so on for the rest of the fields? You can also write a iteration to avoid writing repetitive code:

<%- %w(type project unit block road_lavel name facing).each do |col| %>
  <%- unless @combine.send(col).blank? %>
    <p>
      <b><%= col.humanize %>:</b>
      <%= @combine.send(col) %>
    </p>
  <%- end %>
<%- end %>

or put that code within a helper as well

answered Dec 7, 2012 at 9:39

rorra

9,6883 gold badges43 silver badges64 bronze badges

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

Collectives™ on Stack Overflow

jquery hide label and text that called from DB

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related