ASP.NET Discussion Boards

I am creating Ajax Draggable panels on Onclick event of a button but I'm facing problem while making the use of asp:AsyncPostBackTrigger viz.

1)When I use asp:AsyncPostBackTrigger control is created and retains its position but further on click event of button(aspx) newly created controls are not displayed but while debugging it shows that new controls(usercontrol) are being created.

2)If I don't use asp:AsyncPostBackTrigger then on every click of the Button(on <b>aspx</b> page) control(<b>usercontrol</b>) is being created and is also draggable but they are not retaining their positions.

<b>I'm doing all this stuff on the web form</b>

--<b>aspx page</b>--
<div>
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnablePartialRendering="true" ></cc1:ToolkitScriptManager>
<asp:Button ID="btn" runat="server" Text="Add" OnClick="btnAdd_OnClick" />
<asp:Panel ID="pnl_wrapper" runat="server"></asp:Panel>
</div>

--<b>aspx.cs</b>--
Dictionary<string, string> myControlList;
protected void Page_Load(object sender, EventArgs e)
{

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

if (!IsPostBack)
{
myControlList = new Dictionary<string, string>();
Session["myControlList"] = myControlList;
}
else
{
myControlList = (Dictionary<string, string>)Session["myControlList"];

foreach (var registeredControlID in myControlList.Keys)
{
UserControl controlToAdd = new UserControl();
controlToAdd = (UserControl)controlToAdd.LoadControl(myControlList[registeredControlID]);
controlToAdd.ID = registeredControlID;

pnl_wrapper.Controls.Add(controlToAdd);
}
}
}

protected void btnAdd_OnClick(object sender, EventArgs e)
{
UserControl controlToAdd = new UserControl();
controlToAdd = (UserControl)controlToAdd.LoadControl("ufinal.ascx");

controlToAdd.ID = Guid.NewGuid().ToString();
pnl_wrapper.Controls.Add(controlToAdd);
myControlList.Add(controlToAdd.ID, controlToAdd.AppRelativeVirtualPath);
}

--<b>.ascx</b>--
<asp:UpdatePanel runat="server" UpdateMode="Conditional">
<ContentTemplate>
<cc1:DragPanelExtender runat="server" TargetControlID="PnlContainer"
DragHandleID="PnlHeader">
</cc1:DragPanelExtender>
<div>
<asp:Panel ID="PnlContainer" runat="server" CssClass="dragContainer">
<asp:Panel ID="PnlHeader" runat="server" CssClass="dragHeader">
Click and Drag Here
</asp:Panel>
<asp:Panel ID="PnlDetail" runat="server" CssClass="dragDetail">
My name is Shashank<br />
</asp:Panel>
</asp:Panel>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn" />
</Triggers>
</asp:UpdatePanel>

<script type="text/javascript">
function setBodyHeightToContentHeight() {
document.body.style.height = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight) + "px";
}
setBodyHeightToContentHeight();
</script>

-- modified 4-Oct-12 4:28am.

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.