Grab the RSS feed

Hide a Table Column Using Jquery

Today I need a coding for hide table column in a table. Here I am going to present for our blog users.

The coding shows below…


HTML coding..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
< html xmlns="http://www.w3.org/1999/xhtml">
< head>
< meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
< title>Untitled Document</title>
< script type="text/javascript" src="jquery/jquery.js"></script>
< script type="text/javascript" src="jquery/hidetable.js"></script>

</head>

< body>
< table>
< tr>
< td>
< input type="radio" id="radiobtn" name="radiobtn" value="1"/ > Show Table column<br/>
< input type="radio" id="radiobtn" name="radiobtn" value="2"/ > Show Table column<br/>
< input type="radio" id="radiobtn" name="radiobtn" value="3"/ > Hide Table Column<br/>
</td>
< td id="hidecolumn">
< input type="checkbox" name="checkme" id="checkme"/> Check me
< input type="text" name="entertext" id="entertext"/> I am Text box
</td>
< tr>
</table>
</body>
</html>


Before going to run the code please note I include the jquery.js. This is the file you can get from http://jquery.com/ .before the jquery/jquery.js here jqurey is the folder name you can write as username/jquery.js or else what you wish..

Then in next I include another javascript file named jqueryvalid.js.Here you need to write the jqueryvalid.js in the jquery folder.

jqueryvalid.js ……

$(document).ready(function(){
$("input:radio[name='radiobtn']").click(function() {
var isDisabled = $(this).is(":checked") && $(this).val() == "3";
if(isDisabled==true)
{
$("#hidecolumn").hide();

}
else
{
$("#hidecolumn").show();

}
});

});

Use this and leave the comment.

0 comments:

  •  
    Real Time Web Analytics