Select Form Element By Its Name With JQuery

Select Form Element By Its Name In JQuery

Here we consider how to select an element by its name in jquery. We already knows how to select an element using its class and id. Lets start with one example here. Suppose we have a table with three rows and three columns.



First row and first column will be having backgound color red. All others will be having background color yellow. Here, first row and first column td will be having a name redcell as shown above. On Jquery side, we can select an element like td by its name as shown below.

$(' td[name=redcell]' ) -- we get element having exact name redcell
$(' td[name!=redcell]' ) -- we get element having name not equal redcell
$(' td[name^=redcell]' ) -- we get element that start with name redcell
$(' td[name*=redcell]' ) -- we get element that contains the name redcell



Here we wants to add background color as red for the td with name redcell. Others will be having background color as yellow. This can be done as follows.

$(function () {
       $(' td[name=redcell]').css('background-color', 'red');
       $(' td[name!=redcell]').css('background-color', 'yellow');
})



That's all, by applying above style, we can select an element by using its name in jquery. The end result is as shown below.