Script to hide a section if there's no value

Hello,
I have a table that shows discount and amount of rental days (if any).
discount_granted.PNGWhen no discount is granted, and / or no rental days, it shows 0.00 .
no_discount_no_days_to_rent.PNGif all cells are at 0.00 like in the print capoture above, I would like to hide the columns of my table where no discount is granted and / or there's no rental days.
I would need a script that can do that.
here is my html code.
    <TABLE class="FixedSizeTableColumns sized-text">
                      <TBODY>
                        <TR>
                          <TH class="containerSmallExtended">
                            <SPAN class="TitleFirstColumn">Description</SPAN>
                          </TH>
                          <TH class="TotalDiscount TextCenter">Days to Rent</TH>
                          <TH class="TotalDiscount TextCenter">Discount %</TH>
                          <TH class="TextCenter">Qty</TH>
                          <TH class="TextCenter">UOM</TH>
                          <TH class="TextCenter">Unit Price</TH>
                          <TH class="TextCenter">Extended Price</TH>
                        </tr>
                      </TBODY>
                    </TABLE>
                  </TD>
                </TR>{{#childtable.title.rows}}
				<table class="pdfblocktable sized-text">
				<TR>
                  <TD>
                    <SPAN class="TitleField">{{fields.user_def2}}</SPAN>
                  </TD>
                  <!--Title-->
                </TR>
                <TR>
                  <TD class="NoRightPadding">
                    <!--Sub Title Table Start-->
                    <table class="InfoTable sized-text">
                      {{#childtable.subtitle.rows}}
                      <TBODY class="sized-text">
                        <TR>
                          <TD>
                            <SPAN class="SubTitleField">{{fields.user_def3}}</SPAN>
                          </TD>
                        </TR>
                        <TR>
                          <TD class="NoRightPadding">
                            <!--Part Table Start-->
                            <TABLE class="DetailTable FixedSizeTableColumns">
                              {{#childtable.part_usage.rows}}
                              <TBODY class="sized-text">
                                <TR>
                                  <TD class="containerSmallExtended">
                                    <SPAN>{{fields.user_def1}}</SPAN>
                                  </TD>
                                  <TD class="TotalDiscount TextRight"><SCRIPT>FormatDecimal({{fields.user_def_num3}})</SCRIPT></TD>
                                  <TD class="TotalDiscount TextRight"><SCRIPT>FormatDecimal({{fields.price_adj_pct}})</SCRIPT></TD>
                                  <TD class="TextRight"><SCRIPT>FormatDecimal({{fields.user_def_num1}})</SCRIPT></TD>
                                  <TD>{{fields.u_m_out}}</TD>
                                  <TD class="TextRight">
                                    <SCRIPT>FormatDecimal({{fields.bill_price}})</SCRIPT>
                                  </TD>
                                  <TD class="TextRight">
                                    <SCRIPT>FormatDecimal({{fields.ext_price}})</SCRIPT>
                                  </TD>
                                </TR>{{/childtable.part_usage.rows}}
                              </TBODY>
                            </TABLE>

Open in new window

Thank you.
Alain BensimonAsked:
Who is Participating?
 
Alain BensimonConnect With a Mentor Author Commented:
I found another way to make it work.
By the way, I'm a beginner in javascript, so it was too difficult for me to adapt your example to my code.
0
 
ste5anSenior DeveloperCommented:
What have you so far?

Each cell (TD) requires an appropriate class. Then you can control the visibility of them.
0
 
Alain BensimonAuthor Commented:
these are the rows taht I'm working on
<TH class="TotalDiscount TextCenter">Days to Rent</TH>
<TH class="TotalDiscount TextCenter">Discount %</TH>
gives me the tiltes of the columns
and
<TD class="TotalDiscount TextRight"><SCRIPT>FormatDecimal({{fields.user_def_num3}})</SCRIPT></TD>
<TD class="TotalDiscount TextRight"><SCRIPT>FormatDecimal({{fields.price_adj_pct}})</SCRIPT></TD>
gives me the amounts if any.
I've been trying many things to try to hide them, but with no results.
0
Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

 
ste5anSenior DeveloperCommented:
E.g.

<!DOCTYPE html>
<html>
  <head>
    <script>
      function toggleVisibility() {
        var elements = document.getElementsByClassName("column");
        for (i = 0; i < elements.length; i++) {     
          elements[i].style.visibility = 
            (elements[i].style.visibility !== "hidden" ? "hidden" : "visible");
        }
      }
    </script>
  </head>
  <body>
    <table>
      <thead>
        <tr><th>C1</th><th class="column">C2</th><th>C3</th><tr>
      </thead>
      <tbody>
        <tr><td>R1</td><td class="column">R2</td><td>R3</td><tr>
        <tr><td>R4</td><td class="column">R5</td><td>R6</td><tr>
      </tbody>
    </table>
    <button onclick="toggleVisibility();">Click me!</button>
  </body>
</html>

Open in new window

0
 
Alain BensimonAuthor Commented:
I'm not sure that it applies to my code.
i can't have a button.
It needs to hide the elements with that class if there's no value.
0
 
ste5anSenior DeveloperCommented:
You're kídding, aren't you?
0
 
Alain BensimonAuthor Commented:
What do you mean?
0
 
ste5anSenior DeveloperCommented:
I would need a script that can do that.
Got one, embedded in a complete and concise example.

It needs to hide the elements with that class if there's no value.
You need to determine this in your controller.
0
 
Alain BensimonAuthor Commented:
The solution provided was too general and I could not adapt it to my code. The contributor took also a lot of time to answer the questions.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.