Reputation: 9
I am wondering if there is a way to hide an HTML table upon page load of a website. I am converting a page that was written in ASP a few years ago, and was wondering if I could match the site, but re-write it in .NET. Maybe it could be a JavaScript fix, but I was hoping there could be a work-around in C#. Here is the code that I am re-writing from ASP:
<%If zipCode = "" Then %>
<font color="blue">Enter a Zip Code:</font>
<%Else%>
<table border="1" cellspacing="1" ...
<tr>
<td width="200"<b>Email</b>
<td with="200" ...
for the C# side that I was writing, I put under the page load method:
protected void Page_Load(object sender, EventArgs e)
{
zipCode.Focus();
zipCode.Text = "";
}
my thought process was I was trying to match the
If zipCode = "" Then
line on the C# side, but it still shows the HTML table on page load. I am thinking maybe it would be more of a JavaScript fix rather than a C# fix. But is there a way to do it through C# instead? Or would this be easier in JavaScript?
Upvotes: 0
Views: 7420
Reputation: 712
may be you should do something like this and see if this works for you. put the table html in a variable like this
String tableEl = "<table border=\"1\" cellspacing=\"1\" style=\"display:block\"...";
Than in your first condition where you want to change the visibility to hidden,
<%If zipCode = "" Then %>
<font color="blue">Enter a Zip Code:</font>
tableEl = "<table border=\"1\" cellspacing=\"1\" style=\"display:none\"...";
<%Else%>
// and print it as is in the block where you want to show it, you can play around with many things in style etc to get this behavior
<%=tableEl %>
<tr>
<td width="200"<b>Email</b>
<td with="200" ...
Just have to try different options and do not isolate yourself with just one approach and you will see you can get your answer
Upvotes: 0
Reputation: 1909
You can do it using javascript
//this means document.ready
$(function(){
$("#loader").css("display","none");
$("#showit").click(function(e){
$("#loader").css("display","inline-block");
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table id="loader">
<tr>
<td>dsada</td>
<td>dsad</td>
<td>dsada</td>
</tr>
</table>
<button id="showit">Show table</button>
Upvotes: 1
Reputation: 3192
yes,if you prefer pure html page as UI rather than .aspx then you have to use javascript or jQuery even css
document.getElementById("yourtableid").style.visibility = "hidden";
Upvotes: 0
Reputation: 11342
$('table').hide();
$(document).ready(function() {
$('table').hide();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div>im not table</div>
<table>
<th>what head 11</th>
<td>1111</td>
<td>222</td>
</table>
<div>im not table 22</div>
Upvotes: 0