Trying to hide an img control upon command

D

Doogie

Hi I have an img control I am trying to hide upon certain types of
commands in my code behind. When to hide it is directly tied to a
asp:dropdownlist control. So depending on what the user selects in
that dropdownlist, this image will be hidden or be displayed.

I have tied the onselectedindexchanged value of the dropdownlist to a
c-sharp method (not javascript) because other things are being done as
well that I want to do server side. However, the img control is not
server side, I can't grab it on the c-sharp method.

So I tried to right something like this to do that

string myScript = "<script type='text/javascript'> if (imgTo != null)
{ imgTo.width = 0; }</script>";
ClientScript.RegisterClientScriptBlock(this.GetType(), "ABC",
myScript);

However, it keeps saying imgTo is undefined. Even if I modify my
script above to read if (imgTo != 'undefined') it still gives me the
same error. But it's not undefined, below is my HTML for it.

<img alt="To Calendar" id="imgTo" src="../Images/calendar.gif"
style="width:0" onclick="CallCalendar('ctl00$MasterContentPlaceHolder
$txtTo')"/>

Is there something else I could be missing?

I have tried to use a server side image control instead of the client
side one, but once I do that, for some reason, it keeps losing the
data in my CallCalendar method (see above) that is called in the
onclick method for imgTo because it is posting back. That
CallCalendar method popups up a calendar and assigns the value
selected to a text box on the form. I have tried to put a break point
in my page load method to see why I lose the value in the text box,
but by the time it gets to page load the value in the text box is
already gone (although I can see it show up on the screen). So I'm
thinking the client side image is my best way, if I can just figure
out how to get it to realize imgTo is really thee.
 
M

Madhur

I don't think you can refer the specified element directly using string id.

You will need to obtain DOM element by using
var obj =getdocumentelementbyid('imtTo')

and then perform the operations on it.

Hope this helps.
 
D

Doogie

I don't think you can refer the specified element directly using string id..

You will need to obtain DOM element by using
var obj =getdocumentelementbyid('imtTo')

and then perform the operations on it.

Hope this helps.

--
Madhur













- Show quoted text -

I tried doing it this way (both with the way you had the case on
getdocumentelementbyid and the way I have it below). Neither one
worked. I get an "object expected error" now:

var a = getDocumentElementByID('imgTo');
if (a != null)
{
a.width = 0;
}
 
M

Madhur

Can you paste the full code ?

--
MAdhur

I don't think you can refer the specified element directly using string
id.

You will need to obtain DOM element by using
var obj =getdocumentelementbyid('imtTo')

and then perform the operations on it.

Hope this helps.

--
Madhur













- Show quoted text -

I tried doing it this way (both with the way you had the case on
getdocumentelementbyid and the way I have it below). Neither one
worked. I get an "object expected error" now:

var a = getDocumentElementByID('imgTo');
if (a != null)
{
a.width = 0;
}
 
D

Doogie

Can you paste the full code ?

--
MAdhur








I tried doing it this way (both with the way you had the case on
getdocumentelementbyid and the way I have it below).  Neither one
worked.  I get an "object expected error" now:

var a = getDocumentElementByID('imgTo');
if (a != null)
{
    a.width = 0;



}- Hide quoted text -

- Show quoted text -- Hide quoted text -

- Show quoted text -

I actually got it to work. A friend suggested adding runat="server"
to the <img> tag and that works great. However, now something else is
weird...if I have my tag set up like this:

<img alt="From Calendar" runat="server" id="imgFrom" src="../Images/
calendar.gif" style="width:15"
onclick="CallCalendar('ctl00$MasterContentPlaceHolder$txtFrom')"/>

and I run this line of code in the code-behind:

imgFrom.Width = 15 --to make it visible.

or

imgFrom.Width = 0 ---to hide it.

This works great. But when the width is set to 0, I can still see a
very small dot on the screen. Not a big deal but worth trying to
improve. So I switched my code to this to make it invisible

imgFrom.Width = -1 ---to hide it.

Now the image never hides. The exact same thing occurs when I do this
to my tag (setting initial image width value to -1):

<img alt="From Calendar" runat="server" id="imgFrom" src="../Images/
calendar.gif" style="width:-1"
onclick="CallCalendar('ctl00$MasterContentPlaceHolder$txtFrom')"/>

if I run the code imgFrom.Width = -1 it still doesn't hide.

Any ideas?
 
D

David

use...

imgFrom.Visible = false


--
Best regards,
Dave Colliver.
http://www.AshfieldFOCUS.com
~~
http://www.FOCUSPortals.com - Local franchises available




I actually got it to work. A friend suggested adding runat="server"
to the <img> tag and that works great. However, now something else is
weird...if I have my tag set up like this:

<img alt="From Calendar" runat="server" id="imgFrom" src="../Images/
calendar.gif" style="width:15"
onclick="CallCalendar('ctl00$MasterContentPlaceHolder$txtFrom')"/>

and I run this line of code in the code-behind:

imgFrom.Width = 15 --to make it visible.

or

imgFrom.Width = 0 ---to hide it.

This works great. But when the width is set to 0, I can still see a
very small dot on the screen. Not a big deal but worth trying to
improve. So I switched my code to this to make it invisible

imgFrom.Width = -1 ---to hide it.

Now the image never hides. The exact same thing occurs when I do this
to my tag (setting initial image width value to -1):

<img alt="From Calendar" runat="server" id="imgFrom" src="../Images/
calendar.gif" style="width:-1"
onclick="CallCalendar('ctl00$MasterContentPlaceHolder$txtFrom')"/>

if I run the code imgFrom.Width = -1 it still doesn't hide.

Any ideas?
 
D

Doogie

use...

imgFrom.Visible = false

--
Best regards,
Dave Colliver.http://www.AshfieldFOCUS.com
~~http://www.FOCUSPortals.com- Local franchises available

I actually got it to work.  A friend suggested adding runat="server"
to the <img> tag and that works great.  However, now something else is
weird...if I have my tag set up like this:

<img alt="From Calendar" runat="server" id="imgFrom" src="../Images/
calendar.gif" style="width:15"
onclick="CallCalendar('ctl00$MasterContentPlaceHolder$txtFrom')"/>

and I run this line of code in the code-behind:

imgFrom.Width = 15  --to make it visible.

or

imgFrom.Width = 0 ---to hide it.

This works great.  But when the width is set to 0, I can still see a
very small dot on the screen.  Not a big deal but worth trying to
improve.  So I switched my code to this to make it invisible

imgFrom.Width = -1 ---to hide it.

Now the image never hides.  The exact same thing occurs when I do this
to my tag (setting initial image width value to -1):

<img alt="From Calendar" runat="server" id="imgFrom" src="../Images/
calendar.gif" style="width:-1"
onclick="CallCalendar('ctl00$MasterContentPlaceHolder$txtFrom')"/>

if I run the code imgFrom.Width = -1 it still doesn't hide.

Any ideas?

Ok, I apologize for my silliness. I swear yesterday when I was trying
to use this img tag and get it accessible from the server, Visible
wasn't a property there. Now it is. Boy oh boy.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top