UpdateProgress Position in middle of screen

Hi,

I have various updatepanels on the same page. I want to have 1 updateprogress on the same page and depending on which updateprogress is updating that the updateprogress move to the middle of the updateprogress that is updating. The following code below allows me to position the updateprogress in the centre of the page but when the the page is scrolled down the updateprogress doesn't move its position appropriately.

Can anyone help?

I have inspected the values of the document.body.scrolltop and it is always at 0. How can change the position of the updateprogress when the user scrolls the page?

<

scriptlanguage="javascript"type="text/javascript">

function

adjustDivs(){var df=document.getElementById("updateprogressdiv");

df.style.position=

'absolute' ;

df.style.left =document.body.offsetWidth/2 + document.body.scrollLeft -150;

df.style.top = document.body.offsetHeight/2 + document.body.scrollTop -50;

}

window.onload=adjustDivs;

window.onresize=adjustDivs;

window.onscroll=adjustDivs;

</

script>

did you ever figure how to make the updateprogress display in the center of the page even when you scroll the page down

or does anybody have any other ides on how to make this happen

hello.

you can easilly do that with the AllwaysVisibleControlExtender available on the atlas toolkit.

Hi,

I've come up with some DHTML to always center the animated gif on your screen, AS WELL AS disable all elements by throwing a transparent IFRAME z-indexed to the top. Keep in mind that I have NOT tested this with other browsers, only in IE6. If anyone wants to cross-browser/cross-platform modify it, be my guest.

<atlas:UpdateProgressID="uppMain"runat="server">

<ProgressTemplate>

<iframeframeborder="0"src="about:blank"

style="border:0px;position:absolute;z-index:9;left:0px;top:0px;width:expression(this.offsetParent.scrollWidth);height:expression(this.offsetParent.scrollHeight);filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=75, FinishOpacity=0, Style=0, StartX=0, FinishX=100, StartY=0, FinishY=100);"></iframe>

<divstyle="position:absolute;z-index:10;left:expression((this.offsetParent.clientWidth/2)-(this.clientWidth/2)+this.offsetParent.scrollLeft);top:expression((this.offsetParent.clientHeight/2)-(this.clientHeight/2)+this.offsetParent.scrollTop);">Please Wait...<br/><imgsrc="/_images/statusbar.gif"/></div>

</ProgressTemplate>

</atlas:UpdateProgress>

Works Perfect....Thanks for the code...

Okay... dude... that "left: expression((t..." line is absolute GENIUS!!! I had NO idea that you could do that! It even works in a stylesheet!

You are the MAN! Unless you're a girl, in which case you're... well, still the man! :D

Seriously, you guys couldn't have bumped this thread a couple hours ago? I just finished my own attempt at using UpdateProgress to disable page controls... and yours is better. :(

Umm,

I was under the impression that CSS "expression" is not standard. I know it works in IE, but does it work in Firefox. I know we've had problems before, because I don't think Firefox recognizes it. I could be wrong, though. You might want to cross-browser test it.

Hi guys/gals,

Tadmeister's introduction of Javascript within CSS was absolutely brilliant i thought also. So along with some help from another article on some Javascript i decided to do some customisation of my own. But instead of using an iframe (if anyone has a problem with it), I used a Panel for the overlay and another Panel within it for the "loading..." text. Here is a snippet in case anyone wants to try it out. I've tested it and it works nicely in Firefox2 & IE7, but IE6 gave me some problems with the vertical positioning. I used a hack for IE6, and anyone is welcome to improve on it!

<ajax:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<asp:Panel ID="Panel1" CssClass="overlay" runat="server">
<asp:Panel ID="Panel2" CssClass="loader" runat="server">
Loading...
</asp:Panel>
</asp:Panel>
</ProgressTemplate>
</ajax:UpdateProgress>

and the CSS for it:

.overlay {
position: fixed;
z-index: 99;
top: 0px;
left: 0px;
background-color: #FFFFFF;
width: 100%;
height: 100%;
filter: Alpha(Opacity=70);
opacity: 0.70;
-moz-opacity: 0.70;
}
* html .overlay {
position: absolute;
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
width: expression(document.body.scrollWidth > document.body.offsetWidth ? document.body.scrollWidth : document.body.offsetWidth + 'px');
}
.loader {
z-index: 100;
position: fixed;
width: 120px;
margin-left: -60px;
top: 50%;
left: 50%;
}
* html .loader {
position: absolute;
margin-top: expression((document.body.scrollHeight / 4) + (0 - parseInt(this.offsetParent.clientHeight / 2) + (document.documentElement && document.documentElement.scrollTop || document.body.scrollTop)) + 'px');
}

Yea, I know...the margin-top expression for IE6 is not the best, but if someone can make it work properly, be my guest. Alternatively check out: www.codeproject.com/ajax/modalupdateprogress.asp for Ting Huang's custom ajax extender.

Cheers!
Shalan99

Is there a way to get this to cover only a div or something? I have some web parts that do updates, and would like it to be centered within those, but I can't get that to work.

Hi Sarvis,

There are ways to achieve this. Raj Kaimal has a great bunch of control/extenders...one of which does what u want it to do, minus centering it in the associated control itself. Check it out @.: http://weblogs.asp.net/rajbk/archive/2007/01/08/using-the-updateprogress-control-as-a-modal-overlay.aspx

Another way to do this jus came to mind, but let me test it out first before i post any code.

Cheers!

Thank you very much. Great post. Tadmeister

Hi Tadmeister,

I implemented above code it worked, but receiving CSS validation is not valid for property left/top. How do I avoid receiving these error in .aspx page.

Please help...

Thanks for that, works fine

Updating a Cell (TD) in a Table

Hi all,

I am developing a webcontrol and I am also developing an AjaxExtender for these control...

Now the problem is when I register an click Event, I works fine, but I would like to replace the

value of one special cell with the result I get from Sys.Net.WebServiceProxy.invoke(),

since I am not so familiar with javaScript and all these Ajax stuff ;) I would like

to ask you guys if you have any advice for me to do that...

thanks in advance,

Omid

It depends a bit on your table structure and how you have things marked up with id's and so on. The easiest possible case is that your TD has a unique id, in which case you can easily say:

$get('idoftheelement').innerHTML = resultsOfTheInvoke;

if you don't have a unique id for it, it's somewhat more complex, but generally it's easiest if you use array notation, for example,

var table = $get('idOfthetable');

