Linebreak appears after update panel submits

I wrote a control that would allow a user to click on a label, and then edit it the value, and send back the new value to the server via an update panel.

However, the first time the value is sent to the server, a line break appears right above the text box, i dont think this is a css error, i can't seem to figure out what is causing it by examining the DOM. This only appears in IE, not Firefox, Any ideas?

Here's the mark up for the Control

<%@dotnet.itags.org. Control Language="VB" AutoEventWireup="false" CodeFile="QuickEditLabel.ascx.vb" Inherits="QuickEditLabel" %><script type="text/javascript"> function<%=Me.hidCurrentFileId.ClientID%>updateNumber(param) { var hiddenField = document.getElementById("<%=hidCurrentFileId.ClientID%>"); hiddenField.value = param; __doPostBack('<%=hidCurrentFileId.ClientID%>',''); } function QuickEditSwap(hideMe, showMe) { showMe.style.display = 'none'; hideMe.style.display = 'inline'; }</script><asp:HiddenField ID="hidCurrentFileId" runat="server" Value="" /><asp:UpdatePanel ID="updPanel" UpdateMode="Conditional" runat="server"> <Triggers> <asp:AsyncPostBackTrigger ControlID="hidCurrentFileId" EventName="ValueChanged" /> </Triggers> <ContentTemplate>   <asp:Label ID="Label1" runat="server" CssClass="QuickEditText" ToolTip="Click to Edit"></asp:Label> <asp:TextBox ID="TextBox1" runat="server" CssClass="QuickEditTextBox" Width="93px"></asp:TextBox> </ContentTemplate></asp:UpdatePanel>

Here's the Code behind for the control

PartialClass QuickEditLabelInherits System.Web.UI.UserControlPrivate myTextAs String Public Property Text()Get Return myTextEnd Get Set(ByVal value) myText = valueEnd Set End Property Protected Sub Page_Load(ByVal senderAs Object,ByVal eAs System.EventArgs)Handles Me.LoadIf Not IsPostBackThen Me.Text ="33"Else Me.Text =Me.TextBox1.TextEnd If Me.TextBox1.Attributes.Add("onchange",Me.hidCurrentFileId.ClientID +"updateNumber(getElementById('" + Me.TextBox1.ClientID + "').value)") Me.Label1.Attributes.Add("onclick", "QuickEditSwap(getElementById('" + Me.TextBox1.ClientID + "'), getElementById('" + Me.Label1.ClientID + "'))")End Sub Protected Sub Page_PreRender(ByVal senderAs Object,ByVal eAs System.EventArgs)Handles Me.PreRenderMe.Label1.Text =Me.TextMe.TextBox1.Text =Me.TextEnd SubEnd Class

Here's the css i'm using for the control

 .QuickEditText {font-family: Verdana;} .QuickEditText:hover {text-decoration: underline; font-family: Verdana; cursor: pointer} .QuickEditTextBox {display: none; font-family:Verdana;}

Thanks in advance for any suggestions,

This is happening because of the default setting of the UpdatePanel's RenderMode property - which will render its contents into a <div> the first time. Try changing it to "Inline" so that it will instead render a <span> element.

Link Button as trigger not firing

So I have a link button that is created here...

 LinkButton hide =new LinkButton(); hide.Text ="(hide)"; hide.Click +=new EventHandler(this.hide_Click); hide.ID ="hide" + deviceID;

which is later added to a table cell which is added to a table row which is added to a table. This table is what my function returns (the functions basically builds the table)

From where the function is called I have this code to create a trigger using the linkbutton hide, then add that trigger to the update panel that i am putting the newley created table in...

 AsyncPostBackTrigger trig =new AsyncPostBackTrigger(); ((UpdatePanel)tempTable.Parent.Parent).ContentTemplateContainer.Controls.Add(childTable); trig.ControlID = childTable.Rows[0].Cells[1].Controls[1].UniqueID; trig.EventName ="Click"; ((UpdatePanel)childTable.Parent.Parent).Triggers.Add(trig);

I have tried making the controlID both the unique ID and just the ID and neither work. I know that my just for testing my hide_click function is simple...

private void hide_Click(object sender, EventArgs e) { txtOutput.Text ="IT WORKED!"; }

I know the hide_Click function works because i attached it to other buttons in other tables and it executes fine.

Does anyone know if I am doing something wrong because I cannot seem to figure this out.

Thanks

Hi,

what issue are you experiencing? A full postback instead of an async postback? Or the "IT WORKED!" text isn't displayed? In this case, did you put the Label inside an UpdatePanel?

There is no postback at all. The txtOuput is inside an update panel. It works fine when triggered from other buttons that were added to my page the same way I am adding my link button, but something is acting up. Im not sure if there is a problem with where I am adding the trigger so I am going to try defining the trigger at the same place in code as where I am defining the link button to see if that helps, but i doubt that will change anything.

Ok this is really starting to mess with my head. I have noticed now that when i click on my button, the textbox txtOutput refreshes, but still displays the text that was already there, instead of getting the text from the hide_Click function. This is weird though because when I point other buttons to my hide_Click function, they fire it perfectly and the text box updates. I am confussed

Hi,

Please refer to this:

http://ajax.asp.net/docs/mref/T_System_Web_UI_AsyncPostBackTrigger.aspx

Programmatically adding AsyncPostBackTrigger controls is not supported. Use the RegisterAsyncPostBackControl(Control) method of the ScriptManager control to programmatically register a postback control, and then call the Update() method of the UpdatePanel when the control posts back.

