Solved

How to show div before loding its content?

Posted on 2008-10-22
7
247 Views
Last Modified: 2012-05-05
Hi, please look first at the code below to understand my case. I want to make the dvEditor visible before loading txtContent with data. the problem that I'm facing is that this div does not show until the txtContent completely loded with data so if the data is huge the dvEditor take too much time to appear, what I'm looking for is to show the div first then set txtContent with the data.
Any ideas?
<asp:UpdatePanel ID="updpnlEditor" runat="server" UpdateMode="Conditional">

             <ContentTemplate>

                <div id="dvEditor" runat="server" visible="false" style="border:2px solid #fff; position:absolute; top:100px; right:400px; padding-left:70px; width:800px;Height:300px">

                                  

	            <table  bgcolor="#FCFCFC" style="width:100%; border:2px solid #fff"  >

                    <tr><td colspan="2"></td></tr>

                    <tr>

                    <td>

                        <asp:TextBox runat="server" ID="txtContent" TextMode="Multiline" Width="100%"  Height="300px">

                        </asp:TextBox>

                    </td>

                    </tr>

                    <tr>

                    <td colspan="2">

                    </td>

                    </tr>

                    <tr><td colspan="2">

                    </td></tr>

                    <tr>

                        <td>

                        </td>

                    </tr>

                    </table>                    

                </div>
 

              </ContentTemplate>

       </asp:UpdatePanel>
 
 
 

Server side code in page onload function:
 
 

  dvEditor.Visible = True

  Session("CurrentFile") = eventArgt

  txtContent.Text = retrieveData()

  updpnlEditor.Update()

Open in new window

0
Comment
Question by:Abdu_Allah
  • 3
  • 3
7 Comments
 
LVL 10

Expert Comment

by:jinn_hnnl
ID: 22776972
In your scenarios, The page is loaded with the data of that textbox is loaded, so no way you can do that normally.

What you can do is, dont load the txtContent data as your page is loaded. Just load a normal page, then use javascript function to trigger the updatepanel to update

A simple way of refreshing an UpdatePanel using JavaScript is to add a HiddenField to the page, change its value using JS and then have the HiddenField raise a postback event. The HiddenField causes the UpdatePanel to refresh because it has been declared as a trigger, is a child trigger or because the UpdatePanel.Update() method is called in the HiddenField ValueChanged event handler.

Look at this
http://weblogs.asp.net/rajbk/archive/2007/01/21/refresh-updatepanel-via-javascript.aspx

JINN
0
 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22777232
>What you can do is, dont load the txtContent data as your page is loaded.
This is not possible in my case because txtContent wil be loaded from multiple links not just from one.
0
 
LVL 10

Accepted Solution

by:
jinn_hnnl earned 500 total points
ID: 22777400
yeah, but it doesn't matter, because it should be logically act the same way.

put this part in the function let name it LoadTextData()
txtContent.Text = retrieveData()
updpnlEditor.Update()

You have a hidden field in your aspx page, which have autoPostBack. On Page Load you dont call this function, but as soon as the page is render to the client, javascript will cause the value of the hidden to change and thus cause the UpdatePanel to postback

Then you Call this LoadTextData on that change event (I dont remember exactly). So basically, you dont load on serverside, the page is render to the client, then from client javascript cause the UpdatePanel to update and Load the textfield

That the idea you can apply.

JINN


0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22778479
I get your point but I have a problem in applying it, how about a little source code?
0
 
LVL 10

Expert Comment

by:jinn_hnnl
ID: 22778878
I am out of office right now, I'll be back to you asap.

JINN
0
 
LVL 22

Expert Comment

by:prairiedog
ID: 22779126
The AJAX UpdateProgress is ideal for a long process of loading data.
0
 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22800266
jinn_hnnl I did as you suggest but its useless the div will not appear until txtContent completely loded with data.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
What .NET website keeps me current? 9 57
Two different visual studio versions 3 23
Remove greater than sign 3 45
Not showing JavaScript in the list 5 39
In .NET 2.0, Microsoft introduced the Web Site.  This was the default way to create a web Project in Visual Studio 2005.  In Visual Studio 2008, the Web Application has been restored as the default web Project in Visual Studio/.NET 3.x The Web Si…
Introduction This article shows how to use the open source plupload control to upload multiple images. The images are resized on the client side before uploading and the upload is done in chunks. Background I had to provide a way for user…
This Micro Tutorial demonstrates using Microsoft Excel pivot tables, how to reverse engineer competitors' marketing strategies through backlinks.
Many functions in Excel can make decisions. The most simple of these is the IF function: it returns a value depending on whether a condition you describe is true or false. Once you get the hang of using the IF function, you will find it easier to us…

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now