var rows = table.getElementsByTagName('TR");

var firstRow = rows[0];

var firstRowTds = firstRow.getElementsByTagName("TD");

var lastTd = firstRowTds[firstRowTds.length-1];

once you have the TD you want, you can set its innerHTML property to the texto f the result param.

hi Paul,

thank you very much for the advice...

My Table and rows and Cols have all an unique ID,

so I think $get('idoftheelement').innerHTML = resultsOfTheInvoke; fits to me...

redards Omid.

ps. I have another little question... what will happen if the ID is not Unique?? will I get an Array?

ID's have to be unique. I've honestly never tried to do them otherwise, since the spec requires them to be. I imagine you'd get different results in different browsers and depending on your doctype declaration.

one thing to watch out for when using the Id is that if your table is a server control and its inside a Master page or a User Control, then ASP.Net will munge the server-side ID to keep it unique (in case you have mulitple instances of the same control o nthe page, etc). The solution to that is to either not use the id (use some other means such as the one described) or else embed the server-generated id somewhere on the page inside a <script> block such as : var myTableId = '<%= tblMain.ClientID %>';

Updating a ContentPlaceHolder with Ajax

I am working on a project which uses a MasterPage with one ContentPlaceHolder. I have a custom menu control on the MasterPage. When an item in the menu is clicked I need the ContentPlaceHolder to be updated with the requested content. I know this can easily be done using an iframe, but I'd rather stay away from iframes and like to do this with Ajax.

Basically my question is if this is possible at all. I've been trying a couple of things but without success and I think it may have to do by the way a MasterPage works.
If not possible, is there some kind of workaround for this? (without residing to iframes)

Thanks!

Hi Rino,

I tried also the same thing as you. I had a menu on my master page and an ContentPlaceHolder in my update panel. That didn't work. I think it isn't possible what you want to do.

Regards,

Unfortunately, no. It's just not how master pages and AJAX work. I just finished a post on the topic here:http://odetocode.com/Blogs/scott/archive/2007/01/03/9682.aspx

Thanks guys for clearing this up!
Would be great as a new .Net feature though :)

You can do it right now, actually, it's not that big of a deal. You don't really need a contentplaceholder for it, just a Div that you can hook into w/ javascript (giving it an ID, for example). You have your menu item click handler fire a javascript function that calls a web service and then have the onrequest complete handler fill the div with the stuff it gets back.

paul.vencill:

You don't really need a contentplaceholder for it, just a Div that you can hook into w/ javascript (giving it an ID, for example). You have your menu item click handler fire a javascript function that calls a web service and then have the onrequest complete handler fill the div with the stuff it gets back.

Paul: Yes, but this is an entirely different approach.

Understood. I was trying to offer something that might work for his application. is there a good reason you can think of to limit his app to using contentplaceholders?

No, my goal was just to point out that updating content place holders with content from a different page isn't how the technologies work together. It seems to be a common question these days, so I'm trying to clear that up.

The right way to achieve this would be to use a solution like you proposed!

ah, ok, cool. :D

It is very easy.

See my last post about "Handling events...".

Updating a DataList with UpdatePanel

I've been trying to update my DataList with UpdatePanel but it's not working.

What I have is a text field for a user to enter comments and a save button, along with a DataList control all in an UpdatePanel.

Data is being saved on the table when the save button is clicked but the DataList is not updated unless I refresh the browser. What am I doing wrong?

Here is my ASP code:

 <asp:UpdatePanel ID="UpdatePanel3" runat="server"> <ContentTemplate> <asp:Panel ID="PanelCommentBody" runat="server" CssClass="collapsePanel" Width="451px"><br /> <asp:TextBox ID="txtComments" runat="server" Height="45px" TextMode="MultiLine" Width="412px" ValidationGroup="cmnts" ></asp:TextBox><br /> <asp:Label ID="lblComment" runat="server" Text="" Font-Size="Small"></asp:Label> <asp:RequiredFieldValidator ID="RFVComments" runat="server" ErrorMessage="Please enter comment." ValidationGroup="cmnts" ControlToValidate="txtComments" Font-Size="Small" Width="154px"></asp:RequiredFieldValidator> <asp:Button ID="bttnPostComment" runat="server" Text="Post Comment" OnClick="bttnPostComment_Click" ValidationGroup="cmnts" Width="122px" /> <asp:Button ID="bttnDiscard" runat="server" Text="Discard" OnClick="bttnDiscard_Click" CausesValidation="false" /> </asp:Panel> <cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender2" runat="server" CollapseControlID="closeComment" ExpandControlID="closeComment" TargetControlID="PanelCommentBody" Collapsed="true" SuppressPostBack="true"> </cc1:CollapsiblePanelExtender> <asp:DataList ID="DataList1" runat="server" DataSourceID="SqlDataSource1" Width="307px" Font-Size="Small"> <ItemTemplate> <strong>From: <a href="../Default.aspx?urnm=<%# Eval("UserName")%>"><asp:Label ID="FromLabel" runat="server" Font-Size="Small" Text='<%# Eval("UserName")%>'></asp:Label></a></strong> | Date Posted: <asp:Label ID="DateAddedLabel" runat="server" Text='<%# Eval("DateAdded", "{0:MMM dd, yy}")%>'></asp:Label><br /> <asp:Label ID="CommentLabel" runat="server" Text='<%# Eval("Comment")%>'></asp:Label><br /> <br /> </ItemTemplate> </asp:DataList><asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:MyDB%>" SelectCommand="SELECT [UserName], [Comment], [DateAdded] FROM [Comments] WHERE ([CL_Id] = @dotnet.itags.org.CL_Id) ORDER BY [DateAdded] DESC"> <SelectParameters> <asp:Parameter DefaultValue="1" Name="CL_Id" Type="String" /> </SelectParameters> </asp:SqlDataSource> </ContentTemplate> </asp:UpdatePanel>

Here is my Code Behind for the save button:

protected void bttnPostComment_Click(object sender, EventArgs e)
{
string flname = Request.QueryString["filename"];
flname = flname.Substring(0, flname.Length - 4);

if (User.Identity.IsAuthenticated)
{
MembershipUser myObject = Membership.GetUser();
string usrid = myObject.ProviderUserKey.ToString();
string usrname = User.Identity.Name;
string cmmnt1 = txtComments.Text;
string connStr = ConfigurationManager.ConnectionStrings["MyDB"].ConnectionString;
SqlConnection cnn = new SqlConnection(connStr);
SqlCommand cmd = new SqlCommand("INSERT INTO Comments (CL_Id, UserId, UserName, Comment) VALUES ('" + flname + "', '" + usrid + "', '" + usrname + "', '" + cmmnt1 +"')", cnn);
cnn.Open();
cmd.ExecuteNonQuery();
cnn.Close();
}
else
{
lblComment.Text = "You need to login to make comments";
}
}

----------

Thanks in advance,

Louis

1. Make UpdatePanel UpdateMode="Conditional"

2. after cnn.close(); write UpdatePanel3.Update()

Thanks siva sakki, I tried your suggestion but it still doesn't work.

What else can I try?

Louis

Updating a DataList with UpdatePanel

On Page_Load event, register DataList control

protected void Page_Load()
{
ScriptManager1.RegisterAsyncPostBackControl(DataList1);

DataList1.DataSource = this.SqlDataSource1;
DataList1.DataBind();
}

Thanks chetan, your suggestion might work. My problem is that I have the ScriptManger1 in the master page.

How can I reference this the way you have specified above?

Thank you,

Louis

I have tried the following to reference the the ScriptManger from content panel code behind:

ScriptManager.GetCurrent(this.Page).RegisterAsyncPostBackControl(DataList1);

is this the correct way of doing it? If it is my UpdatePanel still not updating. I have also removed this two lines:

//DataList1.DataSource = this.SqlDataSource1;
//DataList1.DataBind();

It is giving me this error:

Both DataSource and DataSourceID are defined on 'DataList1'. Remove one definition.

Do I need this two lines for it to work?

I am pulling my hair on this one.