Please try as the above documentation described. If still fails, please post a self-sufficient repro.

great thanks, ill take a look. I was all excited because I was able to programatically add asyncpostback trigers to some update panels, I did this at the time the panels were being created and it worked fine, I guess there are some situations where it just doesnt work though.

so it turns out the trigger is working fine, the only problem is that my hide_Click event isnt being fired. I have had this problem before where having certain settings enabled for different controls cause the controls .click event not to work properly, now its just a matter of finding out what is causing this problem

link button inside update panel causes post back

I have a linkbutton inside the update panel. I registered it with AsyncPostBackTrigger, but when I click that link button, the whole page is refreshed instead of that update panel, what could I have gone wrong?

Check the EnablePartialRendering="true" of ScriptManager is et or not ?

Also check UpdateMode="Conditional" of UpdatePanel is set or not ?

Link Click refresh effect?

I got a master page and 2 content page.

the menu links are on the left content page.

How can i get refresh effect on the right content page when i click on the links on the left page?

http://code.google.com/webtoolkit/documentation/examples/kitchensink/demo.htmlHi,

one approach is to use theUpdatePaneltogether with theMultiViewcontrol.
Thanks very much,i got it.
sorry, can i get that kind of effect just click a link on the page without MultView?

eg. i put a link on the left content page. the right content page will refresh when i click the link?

Hi Joytony,

When you click the link, do you want to display a totally new page?? could you post the code you use for the links?

Greetings,

Dennis

Thanks Dennis,

This is the demo i did.

1 master page contain 2 links on it.
while i have 2 content page

~/Default2.aspx
~/Default3.aspx

How can i get the refresh effect in this model?

<%@. Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>"-//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">Untitled Page"server"> "form1" runat="server"> "scriptmanager1" EnablePartialRendering="true" runat="Server" /> "up1" runat="server">
 "HyperLink1" runat="server" NavigateUrl="~/Default2.aspx">HyperLink "HyperLink2" runat="server" NavigateUrl="~/Default3.aspx">HyperLink
 "ContentPlaceHolder1" runat="server">
 "Progress" runat="server"> Loading...

sorry, put the code again.

<form id="form1" runat="server"> <atlas:ScriptManager ID="scriptmanager1" EnablePartialRendering="true" runat="Server" /> <atlas:UpdatePanel ID="up1" runat="server"> <ContentTemplate> <div> <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/Default2.aspx">HyperLink</asp:HyperLink> <asp:HyperLink ID="HyperLink2" runat="server" NavigateUrl="~/Default3.aspx">HyperLink</asp:HyperLink> <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton> <asp:LinkButton ID="LinkButton2" runat="server">LinkButton</asp:LinkButton> </div> <div> <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder> </div> </ContentTemplate> </atlas:UpdatePanel> <atlas:UpdateProgress ID="Progress" runat="server"> <ProgressTemplate> Loading... </ProgressTemplate> </atlas:UpdateProgress> </form>

Hi JoyTony,

I don't think that its possible to open a new page in another frame without a full postback. (If this is want you want to achieve). I think that Atlas is useful when you want parts of a webpage to be updated not whole pages. I think that the suggestion above with the multiview is the only option. Is there a reason that you don't want to use multiview??

Greetings,

Dennis

Hi Again,

What is the reason that you put your buttons in the update panel? These controls shoudn't be updated right?

Regards

Hmm, it seems you're kinda misusing the concept., although I do see what you're trying to do i think. If I'm not mistaken you're trying to only get the non master portion to refresh, similar to what one would achieve using frames? If so, other than the fact that it's probably not going to work, your pages will not be picked up by search engines, which is really bad unless its an intranet site.

It would be real nice if ATLAS did solve the problem of same masterpage markup being sent back with every page though, but i guess with a well designed site that should be very minimal.

Nick

Thanks Dennis andnicksh.

The reason why i don't want to use multiple view is i've done many pages there.

I just leave it there at the moment untill we really want to change. Thanks.

LinkButton & UpdatePanel

I have dynamically added a linkbutton inside of an updatepanel. For some reason that I don't understand when I click on the linkbutton the entire page refreshes. I can't figure out why. It's in a content page which uses a master page. I've tried using Conditional & Always. I've tried adding anAsyncPostBackTrigger for the linkbutton Click, but no matter what the entire page refreshes. If I use a non-dynamically added linkbutton (see LinkButton1 below) it only updates the updatepanel. Any ideas?

Here are some code snippets:

<asp:UpdatePanel ID="FlyoutUpdate" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="pnlSingleCalItem" runat="server" Height="270px" Width="350px">
<asp:Label ID="lblDateHeader" runat="server" Text="test"></asp:Label>
<br /><br />
<table width="100%">
<tr><td align="left" style="background-color:#E6E7E8">
<asp:Label ID="lblCalTitle" Font-Bold="true" Font-Size="13px" Font-Names="Arial" ForeColor="#96B96E" runat="server" Text="Title"></asp:Label>
<br />
<asp:Label ID="lblCalLocation" runat="server" Font-Size="12px" Font-Names="Arial" ForeColor="#BA906C" Text="Location"></asp:Label></td></tr>
<tr><td align="left"><asp:TextBox BorderWidth="0px" BorderStyle="none" Font-Size="11px" Font-Names="Arial" ID="txtCalMessage" runat="server" Width="350px" Height="200px" TextMode="multiLine"></asp:TextBox></td></tr>
</table>
</asp:Panel>
<asp:Panel ID="pnlMultipleCalItems" runat="server" Height="270px" Width="350px">
<asp:Label ID="lblDateHeaderMulti" runat="server" Text="test"></asp:Label>
<br /><br />
<asp:Table ID="tblMultipleCalItems" BorderWidth="0px" BorderStyle="none" runat="server">
</asp:Table>
<br /><br />
<asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>
</asp:Panel>

