Logo 
Search:

Asp.net Forum

 Ask Question   UnAnswered
Home » Forum » Asp.net       RSS Feeds

Puzzling behavior

  Asked By: Ibthaj    Date: Sep 16    Category: Asp.net    Views: 724
  

I found some code on the net which is used to preload
images for ImageButtons which are contained in a User
Control. I'm trying to adapt this code to use in my aspx.cs
files:


private void Page_PreRender(object sender, System.EventArgs e)
{

// Put user code to initialize the page here
System.Web.UI.WebControls.Image DirectionMap = new
System.Web.UI.WebControls.Image();
System.Web.UI.WebControls.Image DirectionStore = new
System.Web.UI.WebControls.Image();
DirectionMap.ImageUrl = "WebImages/MainSite/Map.jpg";
DirectionStore.ImageUrl = "WebImages/MainSite/Mandrake_Bldg_2.jpg";
this.Controls.Add(DirectionMap);
this.Controls.Add(DirectionStore);

if (!Page.IsStartupScriptRegistered(this.ID + "preloadImages"))
{
string sURL;
System.Web.UI.WebControls.Image im = null;
StringBuilder sbFront = new StringBuilder();
StringBuilder sbBack = new StringBuilder();

int iCount = 0;

foreach (Control c in this.Controls)
{
if (c is System.Web.UI.WebControls.Image)
{
im = (System.Web.UI.WebControls.Image)c;
sURL = im.ImageUrl;
sbBack.Append(@"preloadImages[" +
iCount.ToString() +
"] = new Image();");

sbBack.Append(@"preloadImages[" +
iCount.ToString() +
"].src = '" +
sURL +
"'; \n");

iCount++;
}
}

if (iCount > 0)
{
sbBack.Append(@"</script>");
string sCount = iCount.ToString();
sbFront.Append(@"<script language=""JavaScript"">");
sbFront.Append(@"var preloadImages = new Array(" +
sCount +
"); \n");

Page.RegisterStartupScript(this.ID +
"preloadImages", sbFront.ToString() +
sbBack.ToString());
}
}
else
{
Response.Write(this.ID + ".Page_PreRender: Already registered " + this.ID +
"_preload_images");
}

}

I run this code and it preloads my images just great.
However, the images don't appear in the image controls.
They appear in newly created and mysterious image
tags at the bottom of the page, outside the bottom
HTML tag. Very interesting! It seems that that the
image that is used in interating over the control
collection persists and holds the preloaded image.
Huh?

Share: 

 

12 Answers Found

 
Answer #1    Answered By: Nixie Schmidt     Answered On: Sep 16

Are you sure you haven't added the controls image  twice, an instance of them in
the aspx  designer, and then again in your code  ?

 
Answer #2    Answered By: Isabelle Brown     Answered On: Sep 16

That's not the problem. If I paste this code  into a fresh WebForm
and run it, I get this odd behavior  of the image  tags outside the
HTML tag. If I first insert the image into a PlaceHolder, the image
appears in the form. However, I can't then access it in my foreach
loop.

 
Answer #3    Answered By: Nagaraju Iyaner     Answered On: Sep 16

Let me have a look, gimme an hour.

 
Answer #4    Answered By: Tyrone Sanchez     Answered On: Sep 16

I pasted the code  into a prj and added a handler for pre render and
this is what it spat out ... there's only 2 images ... tell me what swrong and
i'll try to fix.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<html>
<head>
<title>WebForm2</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio 7.0">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema
content="http://schemas.microsoft.com/intellisense/ie5">
</head>
<body MS_POSITIONING="GridLayout">

<form name="WebForm2" method="post" action="WebForm2.aspx" id="WebForm2">
<input type="hidden" name="__VIEWSTATE"
value="dDwtMTI3OTMzNDM4NDs7Pnam+TKSkWYSVXamqPnG4ru/S5np" />


<script language="JavaScript">var preloadImages = new Array(2);
preloadImages[0] = new Image();preloadImages[0].src =
'WebImages/MainSite/Map.jpg';
preloadImages[1] = new Image();preloadImages[1].src =
'WebImages/MainSite/Mandrake_Bldg_2.jpg';
</script>

</form>

</body>
</html>
<img src="/WebApplication124/WebImages/MainSite/Map.jpg" border="0" /><img
src="/WebApplication124/WebImages/MainSite/Mandrake_Bldg_2.jpg" border="0" />

 
Answer #5    Answered By: Jonathan Brown     Answered On: Sep 16


