How To Hide an HTML object in JSP?

Question

i want know if there is a way to hide html objects in jsp..for e.g., i have a homepage with login and register button in my jsp app.I want to hide them after successful login.

here is the of screenshot of my homepage
http://imgur.com/a8SydL6

Possible duplicate of [How to hide elements without having them take space on the page?](http://stackoverflow.com/questions/2928688/how-to-hide-elements-without-having-them-take-space-on-the-page) — Mick Mnemonic, May 19 '16 at 20:01

score 3 · Accepted Answer · answered May 19 '16 at 20:24

There are many of ways you can implement that.Couple of them would be

If you are reloading the whole page when user has successfully logged in, you can use JSTL to selectively render components.

ie, something like below.

  <c:if test="if_user_has_not_logged_in">
       <!-- HTML code for login and register button goes here-->
  </c:if>

you can hide html components using simple Javascript as well By setting Style-> display as none. something like below

  //You invoke this code when user is logged in
  if('successfully_logged_in') {
   document.getElementById("divIdGoesHere").style.display = "none";
 }

score 0 · Answer 2 · edited May 19 '16 at 21:34

0

If you want to hide html object you can select object with id or class for example, and use .hide();

For example:

$("#some-id").hide();
$(".some-id").hide();

edited May 19 '16 at 21:34

Emiswelt

3,800
1
33
55

answered May 19 '16 at 20:16

pandaBear

25
4

score 0 · Answer 3 · answered Oct 14 '18 at 08:20

Assume that you have two elements a checkbox ( with id and class nmed c_box ), and a text item ( with id and class named txt1 ).

Then the following JQuery code may be used to show/hide txt1 whenever unchecked / checked :

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('.c_box').click(function(){                
        if (document.getElementById('c_box').checked) {    
          $('.txt1').hide();          
        }
        else
        { 
          $('.txt1').show();                  
        }
    });
});
</script>
</head>
<body>

<input type="checkbox" id ="c_box" class="c_box"></input>
    
<input type="text" id ="txt1" class="txt1" value="M y  t e x t"></input>

</body>
</html>

How To Hide an HTML object in JSP?

3 Answers3