Different jQuery Operations

Introduction

In this article, we will explore multiple ways to hide, show, and disable a control. We will be trying to handle multiple scenarios with their solutions. And, we will also explore new tricks to hide, show, and disable bulk of controls using jQuery.

Scenario 1

I have created a custom HTML table adding multiple different types of controls. Now, let’s say we want to show/hide bulk of control on specific rows.



Solutions

Hide

Format

$("[TrID]").find("input,select,button,textarea").hide();

Ex

$("#Details").find("input,select,button,textarea").hide();

Hiding all the controls in the previous row of the current selected row of the table using the following script.

Format

$("[LastTRID] ").find("input,select,button,textarea").hide();

Ex

$("#LastRow"). prevAll().find("input,select,button,textarea").hide();

O/P



Show

Showing all the controls of the hidden row using the following script.

Format

$("[TrID]").find("input,select,button,textarea").show();

Ex

$("#Details").find("input,select,button,textarea").show();

Showing all the controls in the previous row of the current selected row of the table using the following script.

Format

$("[LastTRID] ").find("input,select,button,textarea").show();

Ex

$("#LastTr"). prevAll().find("input,select,button,textarea").show();

O/P



Scenario 2

I have created a custom HTML Table adding multiple different types of controls. Now, let’s say we want to Enable/Disable the bulk of control on specific rows.

Solutions

The prevAll() method searches through the predecessors of these elements in the DOM tree and constructs a new jQuery object from the matching elements; the elements are returned in order of beginning with the closest sibling.