Please help. Thanks again.

Louis

If you go back to the original code you submitted and add DataList1.DataBind() at the end of the button routine, you would probably achieve the results you want.

There is nothing to cause the DataList to rebind after the button event.

If you simply delete the UpdatePanel from the page, your code would not work either. As a rule, if doesn't work without Ajax, it won't work with it. The DataBinding event for the DataList has to run on the postback.

wrayx1 that did the trick.

Thank you soooo much!!!

Louis

Just do withDataList1.DataBind();

Let me know if this helps you

Okay, I have a similar question about updating using DataList. Will someone give me a hand on this. Here's what I have.

1<asp:ScriptManager ID="ScriptManager1" runat="server">2 </asp:ScriptManager>3<%--<asp:UpdatePanel ID="UpdatePanel1" runat="server">4 <ContentTemplate>--%>5 <asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="True">6 <asp:ListItem Value="True">Approved</asp:ListItem>7 <asp:ListItem Value="False" Selected="True">Not Approved</asp:ListItem>8 </asp:RadioButtonList>9 <asp:SqlDataSource ID="sqlApproval" runat="server" ConnectionString="<%$ ConnectionStrings:myConnStr%>"10 SelectCommand="SELECT [frstName], [lstName], [dvlID], [mdlName], [mdnName], [degree1], [degree2], [year1], [year2], [sp_frstName], [sp_lstName], [sp_year1], [sp_year2], [sp_mdlName], [sp_mdnName], [sp_degree1], [sp_degree2], [approval] FROM [dvlStory] WHERE ([approval] = @.approval)"11 DeleteCommand="DELETE FROM [dvlStory] WHERE [dvlID] = @.dvlID"12 InsertCommand="INSERT INTO [dvlStory] ([frstName], [lstName], [mdlName], [mdnName], [degree1], [degree2], [year1], [year2], [sp_frstName], [sp_lstName], [sp_year1], [sp_year2], [sp_mdlName], [sp_mdnName], [sp_degree1], [sp_degree2], [approval]) VALUES (@.frstName, @.lstName, @.mdlName, @.mdnName, @.degree1, @.degree2, @.year1, @.year2, @.sp_frstName, @.sp_lstName, @.sp_year1, @.sp_year2, @.sp_mdlName, @.sp_mdnName, @.sp_degree1, @.sp_degree2, @.approval)"13 UpdateCommand="UPDATE [dvlStory] SET [frstName] = @.frstName, [lstName] = @.lstName, [mdlName] = @.mdlName, [mdnName] = @.mdnName, [degree1] = @.degree1, [degree2] = @.degree2, [year1] = @.year1, [year2] = @.year2, [sp_frstName] = @.sp_frstName, [sp_lstName] = @.sp_lstName, [sp_year1] = @.sp_year1, [sp_year2] = @.sp_year2, [sp_mdlName] = @.sp_mdlName, [sp_mdnName] = @.sp_mdnName, [sp_degree1] = @.sp_degree1, [sp_degree2] = @.sp_degree2, [approval] = @.approval WHERE [dvlID] = @.dvlID">14 <SelectParameters>15 <asp:ControlParameter ControlID="RadioButtonList1" Name="approval" PropertyName="SelectedValue"16 Type="Boolean" />17 </SelectParameters>18 <DeleteParameters>19 <asp:Parameter Name="dvlID" Type="Int32" />20 </DeleteParameters>21 <UpdateParameters>22 <asp:Parameter Name="frstName" Type="String" />23 <asp:Parameter Name="lstName" Type="String" />24 <asp:Parameter Name="mdlName" Type="String" />25 <asp:Parameter Name="mdnName" Type="String" />26 <asp:Parameter Name="degree1" Type="String" />27 <asp:Parameter Name="degree2" Type="String" />28 <asp:Parameter Name="year1" Type="Int32" />29 <asp:Parameter Name="year2" Type="Int32" />30 <asp:Parameter Name="sp_frstName" Type="String" />31 <asp:Parameter Name="sp_lstName" Type="String" />32 <asp:Parameter Name="sp_year1" Type="Int32" />33 <asp:Parameter Name="sp_year2" Type="Int32" />34 <asp:Parameter Name="sp_mdlName" Type="String" />35 <asp:Parameter Name="sp_mdnName" Type="String" />36 <asp:Parameter Name="sp_degree1" Type="String" />37 <asp:Parameter Name="sp_degree2" Type="String" />38 <asp:Parameter Name="approval" Type="Boolean" />39 <asp:Parameter Name="dvlID" Type="Int32" />40 </UpdateParameters>41 <InsertParameters>42 <asp:Parameter Name="frstName" Type="String" />43 <asp:Parameter Name="lstName" Type="String" />44 <asp:Parameter Name="mdlName" Type="String" />45 <asp:Parameter Name="mdnName" Type="String" />46 <asp:Parameter Name="degree1" Type="String" />47 <asp:Parameter Name="degree2" Type="String" />48 <asp:Parameter Name="year1" Type="Int32" />49 <asp:Parameter Name="year2" Type="Int32" />50 <asp:Parameter Name="sp_frstName" Type="String" />51 <asp:Parameter Name="sp_lstName" Type="String" />52 <asp:Parameter Name="sp_year1" Type="Int32" />53 <asp:Parameter Name="sp_year2" Type="Int32" />54 <asp:Parameter Name="sp_mdlName" Type="String" />55 <asp:Parameter Name="sp_mdnName" Type="String" />56 <asp:Parameter Name="sp_degree1" Type="String" />57 <asp:Parameter Name="sp_degree2" Type="String" />58 <asp:Parameter Name="approval" Type="Boolean" />59 </InsertParameters>60 </asp:SqlDataSource>61 <br />62 <asp:DataList ID="dltApproval" runat="server" BackColor="White" BorderColor="#999999"63 BorderStyle="None" BorderWidth="1px" CellPadding="3"64 GridLines="Vertical" RepeatColumns="3" RepeatDirection="Horizontal" Width="700px" DataSourceID="sqlApproval">65 <FooterStyle BackColor="#CCCCCC" ForeColor="Black" />66 <SelectedItemStyle BackColor="#008A8C" Font-Bold="True" ForeColor="White" />67 <ItemTemplate>68 <table border="0" cellpadding="2" cellspacing="0">69 <tr>70 <td>71 <asp:Label ID="frstNameLabel" runat="server" Text='<%# loadStory()%>'></asp:Label>72 </td>73 <td>74 <asp:CheckBox ID="chbApproval" runat="server" Checked='<%# Bind("approval")%>' />75 </td>76 </tr>77 </table>78 </ItemTemplate>79 <AlternatingItemStyle BackColor="Gainsboro" />80 <ItemStyle BackColor="#EEEEEE" ForeColor="Black" />81 <HeaderStyle BackColor="#000084" Font-Bold="True" ForeColor="White" />82 </asp:DataList>83<%-- </ContentTemplate>84 </asp:UpdatePanel>--%>85 <table border="0" cellpadding="5" cellspacing="0" width="700">86 <tr>87 <td style="width: 100px; text-align: center">88 <asp:Button ID="btnUpdate" runat="server" OnClick="btnUpdate_Click" Text="Update" /></td>89 <td style="width: 100px; text-align: center">90 <asp:Button ID="btnFinish" runat="server" OnClick="btnFinish_Click" Text="Finish" /></td>91 </tr>92 <>  
 