</ContentTemplate>
</asp:UpdatePanel>

Dim hypAs New LinkButtonhyp.Text = varNameAddHandler hyp.Click,New EventHandler(AddressOf hyp_Click)hyp.Visible = varVisibleDim trAs New TableRow()Dim td1As New TableCell()td1.Controls.Add(hyp)Dim tblAs Tabletbl = pnlMultipleCalItems.FindControl("tblMultipleCalItems")tr.Cells.Add(td1)tbl.Rows.Add(tr)

Hi

When you add something to the page dynamically,you should add it everytime the page been posted back.

If you don't add it again when the page been Ayncpostbacked,the contorl is null,and it's click event handler method isn't executed.

Thanks

Hi Jim-Yu,

That is a good idea, but NO... LinkButton as a child control of a custom control causes a PostBack not a Callback. Here's some sample code the shows the bug in LinkButton. Put this custom control on an UpdatePanel and notice the "button" does a nice callback, and the "link" does a postback.

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;

namespace testing
{
/// <summary>
/// Summary description for Test
/// </summary>
public class Test : Control, INamingContainer
{
public Test()
{
//
// TODO: Add constructor logic here
//
}

protected override void CreateChildControls()
{
CreateThem();
base.CreateChildControls();
}

protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
}

private void CreateThem()
{
LinkButton lnk = new LinkButton();
lnk.Text = "link";
Button btn = new Button();
btn.Text = "button";

this.Controls.Add(btn);
this.Controls.Add(lnk);
}
}
}

Hincornillon,

Thank you for your feedback,

You can change your code to:

private void CreateThem()
{
LinkButton lnk = new LinkButton();
this.Controls.Add(lnk);
lnk.Text = "link";
ScriptManager.GetCurrent(this.Page).RegisterAsyncPostBackControl(lnk);

Button btn = new Button();
this.Controls.Add(btn);
btn.Text = "button";
// ScriptManager.GetCurrent(this.Page).RegisterAsyncPostBackControl(btn);
}

Best Regards

I'm afraid it's still not working. When I dynamically create the controls I'm putting them in a Session array. Then in page_init I'm re-generating them like this below. When I'm looping through the Request.Form, I never see the link button.

If Session("ServerControls")IsNotNothingThen
aServerControls =TryCast(Session("ServerControls"), ArrayList)
Else
aServerControls =New ArrayList()
EndIf

ForEach strAsStringIn aServerControls
Dim hypAsNew LinkButton
Dim hypNameAsString = str
hypName = Replace(hypName,"/","_")
hyp.Text = hypName
AddHandler hyp.Click,New EventHandler(AddressOf hyp_Click)
pnlMultipleCalItems.Controls.Add(hyp)
ScriptManager.GetCurrent(Me.Page).RegisterAsyncPostBackControl(hyp)
Next

'Detect what caused the postback
Dim obj
ForEach objIn Request.Form

Next

Since there is a limited amount of controls to create, I manually created them and am just setting them either visible or not. It was faster. Thanks for the help!

LinkButton plays "click sound" (postbacks the whole page?)

Hi,

This is my first post here at the ASP.NET forums and I'm not sure if I'm in the correct category, so please correct me if I'm wrong.

My question concerns the LinkButton when used with AJAX .NET 1.0 RC1. I have a GridView inside a UpdatePanel. Inside that GridView there are various controls, some of them LinkButtons. When I click, for example, a ImageButton the UpdatePanel refreshes without making any "click sound" (the sound that Internet Explorer plays when a new page is requested). However, if I click a LinkButton the click sound is played. Why is this? If I replace all LinkButtons with normal Buttons or ImageButtons no click sound is heard, so the issue seems related to the LinkButton only. Is this behavior by design, or am I doing something wrong? Is the whole page postbacked when I click a LinkButton even if it resides in an UpdatePanel?

Thanks in advance!

If you place a asp:LinkButton in a asp:UpdatePanel and specify asynchronous post back, there should not be the whole page postback.Try to google "Click Sound" of the asp:LinkButton for some ideas.Maybe this is caused by the designers, which there is sound when clicking a asp:LinkButton.

LinkButtons programmically added to updatepanel click event not firing

I have a conditional updatepanel with a multiview control inside. The first view displays a list of items in a table with a linkbutton next to each one created programmically with an eventhandler for the click event. The click event changes the multiview's active view to the next view to display controls for editing that item. The item table's content is first initialized in the OnLoad() function inside a if(!isPostback). I plan to eventually have a save button in the second view that will update the table's content after that. (ScriptManager EnablePartialRender = "true").

Ex:

for(int i = 0; i < itemcount; i++) { ... LinkButton itemedit = new LinkButton(); itemedit.Text = "Edit"; itemedit.Click += new EventHandler(itemedit_Click); table.Controls.Rows[i].Cells[1].Add(itemedit); ...}

