Hide Div is ASP textbox = 0 or IsNull

janehollin · 12-02-2012, 10:37 AM

Hi

I'm not sure if this could be better done with VB, amending the CSS or something.

But I "think" (hope) it could be done OnPageLoad with some JS, so here goes.

Say I have a page (ASPX) with a form.
On the form is a number of divs
In each div there are a number of textboxes.
I would like to set the div to Display None if a text box on the div is either 0 or Null.
The text box will always be named the same (except for the number).
eg. MyTextBox1, MyTextBox2, MyTextBox3, etc.

Something like this
In this case only MyDiv2 would be visible - as MyDiv1 = Null and MyDiv3 = 0

Code:

<!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 content="en-gb" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>MyPage</title>
</head>

<body>

<div id="formholder">
	<form action="" method="post">
		<div id="MyDiv1">
			<asp:TextBox id="MyTextBox1" runat="server"></asp:TextBox>
		</div>
		<div id="MyDiv2">
			<asp:TextBox id="MyTextBox2" runat="server">there's something here</asp:TextBox>		
			</div>
		<div id="MyDiv3">
			<asp:TextBox id="MyTextBox3" runat="server">0</asp:TextBox>		
			</div>
	</form>
</div>

</body>

</html>

Old Pedant · 12-03-2012, 06:20 AM

Your so-called "TextBoxes" will actually be either an <input type="text"> HTML element or a <textarea></textarea> element.

You should learn to look at the HTML that ASP.NET produces, so that you can work with the HTML and *NOT* with ASP.NET's private (and somewhat distorted) view of your page. If you didn't know, this is trivial to do: Just click on the browser's VIEW menu and then on the SOURCE (or PAGE SOURCE, depending on which browser) menu item. Voila. You will be looking at the HTML as the browser sees it.

Note that HTML form elements, including <input> and <textarea> *NEVER* have null values. They can't. Their values are *ALWAYS* strings. And they *can* have a blank string ("") but they can't be NULL.

*************

NOW... My question to you: Why don't you use ASP.NET code to change the style of the <div>s to display: none; when the "TextBox" they contain has a blank or zero value? That would seem to me to be enormously simpler than doing it via JavaScript code.

SURELY you KNOW the value you are going to assign to a TextBox contained in a <div> before you actually have to produce the <div> via ASP.NET code?

*********

If you really must do it in JavaScript, then you need to be able to tell us a *GUARANTEED WAY* that we can find the <div>s and <input>s (or <textarea>s) that you want to work in this way. The easiest and most general way is to use CSS classes. For example:

Code:

<div>
     ... any other content for the div ...
    <asp:TextBox cssClass="magic" id="whatever" runat="server" value="some value" />
     ... still more other content for the div ...
</div>

If all your text boxes have that same cssClass (name of your choice), then it's easy.

*** BUT IGNORE ALL THIS! GO READ YOUR FIRST THREAD THAT THIS IS A DUPLICATE OF! ***