Jquery show and hide controls

I know to show and hide control. I do the following

$(document).ready(function () { if (x ==1) { $("#div1").show(); //or $("#div1").css("display", "block"); } else { $("#div1").hide(); //or $("#div1").css("display", "none"); } }); 

Regardless the approach, it works. Will it hide the control completely. What I mean is if I use IE f12 tool or Chrome/firefox inspector, will I still see it.

Actually, it still shows like this

<div> </div 

Can I hide that completely, so people will not change from display:none to display:block

The other way is doing it in server side.

However, I am trying to show/hide file upload control. If the user selects a particular value in drop down box, the fileupload will be shown and hidden. That can only be done using updatepanel. fileupload does not work with updatepanel. It took me a while to figure out. Then I use the jquery. That works fine. Then I found that I did not hide controls during the rendering

Any suggestions Thanks

1 Answer

Please use .detach() instead of .remove() if you might want to re-insert the DOM later. .detach() would keep all jQuery data associated ,such as event attached, with the removed elements while .remove() cannot.