When I view the page and click the linkbutton next to one of the items in the updatepanel it starts to update. However, the view never changes. Further tests have shown that the click event is never being handled. If I change the code so that the table is updated during initial load and postbacks, I can get the click event to fire once. After the multiview is goes back to the original view, the click event can no longer be raised until the whole page is reloaded.

So, what I am trying to figure out is how to create eventhandlers at runtime inside an updatepanel and getting them to fire on an update.

Well, I have found a solution. I desided to scale the problem down to the most basic functions by creating a test application containing an updatepanel, multiview control with two views, and some code in the background to create a linkbutton to switch from one view to the other. The page looks like this as generated by VS:

<%@. Page Language="C#" AutoEventWireup="true" CodeFile="dynamicevent.aspx.cs" Inherits="dynamicevent" %
<!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 runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<atlas:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="True">
</atlas:ScriptManager>

</div>
<atlas:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
view1</asp:View>
<asp:View ID="View2" runat="server">
view2</asp:View>
</asp:MultiView>
</ContentTemplate>
</atlas:UpdatePanel>
</form>
</body>
</html>

The page is pretty basic and so is the code behind:

public partialclass dynamicevent : System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e) { LinkButton button =new LinkButton(); button.Text ="switch"; button.Click +=new EventHandler(button_Click);this.View1.Controls.Add(button); }void button_Click(object sender, EventArgs e) {this.MultiView1.ActiveViewIndex = 1; }}

This code creates one LinkButton to switch from ActiveViewIndex=0 to 1 and it works just fine. However, on a larger scale, creating a hundred or more LinkButtons next to records that must be requested from a database each time the page handles a postback doesn't sound like a good idea to me. So, I moved by button creation code into an if(!IsPostBack) block:

protected void Page_Load(object sender, EventArgs e) {if (!this.IsPostBack) { LinkButton button =new LinkButton(); button.Text ="switch"; button.Click +=new EventHandler(button_Click);this.View1.Controls.Add(button); } }

The changes break the page. When I click the LinkButton, the updatepanel reloads the contents of the first view minus the linkbutton. The linkbutton is lost and its eventhandler with it. So, perhaps atlas requires that everything remain wired up perfectly up until after Page_Load() is called at least. I did some thinking and came up with some code that fixes the problem by using the cache to store the button to be rewired on the next postback. It appears that that is all the work I need to do to get my click handler to work. I think the benefits are significant enough although it is hard to see in this example: protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
LinkButton button =new LinkButton();
button.Text ="switch";
button.Click +=new EventHandler(button_Click);

this.View1.Controls.Add(button);
Cache.Insert("test", button);
}
else
{
((LinkButton)Cache["test"]).Click +=new EventHandler(button_Click);
this.FindControl(((LinkButton)Cache["test"]).Parent.UniqueID).Controls.Add(((LinkButton)Cache["test"]));
}
}

The code rewires the event handler during a postback. The Control.Parent .Controls.Add() does not work directly for the LinkButton in the cache but the FindControl() method works just fine. I believe that although they have the same name, the first parent of the LinkButton is not the same as the second one. I am new to ASP.NET v2 and Atlas but I do not remember coming across this problem in the past with .NET 1.1.

If anyone has a better solution, please let me know. At this moment I am facing writing some manager class to wire up all my eventhandlers on on each postback and I really would like a better way.

changed

this.FindControl(((LinkButton)Cache["test"]).Parent.UniqueID).Controls.Add(((LinkButton)Cache["test"]));

to

this.Controls.Add(((LinkButton)Cache["test"]));

and it works just fine. This means that it does not matter where the LinkButton is located, just that it is added back to the page.

Thanks a lot for the solution you posted. I have been facing the same problem and your solution worked for me. But, I wonder if there is some other solution to this issue. If I find any I will post it here.

Thanks again.

Yes, that's not specific to Atlas. Any control that's added dynamically to the control tree must be added back on every subsequent postback.

I came across another issue when I was working with this yesterday. What I saw was that after a few postbacks my dynamically added link buttons won't work in fact it threw an object required error. Reason, they were removed from the cache and hencethis.Controls.Add(((LinkButton)Cache["test"])); would not work.

So, I tried to check if the cache had the button in it and only then I would execute this statement else I would create new linkbuttons. But guess what, I got back to the same problem I started off with. The button would not fire the event.

In the solution we completely depend on the cache to make sure that the linkbuttons are wired to the respective events. What would happen when the buttons are removed from the cache for whatever reason, especially in a production environment?

Ok, I think I may have a solution for this...as bleroy indicated this is the default behavior with dynamically added controls (that you have to add them to the page on every postback). So, if you add the linkbuttons to the page on Page_Init instead of Page_Load, you will not have to worry about caching them in order to re-wire the controls with the events.

Let me know if this was helpful.

I'd like to respectfully point out that putting a control in the cache is a bad, bad, bad idea and you should never ever do it. One reason is that this maintains an in-memory reference to the instance of the control, hence to the corresponding instance of the page and thus to a huge object graph that should have been thrown away at the end of the request. There is no way this is not going to blow up whenever you get more than a few simultaneous requests.

You should only put data (that is, disconnected data) or output (i.e. strings) in cache...

List controls not refreshing in UpdatePanels

I'm trying to figure out why when I click Remove on any listbox the postback doesn't refresh the listbox to show the change. I thought that every updatepanel refreshes. If this is so, then why isn't my listbox automatically reloading the updated list after I remove an item? I end up having to refresh the whole page manually in order to see any removed items from my listboxes