<form>
<script language="JavaScript">var preloadImages = new Array(2);
preloadImages[0] = new Image();preloadImages[0].src =
'WebImages/MainSite/Map.jpg';
preloadImages[1] = new Image();preloadImages[1].src =
'WebImages/MainSite/Mandrake_Bldg_2.jpg';
</script>

</form>

</body>
</html>
<img src="/WebApplication124/WebImages/MainSite/Map.jpg" border="0" /><img
src="/WebApplication124/WebImages/MainSite/Mandrake_Bldg_2.jpg" border="0" />

Thats fine ...

if you want the preloaded images to appear in the image  tags then you need to
javascript to tell it to.

Say the images were different ( here they are the same)

Just say you had

<script language="JavaScript">var preloadImages = new Array(2);
preloadImages[0] = new Image();preloadImages[0].src =
'WebImages/MainSite/Mappp2.jpg';
preloadImages[1] = new Image();preloadImages[1].src =
'WebImages/MainSite/Mandrake2.jpg';
</script>

then you wold need to give the img tags an id
<img src="/WebApplication124/WebImages/MainSite/Map.jpg" border="0" id="img1"/>
<img src="/WebApplication124/WebImages/MainSite/Mandrake_Bldg_2.jpg" border="0"
id="img2"/>

and then, to swap them over, javascript something like

function swapimages(){
document.images.img1.src = preloadImages[0].src;
document.images.img2.src = preloadImages[1].src;
}

 
Answer #6    Answered By: Husani Chalthoum     Answered On: Sep 16

Oh I se your point ... th images are outside the html ... okies I'll have
another look.

 
Answer #7    Answered By: Jared Adams     Answered On: Sep 16

This simple example is just a test. I want to figure out
how I can preload images on pages where I am dynamically
generating a lot of images, like on the Display page  of
Mandrake's. All I'm trying to do is preload them to make
my pages more snappy. It seems to access the images
I have to manually add them to the page. However, when
I do this they exhibit this odd behavior  where they end
up outside my HTML.

Any attempt to first load them into a container control
and then access them also seems to fail. Very strange.

 
Answer #8    Answered By: Tarrant Thompson     Answered On: Sep 16

I don't think ts weird behaviour Mark.

It seems when you add controls  programmatically they are added after the stuff
in the designer is rendered.

I made a project earlier - have look - it does the same thing

http://www.developer.com/webapplication123.zip

The designer and in-mem code  are 2 different things - the designer is rendered
first when mixing them.
And ascx controls get rendered before their equivalent in-mem (see the above
project ... it's got most of it in there)
I don't thik it is designed to have them mixed, but it has that added
functionality.

I suppose the idea is that if you were to add controls programmatically then you
would get rid of all the html in the designer and add your own controls to
render a <html> and <head> and <body> tags yourself.

I'm quite happy getting rid of the html in designer and don't expect VS to be
perfect in every way, I don't even lik eth edesigner anymore - but luuuurrvvvvv
doing it all in code.

 
Answer #9    Answered By: Janelle Evans     Answered On: Sep 16

Ok I see your point about attching them to placeholders(or labels) .. then they
show up where they're supposed to show up.

I'll have another look and see if I can't catch up with you.

And theres a problem with the looping and finding ... I'l have a look at that
too.

 
Answer #10    Answered By: Lela Lynch     Answered On: Sep 16



ArrayList ar = new ArrayList();

ar.Add(Label1);

ar.Add(Label2);

Label1.Controls.Add(DirectionMap);

Label2.Controls.Add(DirectionStore);



foreach (Control c in ar)

{

System.Web.UI.WebControls.Image d =
(System.Web.UI.WebControls.Image)c.Controls[0];

Response.Write(d.ImageUrl.ToString());

}

 
Answer #11    Answered By: Mark R     Answered On: Sep 16

You are a very smart man!
Looking forward to studying this further.

 
Answer #12    Answered By: Jaime Bowman     Answered On: Sep 16

Just incase this thread ends up at some dev site then the answer better be added
eh ?

We've been iterating through the page  controls, when we add a control to a page
in designer it i added to the FORM control

So we need to iterate through that (in code  below this refers to the page)


foreach (System.Web.UI.Control c in this.Controls)
{
foreach (System.Web.UI.Control c2 in c.Controls)
{
Response.Write(c2.UniqueID + " " + c2.GetType().ToString() + "<br>");
}
}

 
Didn't find what you were looking for? Find more on Puzzling behavior Or get search suggestion and latest updates.




Tagged: