I could see that working except that the ID of my Progress control gets some extra naming container ID's attached to it. Not being a CSS master I wonder if it were wrapped with another DIV that displayed inline shouldn't that take care of it?
The above suggestion doesn't seem to work - as the UpdateProgress DIV is styled inline (varying between "display:none" and "display:block") - the inline "display:block" overrides the stylesheet setting.
Best soultion I could come up with was to use the following code:
Using, position:absolute will take the 'progress' span out of the document flow, thus not affecting other page elements. Setting just the "left" position will move the image across from the button (which is
less than 100 pxels wide)
This is by no means elegant, but achieves a goal. (and it assumes you have spare space to the left of your update button).
Other variations on this soultion could place the update indicator at the top left/right of the screen - (something like gmail does)
Would be much better if the UpdateProgress control could render
either as a Block or Inline element!
Alternatively to all of this, you could wrap the button and Progess control in a 2 cell table...
People go through periods in the lives - I'd rather go through exclamation points.
- Schultz
cisakson
Member
140 Points
28 Posts
UpdateProgress render inline option?
Mar 15, 2006 09:52 PM|LINK
UpdateProgress always seems to render the contents of <ProgressTemplate> on a new line. Any simple way to have that render inline where it is placed?
Rama Krishna
Participant
1277 Points
307 Posts
Re: UpdateProgress render inline option?
Mar 16, 2006 03:06 PM|LINK
You can to do this using css styles.
<style type="text/css">
Make sure that the ID of your progress control is updateProgress1.#updateProgress1
{
display:inline;
}
</style>
cisakson
Member
140 Points
28 Posts
Re: UpdateProgress render inline option?
Mar 16, 2006 11:39 PM|LINK
I could see that working except that the ID of my Progress control gets some extra naming container ID's attached to it. Not being a CSS master I wonder if it were wrapped with another DIV that displayed inline shouldn't that take care of it?
Rama Krishna
Participant
1277 Points
307 Posts
Re: UpdateProgress render inline option?
Mar 17, 2006 01:49 PM|LINK
Yes you can do something like that.
<div id="enclosure">
<atlas:updateprogress .... >
</div>
You can use selector as follows
#enclosure div
{
display: inline;
}
GrantDG
Member
15 Points
3 Posts
Re: UpdateProgress render inline option?
Jun 16, 2006 05:51 AM|LINK
The above suggestion doesn't seem to work - as the UpdateProgress DIV is styled inline (varying between "display:none" and "display:block") - the inline "display:block" overrides the stylesheet setting.
Best soultion I could come up with was to use the following code:
<p><span class="progress"> <atlas:UpdateProgress ID="updateProgress" runat="server"> <ProgressTemplate> <img id="Img1" runat="server" src="~/Images/Progress.gif" /> Updating... </ProgressTemplate> </atlas:UpdateProgress></span><asp:Button ID="testButton" runat="server" Text="Refresh" /> </p>Using, position:absolute will take the 'progress' span out of the document flow, thus not affecting other page elements. Setting just the "left" position will move the image across from the button (which is less than 100 pxels wide)
This is by no means elegant, but achieves a goal. (and it assumes you have spare space to the left of your update button).
Other variations on this soultion could place the update indicator at the top left/right of the screen - (something like gmail does)
Would be much better if the UpdateProgress control could render either as a Block or Inline element!
Alternatively to all of this, you could wrap the button and Progess control in a 2 cell table...
- Schultz
danellisuk
Member
15 Points
3 Posts
Re: UpdateProgress render inline option?
Sep 15, 2006 03:34 PM|LINK
It would be good if a RenderMode property could be added to UpdateProgress in the same way as the UpdatePanel.
The RenderMode property can be either Inline or Block, and that causes it to either output a wrapper <span> or <div> accordingly.
Just seems that the UpdateProgress is missing that property (not in July 2006 CTP anyway)
Daniel.
danellisuk
Member
15 Points
3 Posts
Re: UpdateProgress render inline option?
Sep 15, 2006 04:00 PM|LINK
Actually I have just tried enclosing the UpdateProgress with a span as so:-
<span class="progress"> <atlas:UpdateProgress runat="server" ID="up1"> <ProgressTemplate> <asp:Image ID="Image1" runat="server" ImageUrl="~/images/wait.gif" /> </ProgressTemplate> </atlas:UpdateProgress> </span>dkekish
Member
125 Points
25 Posts
Re: UpdateProgress render inline option?
Sep 25, 2006 08:26 PM|LINK
I have it working without the inline, a float: left; did the trick.
span.progress div
{
float:left;
}
Supergibbs
Member
202 Points
47 Posts
Re: UpdateProgress render inline option?
Aug 19, 2008 04:31 PM|LINK
"float: left" can cause it's own issues like possibly needing a clearing element, "display: inline" is the more correct way.
CSS
jonot2
Member
2 Points
1 Post
Re: UpdateProgress render inline option?
Oct 13, 2010 12:48 AM|LINK
This didn't work for me although I had to recreate it using dynamic controls (I checked the output html and it was identical)
However putting the UpdateProgress in a dynamic table cell alongside my exisiting controls did!
e.g.
<table> <tr> <td>some controls doing stuff</td> <td><atlas:UpdateProgress runat="server" ID="up1"> <ProgressTemplate> <asp:Image ID="Image1" runat="server" ImageUrl="~/images/wait.gif" /> </ProgressTemplate> </atlas:UpdateProgress> </td> </tr> </table>Cheers
Jon