<%@dotnet.itags.org. Control Language="vb" AutoEventWireup="false" CodeBehind="Main.ascx.vb" Inherits="xxxx" %>

<asp:scriptmanager id="ScriptManager1" runat="server" />

<table class="medium" border="0" cellpadding="0" cellspacing="0" width="100%">

<tr style="padding-left 5px;">

<!-- Left Content Bucket -->

<td valign="top">

<table align="left" border="0" cellpadding="0" cellspacing="2" width="100%">

<tr>

<td height="20"></td>

</tr>

<tr>

<td class="tableHdrBlack" colspan="2">

<asp:label id="GeneralInformationHeader" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Program" runat="server" />

</td>

<td align="left" valign="top">

<asp:dropdownlist id="ddlPrograms" runat="server" width="300px" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Cuent" runat="server" />

</td>

<td align="left" valign="top">

<asp:updatepanel id="CuentUpdatePanel" runat="server">

<contenttemplate>

<asp:listbox id="lbCuent" runat="server" width="214px" /><br />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="ApdCs" runat="server" />

</td>

<asp:updatepanel id="ApdCsUpdatepanel" runat="server">

<contenttemplate>

<td align="left" valign="top">

<asp:listbox id="lbApdCs" runat="server" width="214px" /><br />

<asp:button id="btnAddApdCs" runat="server" width="63px" />

<asp:button id="btnRemoveApdCs" runat="server" width="83px" />

</td>

</tr>

<asp:panel id="pnlAddApdCs" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddApdCs" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertApdCs" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

</contenttemplate>

</asp:updatepanel>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="FtyMang" runat="server" />

</td>

<td align="left" valign="top">

<asp:listbox id="lbFtyMang" runat="server" width="214px" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="lHDee" runat="server" />

</td>

<td align="left" valign="top">

<asp:updatepanel id="HDee" runat="server">

<contenttemplate>

<asp:listbox id="lbHDee" runat="server" width="214px" /><br />

<asp:button id="btnAddHDee" runat="server" width="63px" />

<asp:button id="btnRemoveHDee" runat="server" width="83px" />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<asp:panel id="pnlAddHDee" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddHDee" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertHDee" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Ces" runat="server"></asp:label>

</td>

<td align="left" valign="top">

<asp:updatepanel id="CesUpdatepanel" runat="server">

<contenttemplate>

<asp:listbox id="lbCes" runat="server" width="214px" /><br />

<asp:button id="btnAddCes" runat="server" width="63px" />

<asp:button id="btnRemoveCes" runat="server" width="83px" />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<asp:panel id="pnlAddCes" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddCes" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertCes" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

</table>

</td>

<td width="10px"></td>

<!-- Right Content Bucket -->

<td valign="top">

<asp:updatepanel id="FtyUpdatePanel" runat="server">

<contenttemplate>

<table align="left" border="0" cellpadding="0" cellspacing="2" width="100%">

<tr>

<td height="20"></td>

</tr>

<tr>

<td colspan="3" class="tableHdrBlack">

<asp:label id="FtyHeader" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" valign="top" colspan="3">

<asp:label id="RealName" runat="server" />

</td>

</tr>

<tr>

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblFirstName" runat="server" />

</td>

<td align="left">

<asp:textbox id="FirstName" runat="server" width="150px" />

</td>

<td>

<asp:label id="lblLastName" runat="server" />

</td>

<td align="left">

<asp:textbox id="LastName" runat="server" width="150px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" valign="top" colspan="3">

<asp:label id="Address" runat="server" />

</td>

</tr>

<tr>

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblFtyStreet" runat="server"></asp:label>

</td>

<td colspan="5">

<asp:textbox id="FtyStreet" runat="server" width="340px" />

</td>

</tr>

<tr>

<td align="right">

<asp:label id="lblFtyCity" runat="server"></asp:label>

</td>

<td width="20px">

<asp:textbox id="FtyCity" runat="server" width="100px" />

</td>

<td align="right" width="20px">

<asp:label id="lblFtyState" runat="server" />

</td>

<td>

<asp:dropdownlist id="FtyStateList" runat="server" width="50px" />

</td>

<td align="right">

<asp:label id="lblFtyZip" runat="server" />

</td>

<td align="right">

<asp:textbox id="FtyZip" runat="server" width="100px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr align="left">

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="Phone" runat="server" />

</td>

<td>

<asp:textbox id="AreaCode" runat="server" width="53px" />

-

<asp:textbox id="Prefix" runat="server" width="58px" />

-

<asp:textbox id="Suffix" runat="server" width="68px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" colspan="3" valign="top">

<asp:label id="Shipping" runat="server" />

</td>

</tr>

<tr>

<td>

</td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblShippingStreet" runat="server" />

</td>

<td colspan="5">

<asp:textbox id="ShippingStreet" runat="server" width="340px" />

</td>

</tr>

<tr>

<td align="right">

<asp:label id="lblShippingCity" runat="server" />

</td>

<td width="20px">

<asp:textbox id="ShippingCity" runat="server" width="126px" />

</td>

<td align="right" width="20px">

<asp:label id="lblShippingState" runat="server" />

</td>

<td>

<asp:dropdownlist id="ShippingStateList" runat="server" width="50px" />

</td>

<td align="right">

