- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to hide table rows containing zero value with jQuery?
Let’s say the following is our table with product quantity records −
<table class="hideRowContainingZeroValue"> <tr> <td> qty: <input type="text" name="row1" value="100"> </td> </tr> <tr> <td> qty: <input type="text" name="row2" value="0"> </td> </tr> <tr> <td> qty: <input type="text" name="row3" value="234"> </td> </tr> <tr> <td> qty: <input type="text" name="row4" value="0"> </td> </tr> </table>
Let us now hide using the hide() method. Following is the code −
Example
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initialscale=1.0"> <title>Document</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> </head> <body> <table class="hideRowContainingZeroValue"> <tr> <td> qty: <input type="text" name="row1" value="100"> </td> </tr> <tr> <td> qty: <input type="text" name="row2" value="0"> </td> </tr> <tr> <td> qty: <input type="text" name="row3" value="234"> </td> </tr> <tr> <td> qty: <input type="text" name="row4" value="0"> </td> </tr> </table> <script> $('.hideRowContainingZeroValue input').filter(function(){ return +this.value === 0; }).closest("tr").hide() </script> </body> </html>
To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.
Output
This will produce the following output −
- Related Articles
- How to count number of rows in a table with jQuery?
- jQuery hide() with Examples
- MySQL query to order rows with value greater than zero?
- MySQL: delete all rows containing string “foo” in sample table “bar”?
- How animate(), hide and show elements using jQuery?
- Count rows having three or more rows with a certain value in a MySQL table
- How to layout table cells, rows, and columns with JavaScript?
- How to replace rows in a MySQL table with conditions?
- How to hide scrollbars with CSS?
- How to remove rows containing missing value based on a particular column in an R data frame?
- How to count number of columns in a table with jQuery
- How add unique key to existing table (with non-unique rows)?
- How to select elements with an attribute value containing a specified word with CSS?
- How to hide HTML element with JavaScript?
- How to deal with warning “removed n rows containing missing values” while using ggplot2 in R?

Advertisements