I can't hide this table

Question

1.00/5 (1 vote)

See more:

i have a code for table show and hide,but i want to hide it because it is as an answer for student

What I have tried:

<!DOCTYPE html>
<head>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script>
   $(document).ready(function() {
    //To hide the table
     $(".hidetable").click(function () {
     $(".table_bg").hide("fast")
   });
    //To show the table
     $(".showtable").click(function () {
     $(".table_bg").show(2000);
   });    
   //To hide ODD rows
     $(".hideoddrows").click(function () {
     $(".table_bg  tr:odd").hide("slow")
   });
    //To show ODD rows
     $(".showoddrows").click(function () {
     $(".table_bg  tr:odd").show(1000)
   });  
   
});
</script>



<style>
.table_bg {
  width:40%;
  font-family:verdana;
  font-size:15px;  
  color:#fff;
  padding: 10px;
  text-align:center;
}
.table_bg th{
    background: #0780BA;

    color: #fff;
    line-height:35px;
  }
.table_bg td{
    background: #99DBFB;    
    padding:10px;

    color: #000;
  }  
</style>
</head>

<body>
  
<h1>jQuery hide/show demo</h1>
<button class="hidetable">Hide Table</button>
<button class="showtable">Show Table</button>

</p>
<table class="table_bg">
    <tr>
  
     <th>Age</th>
     <th>Salary</th>
    </tr>
    <tr>
     <td>1</td>
     <td>Jim</td>
     
    </tr>
    <tr>
     <td>2</td>
     <td>Anna</td>
    
    </tr>
    <tr>
     
    </tr>        
</table>

</body>
</html>

Posted 5-Jul-18 5:29am

Member 13898220

Updated 6-Jul-18 2:18am

Add a Solution

Comments

[no name] 5-Jul-18 11:51am

I put your code in a jsfiddle (http://jsfiddle.net/617qLwbg/) and it seems to work fine? What is the problem?

ZurdoDev 5-Jul-18 16:31pm

What does happen?

j snooze 5-Jul-18 17:16pm

If Thaddeus says your code seems to work fine, and you don't agree, try clearing your temp internet files. I've banged my head on many desks wondering why my javascript changes didn't take, only to realize that the page had been cached.

2 solutions

Solution 2

thank you for your efforts
it was good advice

Posted 6-Jul-18 2:18am

Member 13898220

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Mohibur Rashid · Accepted Answer · 2018-07-05T15:56:00

Solution 1

My guess is you asked the wrong question
I guess, you want to start the page with hidden table

Two solutions I will suggest.
1 add style in the table

<TABLE style="display:none">

2. Add another statement in $(document).ready()

JavaScript

$(document).ready(function() {
 $(".table_bg").hide();
...
}

Posted 5-Jul-18 15:56pm

Mohibur Rashid

Comments

Member 13898220 6-Jul-18 9:17am

okey,but when i add another table in the same page it point to the first table
i want every table with it's code
could i rename every table by id?

Mohibur Rashid 7-Jul-18 20:29pm

give every table a separate id.

I can't hide this table

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0

I can't hide this table

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0

Existing Members

...or Join us