<asp:label id="lblShippingZip" runat="server" />

</td>

<td align="right">

<asp:textbox id="ShippingZip" runat="server" width="100px" />

</td>

</tr>

<tr>

<td height="10">

</td>

</tr><tr>

<td>

</td>

<td align="left">

<asp:button id="btnUpdateFPenalInfo" runat="server" width="60px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" class="tableHdrBlack" colspan="3">

<asp:label id="CouTauder" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td colspan="4">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td align="right" valign="top">

<asp:label id="LastCourse" runat="server" />

</td>

<td align="left" valign="top">

<asp:label id="LatSsionValue" runat="server"/>

</td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="LatSsion" runat="server" />

</td>

<td align="left" valign="top">

<asp:label id="LatSsionValue" runat="server" />

</td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="MisSeions" runat="server"/>

</td>

<td align="left">

<asp:label id="MisSeionsValue" runat="server" />

</td>

</tr>

<tr>

<td height="10">

</td>

</tr>

<tr>

<td align="left" valign="top">

<asp:label id="CourTt" runat="server" />

<br />

</td>

</tr>

<tr>

<td colspan="2">

<asp:gridview id="CourTtList" runat="server" />

</td>

</tr>

</table>

</td>

</tr>

</table>

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

</table>

Hello,

How do you get the data into the listbox? Try this:
for example the list box inside this updatePanel

<asp:updatepanel id="CuentUpdatePanel" runat="server">
<contenttemplate>
<asp:listbox id="lbCuent" runat="server" width="214px" /><br />
</contenttemplate>
</asp:updatepanel>

After you click Remove, for sure you have to call a function right? In that function, also call: CuentUpdatePanel.Update()
This will update the UpdatePanel ... and if your list box uses a ObjectDataSource ... example below

<asp:updatepanel id="CuentUpdatePanel" runat="server">
<contenttemplate>
<asp:listbox id="lbCuent" runat="server" DataSourceID="GetListITems" width="214px" /><br />
</contenttemplate>
</asp:updatepanel>

then in your function, you do this: lbCuent.Databind();

Hope it helps ... by the way, next time don't bother post all of your HTML in here, too much, waste your time. =) just the part that you have problem is enough already ... and the code behind that is related to it ... Cheers

The problem is that I didn't rebind my listbox after whatever event (insert, delete, etc.)

I didn't even have to call the .Update() manually, it all works fine now after the obvious missing rebind of my listbox controls

ListBox - SelectedIndexChanged Problem

I have a data bound ListBox. When I click on an item it fires the SelectedIndexChanged event like it should, however, NONE of the items are marked as 'selected' in the event method. Any ideas?

Doh! Found the solution! I was rebinding the data to the listbox on postback and apparently this is what was causing the problems. I wrapped the data binding code in an IF statement that executes if IsPostBack is false.

This might be good to know for others out there.

ListBox does not preserve selected items after using UpdatePanel

Hi there,

I have a ListBox with Multiple Selection feature. After I click the Button on the form, I should process the selected items in the ListBox. The code works fine but after I add the ListBox in an UpdatePanel, it does not preserve selected items.

Any suggestions?

Thanks,
Mosh

use hidden fields.
function addItemstoHiddenField(){
var lbPlantDest = document.getElementById("lbPlantDest");
var lbSalesDest = document.getElementById("lbSalesDest");
var lbPlantDest = document.getElementById("lbPlantSrc");
var lbSalesDest = document.getElementById("lbSalesSrc");
var hdnPlantAccess = document.getElementById('hdnPlantAccess');
var hdnSalesAccess = document.getElementById('hdnSalesAccess');
var hdnPlantAccess = document.getElementById('hdnSrcPlantAccess');
var hdnSalesAccess = document.getElementById('hdnSrcSalesAccess');
for (i = lbPlantDest.options.length - 1; i >= 0; i--) {
hdnPlantAccess.value = hdnPlantAccess.value + lbPlantDest.options[i].value + ',';
}
for (i = lbSalesDest.options.length - 1; i >= 0; i--) {
hdnSalesAccess.value = hdnSalesAccess.value + lbSalesDest.options[i].value + ',';
}
for (i = lbPlantSrc.options.length - 1; i >= 0; i--) {
hdnSrcPlantAccess.value = hdnSrcPlantAccess.value + lbPlantSrc.options[i].value + ',';
}
for (i = lbSalesSrc.options.length - 1; i >= 0; i--) {
hdnSrcSalesAccess.value = hdnSrcSalesAccess.value + lbSalesSrc.options[i].value + ',';
}
}

listbox ondblclick attribute

Hi

I am trying to invoke a listboxes double click attribute to utilize the Ajax.Net functionality.

I have a listbox in an UpdatePanel, and using the OnSelectedIndexChanged event I successfully perform client side actions using Ajax.
I now want to perform an action when a user double clicks on an item of the listbox. (remove this item)

I tried copying the OnSelectedIndexChanged attribute value generated by dot net and adding it through the code:

lbMyListBox.Attributes.Add("ondblclick","javascript:setTimeout('__doPostBack(\\'DoubleClick\\',\\'\\')', 0)");

This however keeps causing a page post back.
Is it possible to use the double click attribute?
I have searched everywhere without much luck

TIA

You will need to subclass the ListBox control and create the ondblclick event for postback usage... and remove the existing onSelectedIndexChanged event. This topic deals with fairly advanced .Net web control programming.