And here's the code behind:

1protected void Page_Load(object sender, EventArgs e)2 {34 }5protected string loadStory()6 {7//load the data in here and display to the lable control8return strInfoHolder.ToString() ;9 }10protected void btnUpdate_Click(object sender, EventArgs e)11 {12 sqlApproval.Update();13 dltApproval.DataBind();14 }15protected void btnFinish_Click(object sender, EventArgs e)16 {17 Response.Redirect("~/Admin/");18 }

The problem I have is that it's not updating. At the moment, I disabled the AJAX UpdatePanel to figure out the udpate first. All I wanted is to update the Approval checkbox to the sqlDataSource control. Noticed I used Bind instead of Eval for the checkbox control that way I was hoping that once I called the sqlApproval.Update() method, the approval checkbox will automatically update the database field. However, that is not so. Any help is appreciated.

Updating a FreeTextBox within an UpdatePanel

Hello everybody,

I'm working on a translation interface for a multilingual intranet. This leads me to use Rich TextBoxes such as FreeTextBox.

It is well known that there are issues about it when used with ajax.net, but I tried...

My issue:

I've got a page with three imbricated updatePanels. UpdatePanel1 contains both of the other update panels.

When updating these controls, I want a freeTextBox to get a text to translate.

But, not only does the FreeTextBox refuses to get the text, it also generates javascript errors that prevent me from openning an ajax modal popup.

I've tried to replace Freetextboxes by simple asp textboxes and this works fine... excepted as regards the fact that i can see all the html, and cannot put my text in form...

Coulds give me a hint to solve this? Do you know another rich text box with which i would have this issue?

Thanx a lot.

DART did the same thing, TinyMCE too... The only richTextBox I have tested which works is CuteEditor.

From what I've read, the issue comes from the focus on the textbox.

So no soultion for the moment.

Hi, I think I had the opposite problem to you. I could get the text by using .Text property but I couldn't set the text byassigning a new value to .Text.

I had to use the following code as a workaround : -

Private Sub SetEnoteText(ByVal strNotesAs String)Dim strScriptAs String =String.Format( _"$get('ctl00_maincontentarea_HeaderTabs_eNoteTab_eNoteText').value = '{0}';", _ strNotes.Replace(vbLf, "").Replace(vbCr, "")) strScript += "ctl00_maincontentarea_HeaderTabs_eNoteTab_eNoteText_Initialize(ctl00_maincontentarea_HeaderTabs_eNoteTab_eNoteText_editor, $get('ctl00_maincontentarea_HeaderTabs_eNoteTab_eNoteText'));" ScriptManager1.RegisterStartupScript(Me,Me.GetType(),"SETNOTE", strScript,True)End Sub

'ctl00_maincontentarea_HeaderTabs_eNoteTab_eNoteText' Being the ID of the FreeTextBox.

Updating a status label

I have a recently insalled the AJAX Beta 1 and I was wondering if it will enabled me to change a label multiple times in a sub... see the code below.

Protected Sub cmdSubmitUpload_Click(ByVal senderAs Object,ByVal eAs System.EventArgs)Handles cmdSubmitUpload.CliclblUploadStatus.Text ="Saving file on server..."'do the save herelblUploadStatus.Text ="Verifying file..."'call a routine that verifieslblUploadStatus.Text ="File verified."End Sub

I want to change the label and have the user see it change every time.  Is there a way to do this using AJAX?

Hello, the code that you write for an event handler will run on the server when the request is received, and the result of this is one and only one response that will update the page. If you want to provide this kind of feedback, you would need to write more client side code that executes each part of your process separately and can update the label before each step. You can seach msdn for a Whidbey feature called CallBacks that will allow you to do this, or you can make use of Atlas ability to call webservices from script.

Hope this helps,
Federico

Updating a Text Box after the modalpopup closes.

Hi There

I'm attempting to create a function for users that allows them to browse their intranet site and save links within the intranet as a collection of 'my links'. To do this I'm using an iFrame embedded within the modalpopup extension. Everything is working with the exception of the final part (which is quite frustrating) - Basically I need to populate a textbox with the current location in the iFrame. I know that I'm ready the value correctly but the text box is just not updating. I've inserted the user control below - all you need to do is insert the control into a new page and then point the iframe at a starting page. Any help greatly appreciated as I could do with an answer to this issue as soon as possible.

<%@dotnet.itags.org. Control Language="C#" AutoEventWireup="true" CodeFile="test.ascx.cs" Inherits="includes_mylinks" %>
<%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<script type="text/javascript">
function onOk() {
var NewURLTextBox = parent.document.getElementById("<%= newurl.UniqueID %>");
var NavFrame = parent.frames(0);
NewURLTextBox.InnerText = NavFrame.location.href;
NewURLTextBox.InnerHTML = NavFrame.location.href;
NewURLTextBox.Value = NavFrame.location.href;
alert(NavFrame.location.href);
}
</script>
<asp:ScriptManager runat="Server" EnablePartialRendering="true" ID="ScriptManager" />
<h3>Add a new link</h3>
<table width="100%">
<tr>
<td style="width: 100px">Title:<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="newurldescription"
ErrorMessage="Please supply a Title" SetFocusOnError="True" ValidationGroup="NewURL">*</asp:RequiredFieldValidator>
</td>
<td><asp:TextBox runat="server" Text ="" ID="newurldescription" /></td>
</tr>
<tr>
<td>Address:<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="newurl"
ErrorMessage="Please specify the URL you wish to save" SetFocusOnError="True" ValidationGroup="NewURL">*</asp:RequiredFieldValidator>
</td>
<td><asp:TextBox runat="server" ID="newurl" EnableViewState="false" /> <asp:LinkButton ID="cmdBrowse"
runat="server">[Browse]</asp:LinkButton></td>
</tr>
<tr>
<td>Position:<asp:RangeValidator ID="RangeValidator1" runat="server" ControlToValidate="newurlposition"
ErrorMessage="Please enter a value between 1 and 9" MaximumValue="9" MinimumValue="1"
SetFocusOnError="True" Type="Integer" ValidationGroup="NewURL">*</asp:RangeValidator>
</td>
<td><asp:TextBox runat="server" Text ="" ID="newurlposition" MaxLength="1" Width="15px" /></td>
</tr>
</table>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" />
<asp:Panel ID="BrowsePanel" runat="server">
<asp:Panel ID="Panel3" runat="server" Style="cursor: move;background-color:#DDDDDD;border:solid 1px Gray;color:Black">
<div>
<p>Navigate to the Page that you would like to add to My Links:</p>
</div>
</asp:Panel>
<iframe id="BrowseIntranet" runat="server" src="http://pics.10026.com/?src=default.aspx" height="450px" width="850px" ></iframe>
<p style="text-align: center;">
<asp:Button ID="OkButton" runat="server" Text="Select" />
<asp:Button ID="CancelButton" runat="server" Text="Cancel" />
</p>
</asp:Panel>
<cc1:ModalPopupExtender ID="ModalPopupExtender" runat="server"
TargetControlID="cmdBrowse"
PopupControlID="BrowsePanel"
BackgroundCssClass="modalBackground"
OkControlID="OkButton"
OnOkScript="onOk()"
CancelControlID="CancelButton"
DropShadow="false"
PopupDragHandleControlID="Panel3" />

Hi,

I was searching for somethig, but came across your post. I read an artcle to update the server control on postback. the url ishttp://www.aspdotnetcodes.com/ModalPopup_Postback.aspx . in this article they make use of label control, please try it with your TextBox.. and let me know if if helps you.

Thanks

Updating a UpdatePanel from another form?

This may be a silly question, but since I'm a total newbie I have to ask.

If I have say 5 different UpdatePanels on a form and if I from the same form open another form (window.open('anotherform.aspx...')) for data entry is it possible to update one of the UpdatePanels on the main form? Or, to the triggers all have to be situated at the same form as the UpdatePanel?

Any help is apreciated!

Instead of window.open and design a new page for popup, you can design using modalpopupextender and you can refresh any panels from the same page.

Updating a Tree Control with Ajax

I'm new to Ajax so forgive me if this is an obvious question. I have a Tree control that's populated when a form loads. It has 4 levels of nodes. When one clicks on the lowest level (the leaves) then associated data populates controls to the right of the tree view.

There has to be the ability to delete a leaf. When this is done, might the Ajax update control be used to remove the leaf from the tree, yet keep the tree positioned in the same place?

An unrelated question: Is there an ASP.Net 2.0 web control that acts like a resizable panel similar to what's available with WinForms? This sort of thing exists on MSDN: http://msdn2.microsoft.com/en-us/library/ms229335.aspx (ie. the panel on the left)

Robert W.

Hi,rmdw

What you meant "keep the tree positioned in the same place"?

I'm sorry for that I cann't understand your question.Can you provide more information?

Suppose you had a tree that looked like this:

+ A

+ B

+ C

Now suppose you open up the "B" node to reveal this:

+ A

- B

- B1

- B2

- B3

+ C

Now suppose the user wants to delete leaf "B2". What I would like is for the tree to be redrawn (refreshed) with B2 gone but still showing the user the same portion of the tree. Obviously for such a small example it probably always will be shown but imagine there were 100 parent nodes and multiple levels.

Robert

Ha Ha, I see, you wanna keep the tree like this:

+ A

- B

- B1

- B3

+ C

after you deleted leaf "B2".

But it show you this:

+ A

+ B

+ C

because the updatepanel refreshed.

I advise you using webservice or webmathod to achieve it instead using updatepanel.

Sample:

Default.aspx:

<%@. Page Language="C#" %>

<!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 id="Head1" runat="server">
<title>Untitled Page</title>

<script type="text/javascript">
// This function calls the Web Service method.
function EchoUserInput()
{
var echoElem = document.getElementById("WhichLeafToDelete");
WebService.DeletedLeaf(echoElem.value,SucceededCallback);
}
// This is the callback function that processes the Web Service return value.
function SucceededCallback(result)
{
//Do something to change the html of the tree to delete the leaf.
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services>
<asp:ServiceReference Path="WebService.asmx" />
</Services>
</asp:ScriptManager>
<div>
<h2>
Simple Web Service</h2>
<p>
Calling a simple service that echoes the user's input and returns the current server
time.</p>
<input id="WhichLeafToDelete" type="text" />
<input id="EchoButton" type="button" value="Echo" onclick="EchoUserInput()" />
</div>
</form>
<hr />
<div>
<span id="Results"></span>
</div>
</body>
</html>

WebService.asmx:

<%@. WebService Language="C#" Class="WebService" %>

using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Web.Script.Services;

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class WebService : System.Web.Services.WebService
{
[WebMethod]
public string DeletedLeaf (String input)
{
//Do something to delete the leaf in the database.
}
}

For more help, You can see thesetutorials:
http://ajax.asp.net/docs/tutorials/ExposingWebServicesToAJAXTutorial.aspx.
http://ajax.asp.net/docs/tutorials/ConsumingWebServicesWithAJAXTutorial.aspx

Let me know if you need more info.

Jin-Yu Yin:

I'm a bit confused. The actual display of the tree is a local matter, isn't it? As such, isn't it superfluous about whether to use a web service or code on the page?

What about the Ajax Update Panel wouldn't solve the problem I'm trying to solve?

Robert

Hi, Robert

If you don't need to do something at the server-side, e.g. deleting the leaf in the database, I mean that, If you just delete something at the client-side,you don't need to use a web service or code on the page, just use JavaScript to delete it. it's ok.

If you use an updatepanel to do this, it'll show you this:

+ A

+ B

+ C

because the updatepanel refreshed. It cann't remember what you had did before the postback

Updating a website with data from an asynchronously called Webservice

Hi!

I wrote the following code to update a label on my aspx-page with data retrieved by an asynchronously called Webservice.

Protected Sub Page_Load(ByVal senderAs Object,ByVal eAs System.EventArgs)Handles Me.LoadIf Not Page.IsPostBackThen Dim wsAs localhost.WebServiceTest =New localhost.WebServiceTestDim ResultAs IAsyncResult = ws.Beginmessages(AddressOf renderResult, ws)End If End Sub Private Sub renderResult(ByVal ResultAs IAsyncResult)Dim wsAs localhost.WebServiceTest =CType(Result.AsyncState, localhost.WebServiceTest) Label1.Text = ws.Endmessages(Result)End Sub

The problem is that the Label (which is surrounded by an Updatepanel) does not get updated with the value returned by the Webservice although "renderResult" is executed correctly. (Maybe the problem is that the asynchronous function is called in a different thread on the webserver?)

Do you have any ideas or solutions to solve this issue?

Thank you

No suggestions?

Try doing your asynchronous webservice calls from the client-side rather than from the server.

http://www.asp.net/learn/ajax-videos/video-79.aspx

http://www.asp.net/AJAX/Documentation/Live/tutorials/ASPNETAJAXWebServicesTutorials.aspx

As DisturbedBuddha points out, you would probably want to do this sort of thing client side (remember the runat=server thing).

But, if youreally want to do this server side, my first question would be - is the updatepanel inside a form?

Cheers

Martin

Thank you for your help.

Calling the webservice client-side worked!

Updating an Application to the April CTP

Hello,

I am trying to update a web application to use the April CTP. I have refreshed the the Atlas .dll, but the application still seems to be referencing the March version. Any new application works fine when using from the Visual Studio Atlas Template based on the updates provided by the April CTP.

Is there a Manual way to make sure that I am using the newer version on an application that was started using the March version?Normally, you can't use March CTP and April CTP together. You have to uninstall the March CTP before installing the April CTP. From then, you applications written with the March CTP will now work with the April CTP.

Hope this helps
It's possible that your browser is caching the old Javascript includes I suppose - have you tried clearing your cache? Or setting debug=true?

Otherwise, if you've copied the microsoft.atlas dll into the bin directory of your app, I can't see what might be causing the problem.

Thanks,
Carlos

hello.

copying the new dll should solve the problem you're having. why do you say your app is using the march version?

Hi Luis,

It's not our app...it's the files that get installed. We are just now adding Atlas to our application. When the installer runs, it puts the zip files for the Atlas project into the Project Templates folder defined in VS 2005, and installs some stuff into C:\Program Files\<see previous post>. Those files, from what I can gather, is what is used for a new Atlas project.

When I create a new Atlas project after installing the April CTP, the Microsoft.Web.Atlas.dll has a file version of 2.0.50727.60309, dated 3/17/06, and the readme.txt that pops up has the same date in it. Unless I'm missing something, this is the March CTP.

All I'm doing is trying to install the April CTP and create a new app from it. I uninstalled the project templates from the location specified by the VS 2005 setting before running it, and it still put the March CTP files into that location. I'd suspect that it's providing a cached version of the project when it creates the new one, but even the files in Program Files are old.

Thanks,
John

Hey All -

It must have been some wierd caching either within our network or in the browser. I dusted off Mozilla to try downloading it; the first click downloaded the Mart CTP again. But downloading through the direct 'If your download doesn't start...' link got the correct one.

Very strange.

Thanks,
John

hello again.

well, yes, the files placed on the program files\microsoft asp.net\atlas are everything you need to deploy your app.

and yes, it looks like you have the wrong version. mine says:2.0.50727.60406

I guess I should have clarified... it seems to be using the "March CTP" based on the errors that still existed. After the removal of the March CTP and Installation of the April, all hot fixes work fine... except in an application that was created using the March CTP. That one does not want to update.

Thanks for you replies!

hello.

updating that app should be as easy as dropping the new dll on the bind folder. have you checked the version of the dll on the bin folder? according to your previous post, it seems like you're still using the olde version...

Updating an UpdatePanel

Hello, I have just started using AJAX and ASP and could use some help with a problem I could not solve today.

Here is a link so you can check out my site setup...

http://opteron.dnsprotect.com/~verisol/HelpImage.bmp

LogSheetOperator.aspx is a content page to Site.Master and is the page that includes the AJAX ScriptManager. The VB code in this page adds the .ascx pages to the UpdatePanels of each tab.

NetWeightAuditUpdatePanel and CheckTimesUpdatePanel both contain a gridview. When the gridview in the NetWeightAuditUpdatePanel is updated, I want the CheckTimesUpdatePanel to refresh.

I made a simple test page that implements the Triggers feature of the update panel and successfully got that working with the Click method of a button. When I tried to apply that logic to the real project, it did not work. I'm guessing this is because of how the pages are structured.

Anyone have a solution or suggestions?

Thanks!
Matt

Off hand, i know there are many approaches out there, but have you considerd a single updatepanel hosting the tab containers which in turn host the dynamic ascx files.

You have the tab container hostin the tab panels which inturn hosts the updatepanels which inturn hosts the ascx files. cant 1 updatepanel provide you the support that you need.?

Daniel, thanks for that information. I just tried replacing all the update panels with a single update panel that encapsulated both Tab groups, but it still did not work. Since the content is on those .ascx pages, if I try and call a .Update() method inside the gridviews rowupdated event, it says that theUpdatePanelX.Update() is not defined, which makes sense because it is on a different page.

Any other ideas on how to get the UpdatePanel to Update?

Thanks!

what does "When the gridview in the NetWeightAuditUpdatePanel is updated" mean , are you doing some kind of editing here in the gridview or do you mean when the underlying data in updated?

i dont know if the following would be useful, but when i used ascx files sometimes i need to call some function or sub in the ascx's underlying codebehind to update the controls in the ascx.

What i do in that case is to create a public method mostly a sub, could be a function or property too. and have the hosting page call that public method of the ascx object instance. that way the ascx object will postback and the content of the ascx will update.

in your case you could explicitly call the "update" method of the ascx and let normal postback take care of the updating via the updatepanel as normal or you could go overboard and wire-up the public method of the ascx as an event handler of the rowupdated event.

So essentially you are not trying to call the .updatemethod of the updatepanel but instead trying to cause a postback in addition to firing an event in the "target" ascx that you want updated and you take it from there.

Updating an Update Panel on a page from Javascript

Hi All,

I am trying to update an update panel in a webform from Javascript. Form the documentation I think this might be possible using the Sys.Webforms.PageRequestManager but I have not been able to achieve this so far.

Any help would be greatful.

Hamlet

Hi Hamlet !

I been having the same wish ! After a lot of googeling the only way I found is to put an invisible button in a updatepanel and then raise it's postbackevent by registrering it's postbackevent in the scripthandler. Using the

$get('<%= YourControl.ClientID %>').click();

didn't work in FireFox and I supspect - but don't know for sure - not in ie7 ! One thing I wasted alot of time on was that the ValidateEventError but that was because I supplied an argument when registrering the clientscript in the scripthandler !

This feels like an uggly hack to accomplish what we want - but I didn't find any other way !

/MC24

I have been using

javascript:__doPostBack('__Page', 'some data' ) from the client.

This worked fine in the earlier release, but Beta 2.0 broke it because it started doing full postbacks instead of partial ones.

Evan

You can use the extender control I build.

http://daron.yondem.com

updating an updatepanel...

Hi.

I'm sure the update panel is not just a clever name, but, it isn't doing what it ways on the tin!!

UpdatePanel1: Houses a databound GridView
UpdatePanel2: TextBox1 and ListBox1.

I have a page with a search form on. The user submits search criteria which fire a conditional update of UpdatePanel1. The GridView re-binds itself perfectly! Now, I used to have some javascript which picked up the selected value of Listbox1 and dumped it out to TextBox1, it worked fine, until, I installed the latest release of the toolkit and now the javascript cannot find the form object.

No matter, I thought, I'll use an update panel and set it to conditional update and uses ListBox1.SelectedIndexChanged to fire the update, dumping the selected value into TextBox1. So I wrapped TextBox1 in UpdatePanel2 and run the code... nothing happened, until, I hit the search button which fires the update of UpdatePanel1. When I click this button both panels update?

So I thought I'd try putting ListBox1 outside of the UpdatePanel2... still no joy, exactly the same thing happened when the search button is clicked.

I then tried forcing the UpdatePanel2 to update in the code behind using, amazingly, UpdatePanel2.Update()... Guess what... nothing, until I hit the search button again.

I have double checked and both panels are setup as follows: UpdateMode="Conditional" ChildrenAsTriggers="False". My Script manager has Partial Rendering set to true. Both Update Panels have the correct triggers i.e UpdatePanel1 = Button1.click and UpdatePanel2 = ListBox1.SelectedIndexChanged

Anybody have any ideas? I can post the code up if required.

Thanks in advance.

I was able to recreate your example, with a listbox and textbox, populating the textbox on the listbox_SelectedIndexChanged event. At first, it would fire and fire and fire, but the textbox wouldn't update.

The kicker was changing ChildrenAsTriggers="True". See if that doesn't help.

Thanks Dugald.

I tried this but still no luck. Is your ListBox inside or outside the update panel?

I'm not convinced that the event is firing or not in al hoensty! I've tried adding an UpdateProgress template and adding sleep to the thread of 2 seconds but I still see nohting.

Just to confirm your setup.

ScriptManager: PartialRendering="True"
UpdatePanel: UpdateMode="Conditional" ChildrenAsTriggers="true "
ListBox: OnSelectedIndexChanged="ListBox1_SelectedIndexChanged"

?

Have you tried setting a breakpoint in the event code to verify the event is firing?

Here is the code for my simple test:

<%@. Page Language="C#" EnableViewState="true" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" runat="server"> </asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="True" UpdateMode="Conditional"> <ContentTemplate> <asp:ListBox ID="ListBox1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="ListBox1_SelectedIndexChanged"> <asp:ListItem>Alpha</asp:ListItem> <asp:ListItem>Bravo</asp:ListItem> </asp:ListBox> <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Button" /><br /> <br /> <asp:TextBox ID="TxtTarget" runat="server" ForeColor="Black"></asp:TextBox> </ContentTemplate> </asp:UpdatePanel> <asp:Button ID="Button1" runat="server" Text="Full Postback" OnClick="Button1_Click2" /> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> </form></body></html>

using System;using System.Data;using System.Configuration;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;public partialclass _Default : System.Web.UI.Page {protected void Page_Load(object sender, EventArgs e) { }protected void Button1_Click1(object sender, EventArgs e) { }protected void ListBox1_SelectedIndexChanged(object sender, EventArgs e) { TxtTarget.Text ="Changed";// ListBox1.SelectedValue; }protected void Button2_Click(object sender, EventArgs e) { TxtTarget.Text ="Pushed"; }protected void Button1_Click2(object sender, EventArgs e) { TxtTarget.Text ="Posted"; TextBox1.Text ="Posted"; }}

Ok, after adding a breakpoint on the ListBox1_SelectedIndexChanged event. I can see that the event is not even firing?
Try deleting the event and recreating it.

AHHHHHHHHH!!!!!!!!!!!!!!

Amazing what AutoPostBack="True" does!

Thanks for your help Dugald! Sorry for the Noob error...

Updating an UpdatePanel with Javascript

I've done a lot of googling to find a fix for this - I've found lots of posts about people using something similar however no one gives a clear example of how to do it.

I've created a cut down version of what we're trying to do and you can clearly see the problem with it if you load the test file.

Ok first we have an update panel with a literal and an asp:button with a server onclick function to change the literal text when pushed. Then we have a standard HTML button with a javascript command to click the asp:button. What happens is when the html button is outside the update panel the whole page posts back. When it's inside the update panel it looks as if the update panel is refreshed but the literal valuedoesn't change. I say that the update panel looks like it's being refreshed because previously we had an updateprogress control on this page and it was showing that it was updating.

Anyone that knows what's going on or can suggest another solution?

<%@dotnet.itags.org. Page Language="VB" %><script runat="server" >Sub Page_Load(ByVal SenderAs Object,ByVal eAs EventArgs)If Not Page.IsPostBackThenliTesting.Text ="before postback"End IfEnd SubProtected Sub btnUpdate_Click(ByVal senderAs Object,ByVal eAs System.EventArgs)liTesting.Text ="after postback"End Sub</script><!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" xml:lang="en"><head runat="server"><title>UpdatePanel Test</title></head><body><form runat="server"><asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" /><asp:UpdatePanel runat="server" ID="UpdatePanel1"><ContentTemplate><asp:Literal runat="server" id="liTesting" /><asp:Button ID="btnUpdate" runat="server" OnClick="btnUpdate_Click" text="asp button" /></ContentTemplate></asp:UpdatePanel><input type="button" onclick="javascript: document.getElementById('<%=btnUpdate.ClientID%>').click();" value="html button" /></form></body></html>

No one's encountered this before?

*shameless bump*

Not having any problems with your sample. It fires the event and no refresh happens.

the only thing I can see doing is a little tweaking of your js

onclick="javascript: $get('btnUpdate').click();"

Kodo, please excuse my ignorance, but what is the meaning and syntax of the $get function? I must admit I never saw it before...

$get is a crossbrowser version (more or less) of document.getElementByID that is introduced with ASP.NET AJAX. I love it.

Thanks a million. I guess I'll start using it.

Kodo - thanks for reminding me about the $get call - we've only just switched from atlas to microsoft ajax yesterday and I just upgraded the old code from <atlas:... to <asp:...

I just tried the example again and it turns out the refresh ONLY happens in Firefox (I'm using 1.5.0.8 currently). It must be something to do with how Firefox determines if a user clicks the button or if a script does.

I've been trying to do something similar using a LinkButton (not standard form button).

$get works great, but the click event is not accesible using firefox 2. Im guessing this is a security thing, the fox is throwing an error

Error: $get("lnkDoPostBack").click is not a function
Source File:http://localhost:1667/AjaxDigiguru/Display/ImageEdit.aspx
Line: 82

I made a mini workaround that posts the page back if you have firefox, rather than causing an error.

Dim strScriptAsString ="function UpdateThumbnail(x,y,w,h) { " & vbNewLine & _
" if($get('lnkDoPostBack').click){ " & vbNewLine & _" $get('lnkDoPostBack').click();} else {" & vbNewLine & _" document.forms[0].submit()}" & vbNewLine & _" }" 
Is there a more elegant fix? I'd love to call an UpdatePanel from a javascript function cross browser. I'm sure theres a real solution, rather than a bodge.
 

Hi,

I was seeing the same complete page submit on the HTML button in FireFox 1.5. As a test I modified things to manually do a __PostBack() on the asp:button within the panel and that seems to work as expected (a partial page update):

<%@.PageLanguage="VB" %>
<scriptrunat="server"
Sub Page_Load(ByVal SenderAsObject,ByVal eAs EventArgs)

IfNot Page.IsPostBackThen
liTesting.Text ="before postback"
EndIf

EndSub

ProtectedSub btnUpdate_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)

liTesting.Text ="after postback " & system.datetime.now().tostring()

EndSub

</script>

<!

DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="en">
<headid="Head1"runat="server">
<title>UpdatePanel Test</title>
</head
<body
<formid="Form1"runat="server"
<asp:ScriptManagerID="ScriptManager1"runat="server"EnablePartialRendering="true"/
<scriptlanguage="javascript">
function htmlPostBack()
{
__doPostBack('<%=btnUpdate.ClientId%>','');
}
</script>

<

asp:UpdatePanelrunat="server"ID="UpdatePanel1">
<ContentTemplate>
<asp:Literalrunat="server"id="liTesting"/>
<asp:ButtonID="btnUpdate"runat="server"OnClick="btnUpdate_Click"text="asp button"/>
</ContentTemplate>
</asp:UpdatePanel>

<

inputtype="button"onclick="htmlPostBack();"value="html button"/
</form>
</body>
</html
Shawn

Cheers Shawn. Works a treat, but bear in mind that the documentation says it's unsupported, you might need to change it when they release the final version!

Updating an UpdatePanel through a LinkButton command generated by a repeater

Hi everybody,

I would like to refresh an update panel when I click on a Linkbutton generated by a repeater that looks like this:

<asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
 <ItemTemplate>
 <li>
 <asp:LinkButton ID="LinkButton1" runat="server" OnCommand="FilterByPrize" CommandName="filter" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "NameID")%>'>
<%# DataBinder.Eval(Container.DataItem, "Name")%> </asp:LinkButton>
 </li>
 </ItemTemplate>
</asp:Repeater>

The command called is the following:   

 protected void FilterByPrize(object sender, CommandEventArgs E){string connString ="connstring"; SqlConnection IVR =new SqlConnection(connString);string finalquery ="sqlquery " + E.CommandArgument.ToString() +" order by TimeStamp desc"; SqlDataSource2.SelectCommand = finalquery; SqlDataSource2.DataBind(); userData.DataBind();} 

The problem with this is that it reloads the whole page instead of only the update panel. Is there a way to refresh the updatepanel from a function in the c# code called from a linkbutton?

Thanks

MrClash,

The update panel has an Update() method that will do this. But I'm afraid that you are going to have register the linkbutton with the update panel. Take a look at this thread.

http://forums.asp.net/thread/1703456.aspx

Good luck! And feel free to provide some more details if this doesn't work.
Regards.

Updating an UpdatePanel only when certain item is clicked in Datalist

I have 2 UpdatePanels each with a Datalist in them. Here is my code:

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DataList2" />
</Triggers>
<ContentTemplate>
<asp:DataList ID="DataList1" runat="server" DataSourceID="Ods1"BorderStyle="Solid" GridLines="Both" RepeatDirection="Horizontal">
<ItemTemplate>
<asp:ImageButton ID="ThumbImage1" runat="server"ImageUrl='<imagepath...>' />
</ItemTemplate>
</asp:DataList>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
<asp:DataList ID="DataList2" runat="server" RepeatColumns="4"DataSourceID="Ods2" BorderStyle="Solid" GridLines="Both"RepeatDirection="Horizontal" OnItemCommand="DataList2_ItemCommand"CellPadding="5">
<ItemTemplate>
<asp:ImageButton ID="ThumbImage2" runat="server"ImageUrl='<imagepath...>' CommandName="ThumbImage"CommandArgument='<passing the id...>' />
<br />
<asp:ImageButton ID="DeleteImage" runat="server"ImageUrl="images/delete.gif" CommandName="DeleteImage"CommandArgument='<passing the id...>' />
</ItemTemplate>
</asp:DataList>
</ContentTemplate>
</asp:UpdatePanel>

and the code in DataList2_ItemCommand is as follows:

protected void DataList2_ItemCommand(object source, DataListCommandEventArgs e)
{
if (e.CommandName == "DeleteImage")
{
//code to delete the image from database

...
this.DataList2.DataBind();
this.UpdatePanel2.Update();
}
else if (e.CommandName == "ThumbImage2")
{
//code to add the thumb image to the table attached to datalist1.
...
...
this.Datalist1.DataBind();
this.UpdatePanel1.Update();
}
}

As you can see in the above code, I want to update the UpdatePanel1 only when the imagebutton "ThumbImage2" is clicked and NOT when the imagebutton "DeleteImage" is clicked in Datalist2. But because Datalist2 is the cause of the AsyncPostBackTrigger for UpdatePanel1, it is updated when either one of the imagebuttons are clicked. Is there a way to change this?

Please help.

You don't want to set the datalist as the trigger, you want to set the individual ImageButtons as the triggers. Remove the triggers from UpdatePanel1, as well as the UpdateMode="Conditional".

<asp:UpdatePanelID="UpdatePanel1"runat="server">
<ContentTemplate>
...
</ContentTemplate>
</asp:UpdatePanel>

Then in the DataList2_ItemDatabound event, add the following:

ProtectedSub DataList2_ItemDataBound(ByVal senderAsObject,ByVal eAs System.Web.UI.WebControls.DataListItemEventArgs)Handles DataList2.ItemDataBound
Dim ibtnAs ImageButton =CType(e.Item.FindControl("ThumbImage2"), ImageButton)
Dim trggrAsNew AsyncPostBackTrigger
trggr.ControlID = ibtn.ClientID
trggr.EventName ="Click"
UpdatePanel1.Triggers.Add(trggr)
EndSub

In the ItemCommand event, I am executing some server side code for the imagebutton that was clicked in that specific row of datalist based on its id (which I retrieve using e.CommandArgument).

If I use the approach that you mentioned above, how do i retrieve the database id of the image clicked?

Thanks

DataList2.DataKeys.Item(e.Item.ItemIndex)

The solution you suggested works like a charm. I removed the datalist as the trigger & added the imagebutton as trigger in ItemDataBound event. Also, I still execute the server side code in ItemCommand event based on the which button clicked & everything works fine.

Thanks a ton.

Updating an UpdatePanel from another webpage.

I have an UpdatePanel on a page. This webpage opens up a new web page. Is it possible to force an update of the UpdatePanel on the first webpage from the second page?

hello.

yep, that should be possible. if your main problem is establishing the comunication from the child to the parent window, then take a look here:

http://www.javascriptkit.com/javatutors/remote2.shtml

But what can I call on the parent page to force a submit of the panel. Would I, for example, have to call the submit event of a button which in turn will submit the updatepanel or is there an event which I can call directly on the updatepanel itself? I don't really want to have to add an extra control to raise the submit event which would be visible to the user.

hello.

yes, that is the idea... you can add a button to the page and hide it (say, set it's css display to none). so, your parent page can expose a method that is responsible for calling the click methdo over that button (this method will be called from your child page).

Updating and ASP Textbox from Server Side Script using AJAX Extensions

I've searched the web extensively and cannot find an answer to a question that I believe is simple.

I have an application running AJAX extensions so that scripts are run at server side. Everything works great. The problem I have is that based on selections in the script I need to base data to ASP.NET VB code behind to intergrate with an existing application.

Quite simply I want to update a hidden textbox then use that data to pass along to another asp page. I know how to pass the data once I get it to and ASP control. Just need to get it to the ASP side of the server.

Thanks in advance for any help.

Brian

I solved my problem.

Make sure there is an Name tag on the textbox that you will be using to pass info to code behind

This will accept a value and display it.

<inputtype="text"id="textbox1" value="JavaScript JumpStart"runat=server>

If you want to use the value in the code behind file this is what you need.

<inputtype="text"id="textbox1"name="textbox1"value="JavaScript JumpStart"runat=server>

Note the addition of the name tag.

Updating Atlas

Hello,
I was developing a produciton project using Atlas July CTP and Control Toolkit.
Now I'd like to updating to last version, but I can see that ATLAS is formed by 2 components:
Atlas 1.0 beta AND Atlas CTP beta.
I was used only Updatepanel in July CTP

What I need now? Is necessary to install both 1.0 and CTP?

And fot update what I do?
Must uninstall the previous version and then Install the new one?

tnx

If you just used the updatepanel, you don't need the CTP Beta, only the AJAX.net 1.0 beta. If you used the Atlas Control Toolkit, you'll need to reinstall that too. You'll also have to update your pages to work with new new edition of the framework, but with just updatepanels, it won't be that hard.
Can some direct me to installation instructions page......please.

For install instructions, go to:

http://ajax.asp.net/docs/Overview/installing/default.aspx

For changes between ctp and beta, go to:

http://ajax.asp.net/files/AspNet_AJAX_CTP_to_Beta_Whitepaper.aspx?tabid=47

For a feature matrix of what is in each install, go to:

http://ajax.asp.net and click on Feautre Matrix in tabbed panels.