Here's an example that is quick and dirty... and does not fully take care of all possible scenarios.

public class MyListBox : ListBox, IPostBackEventHandler, IPostBackDataHandler {public event EventHandler OnDoubleClick;#region IPostBackEventHandler Membersvoid IPostBackEventHandler.RaisePostBackEvent(string eventArgument) {if (eventArgument =="ondblclick") {if (OnDoubleClick !=null)this.OnDoubleClick(this, EventArgs.Empty); } }#endregion protected override void OnPreRender(EventArgs e) {base.OnPreRender(e);this.Attributes.Add("ondblclick", Page.ClientScript.GetPostBackEventReference(this,"ondblclick")); }protected override void Render(HtmlTextWriter writer) {//Here we will remove the onchange event through string manipulation. StringWriter sw =new StringWriter(); HtmlTextWriter newWriter =new HtmlTextWriter(sw);base.Render(newWriter); sw.Flush();string html = sw.ToString();int indexofOnChg=html.IndexOf("onchange=\""); sw.Close(); html = html.Remove(indexofOnChg,html.IndexOf(" ", indexofOnChg) - indexofOnChg); writer.Write(html); } }

Thanks for your advice

Will give it a wirl

listsearch

I have put a list box search extender control on my page. It works great except for two things. First if I click in the list box it activates the index change and that may not be data field I wanted. Two when using the search option and I found the record I wanted. The record was highlighted and when I clicked on it nothing happens. I can click on other fields and the list box works great. I need some help.

when i select an item by the listseach the selecteditemchanged event doesn't works

Ajax ListSearchExtender does not force its targeted DropDownList to postback once the desired item has been selected.

You need to write a javascript to force the DropDownList to postback once it loses its focus.

I had the same problem and here's how I got around to it.

ASP

<asp:DropDownList ID="ddl_LocationID" runat="server" AutoPostBack="True" Width="200"

OnSelectedIndexChanged="ddl_LocationID_SelectedIndexChanged"

OnLoad="ddl_LocationID_Load"></asp:DropDownList>

Code Behind

protected void ddl_LocationID_Load(object sender, EventArgs e)
{
string script = ClientScript.GetPostBackEventReference(ddl_LocationID, "");
ddl_LocationID.Attributes.Add("onblur", script);
}

protected void ddl_LocationID_SelectedIndexChanged(object sender, EventArgs e)
{
// Do something when an item has been selected
}

Lonnie, try this:

HTML

<script type="text/javascript">function UpdateLabel(){var btn = $get("ctl00_MainContent_btnTest");if(btn != null) { btn.click(); }}</script><asp:UpdatePanel ID="ListBox_UpdatePanel" UpdateMode="Conditional" runat="server"><ContentTemplate><asp:ListBox ID="ListBox1" onclick="UpdateLabel();" runat="server"><asp:ListItem Text="Item 1" Value="1" Selected="true" /><asp:ListItem Text="Item 2" Value="2" /><asp:ListItem Text="Item 3" Value="3" /><asp:ListItem Text="Item 4" Value="4" /><asp:ListItem Text="Item 5" Value="5" /></asp:ListBox><asp:Label ID="lblItem" runat="server" /><asp:Button ID="btnTest" Text="Update Label" OnClick="UpdateLabel" runat="server" /><ajaxToolkit:ListSearchExtender ID="lseListBox1" TargetControlID="ListBox1" runat="server" /></ContentTemplate></asp:UpdatePanel>

Code Behind:

Protected Sub UpdateLabel(ByVal senderAs Object,ByVal eAs EventArgs)Me.lblItem.Text =Me.ListBox1.SelectedValueEnd Sub

fikreter, you need to put AutoPostBack="true" on your listbox:

Let me know if any of you need further help ...

The latest toolkit release containts an updated version of the ListSearch Extender which will fire an OnChange (and therefore postbacks) when the target List loses focus (if you Tab or click away), or if you hit Enter.

Regards,

Damian

ListSearchExtender and TAB

Hi

I am beginning to use the ListSearchExtender and it works but only if I press Enter or click with the mouse on selected item; when I the press the TAB and focus leaves the ListSearchExtender and goes to next control the ListSearchExtender returns to first item... must of the users uses the TAB to go to next field/control. How can the ListSearchExtender keep its selected value?

Any solutions?

Thanks!

/Staffan

to make the question a litte bit better; TAB functions well when I am NOT dropping down the dropdown i e it keeps selected value, but if I dropdown the dropdown and then types some valid characters and then press TAB it returns to first item?

Kind Regards

STaffan

Hi,

The item is remained selected when I press tab according to my test.

Please try this sample:

<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { DropDownList1.DataSource = this.GetWordListText(); DropDownList1.DataBind(); } //string script = ClientScript.GetPostBackEventReference(DropDownList1, ""); //DropDownList1.Attributes.Add("onblur", script); //DropDownList1.Attributes.Add("onchange", script); //Response.Write(DropDownList1.SelectedValue); } public string[] GetWordListText() { string[] tempWordListText = new string[] { "Alfa", "Alpha", "Bravo", "Charlie", "Delta", "Echo", "Foxtrot", "Golf", "Hotel", "India", "Juliett", "Juliet", "Kilo", "Lima", "Mike", "November", "Oscar", "Papa", "Quebec", "Romeo", "Sierra", "Tango", "Uniform", "Victor", "Whiskey", "X-ray", "Xray", "Yankee", "Zulu", "Zero", "Nadazero", "One", "Unaone", "Two", "Bissotwo", "Three", "Terrathree", "Four", "Kartefour", "Five", "Pantafive", "Six", "Soxisix", "Seven", "Setteseven", "Eight", "Oktoeight", "Nine", "Novenine" }; Array.Sort(tempWordListText); return tempWordListText; }</script><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> </div> <asp:DropDownList ID="DropDownList1" runat="server"> </asp:DropDownList> <ajaxToolkit:ListSearchExtender PromptPosition="Top" ID="ListSearchExtender1" runat="server" TargetControlID="DropDownList1"> </ajaxToolkit:ListSearchExtender> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> </form></body></html>

Hope this helps. If it doesn't, please provide a simple page without relying on any specific DataBase or class.

Hi!

When I am using your code and:

1. Click the downarrow to "downdrop"
2. When I see the beginning of the list and I am typing for example charli and then direct press TAB on my keyboard the dropdown selects Alfa.

?

Best Regards!

Staffan

Listview Bug?

I have this code, it runs when I click in a line of my ListView:

var ListViewParceiros = $object("ListViewParceiros");var ListViewBuscaParceiro = $object("ListViewBuscaParceiro");var iSelectedIndex = sender.control.get_dataContext().get_index(); ListViewParceiros.get_data().remove(ListViewParceiros.get_data().getItem(iSelectedIndex));

for example: if my listview has 6 lines and I delete the third line, the fifhty line (old sixty), remains with the (sender.control.get_dataContext().get_index() == 6) :(

Is this a bug or I need to do this on another way?

thanx

hello.

i remember reporting a bug with the selected index beeing set to 0...the situation you describe seems to be a bug...

Load a javascript file in an updatepanel

Ipresent the context to you. I have a project principal compound of anupdatepanel. When I click on a button, I filled my updatepanel with a"templatd control". This one appears well. This control haves embeddes resources (images + Javascript file). My problem is that my control charges only the images and not my Javascript file. When I use this control in a simple page, it works correctly. I think that it is impossible to charge a fileJavascript in a updatepanel. What do you think about it? Thank you inadvance for your answers.

Damien

Damien,

Personally what I would do as UpdatePanel makes a server request to do your processing in the postback server side, easier and cleaner, you already in the server, then why not. Putting javascript with the UpdatePanel, why? the UpdatePanel is to go to the server without the user to see the request, then just use that!

Makes sense?

Load Control. Need Advice.

Hello,

I have a page with a TreeView and a Panel.

I created 10 WebControls which are compiled into a dll library.

My TreeView has 10 nodes. When I click a node I want to show, in the panel, one of the 10 WebControls without refreshing the page.

How can I do this?

Thanks,

Miguel

Hi,

If UpdatePanel is ok for you, the folowing sample is quite similar to what you have described

http://www.couldbedone.com/downloads/DynamicallyCreatedControlsAjax.zip

-yuriy

hello.

here's an old post I've written about that subject:

http://msmvps.com/blogs/luisabreu/archive/2007/02/15/adding-controls-to-an-updatepanel-through-code.aspx

load page without refresh

at first excuse me if my english is bad

i need load pages without refresh page

for example in page a i click link (page b) now i want load page b without refresh page

You would want to use iframes or have user controls for every page. I have not used either, but saw various posts about doing that. It ends up getting very hacky though so we avoid that.

Loading asynchroneously a webcontent from a menu

Hi

I have a menu on a masterpage. I would like the webcontent asynchroneously loaded when I click on the menu

I placed anUpdatePanel on theWebContent and a trigger targeted on the Menu.MenuItemClick event.

This is the test code:

protectedoverridevoid OnPreInit(EventArgs e)

{

base.OnPreInit(e);MasterPage Master =this.MasterasMasterPage;

Microsoft.Web.UI.AsyncPostBackTrigger trigger =newAsyncPostBackTrigger();

trigger.ControlID = Master.MyMenuID;// get Menu.ID

trigger.EventName ="MenuItemClick";

this.UpdatePanel1.Triggers.Add(trigger);

}

But this does not work at all.

Is there any way to do this?

thank you

Hi,

Please refer to this documentation:

http://ajax.asp.net/docs/mref/T_System_Web_UI_AsyncPostBackTrigger.aspx

Programmatically adding AsyncPostBackTrigger controls is not supported. Use the RegisterAsyncPostBackControl(Control) method of the ScriptManager control to programmatically register a postback control, and then call the Update() method of the UpdatePanel when the control posts back.

Hope this helps.

loading page and click in any button

I am facing this problem lot , when page is downloading content and in between this user click on any link then we got error page.

and this error details insert in the database

System.Threading.ThreadAbortException: Thread was being aborted.
at System.Threading.Thread.AbortInternal()
at System.Threading.Thread.Abort(Object stateInfo)
at System.Web.HttpResponse.End()
at System.Web.HttpResponse.Redirect(String url, Boolean endResponse)
at System.Web.HttpResponse.Redirect(String url)
at framework_GacStore_OrderList.GetGACOrderList()
at framework_GacStore_OrderList.Page_Load(Object sender, EventArgs e)

Would you mind posting the code?

Hi pawan_mca03

I am afraid we cannot find out the exact root cause without further information .So I suggest that you'd better share your source code here. If your problem has been resolved , Sharing your work will be greatly appreciated.