Sep 12, 2012, 3:04 PM
[CLOSED] Dynamic UserControls with DirectMethods
I have a problem in that UserControls are dynamically added to a page via a directevent on page load (listener in resourcemanager) which works and the controls are visible.
on every request the same controls with the same id's are made but not sent to the browser, i.e. not rendered, if X.IsAjaxRequest is true, so the direct methods should hit - and they did in Ext.net v1!
But with version 2 the problem is on the directevent of page load the Ext.net.DirectMethod.request wrappers are not created!! - the controls are sent down but not the wrappers meaning App.direct is undefined, if the user controls are added in the Page_Load the wrappers are made but then the controls are also rendered which we cant do due to the amount of controls - the page needs to load asap which is why we render the controls in a directevent.
Example code:
Default.aspx
App.direct.tstId is undefined
But if you run the javascript:
Ext.net.DirectMethod.request("click", { control: 'tstId' })
it works as you would expect! on the page load direct event Ext generates the following code:
Note: thread is duplicate of http://forums.ext.net/showthread.php...-DirectMethods as I didnt realise my premium support was activated - could the other thread be deleted?
on every request the same controls with the same id's are made but not sent to the browser, i.e. not rendered, if X.IsAjaxRequest is true, so the direct methods should hit - and they did in Ext.net v1!
But with version 2 the problem is on the directevent of page load the Ext.net.DirectMethod.request wrappers are not created!! - the controls are sent down but not the wrappers meaning App.direct is undefined, if the user controls are added in the Page_Load the wrappers are made but then the controls are also rendered which we cant do due to the amount of controls - the page needs to load asap which is why we render the controls in a directevent.
Example code:
Default.aspx
<%@ Page CodeBehind="~/Default.aspx.cs" AutoEventWireup="true" Language="C#" Inherits="ext2testapp.Default" %>
<%@ Register TagPrefix="test" TagName="Control" Src="~/testUc.ascx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<ext:ResourceManager ID="resMan" runat="server">
<DirectEvents>
<DocumentReady OnEvent="RenderUC" />
</DirectEvents>
</ext:ResourceManager>
<form id="Form1" runat="server">
<ext:Button runat="server" Text="Main Pace Click">
<Listeners>
<Click Handler="#{DirectMethods}.mainClick()" />
</Listeners>
</ext:Button>
<ext:Panel runat="server" ID="tstPnl" Cls="fixMe" Height="500" />
</form>
</body>
</html>
Default.aspx.cs: public partial class Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if(X.IsAjaxRequest)
addUC(false);
}
private void addUC(bool render)
{
testUc tst = (testUc)UserControlRenderer.LoadControl("~/testUc.ascx");
tst.ID = "tstId";
tstPnl.ContentControls.Add(tst);
if (render)
tstPnl.UpdateContent();
}
[DirectMethod]
public void mainClick(bool test)
{
X.Msg.Alert("Main Page Click", "event fired").Show();
}
protected void RenderUC(object sender, DirectEventArgs e)
{
tstPnl.UpdateContent();
}
}
testUc.ascx:<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="testUc.ascx.cs" Inherits="ext2testapp.testUc" %>
<ext:Button runat="server" Text="UC Click Me">
<Listeners>
<Click Handler="#{DirectMethods}.click()" />
</Listeners>
</ext:Button>
testUc.ascx.cs: public partial class testUc : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
}
[DirectMethod]
public void click()
{
X.Msg.Alert("UC Direct Event", "UC click fired").Show();
}
}
When you click the button in the user control you get a javascript error:App.direct.tstId is undefined
But if you run the javascript:
Ext.net.DirectMethod.request("click", { control: 'tstId' })
it works as you would expect! on the page load direct event Ext generates the following code:
{script:"Ext.net.replaceContent(App.tstPnl,\"tstPnl_Content\",[\"<div id=\\\"tstPnl_Content\\\" class=\\\"x-hidden\\\"><div id=\\\"id8084f0f6cb7f64e8_Container\\\"></div></div>\"].join(''));App.tstPnl.removeAll();Ext.create(\"Ext.button.Button\",{renderTo:\"id8084f0f6cb7f64e8_Container\",text:\"UC Click Me\",listeners:{click:{fn:function(item,e){App.direct.tstId.click()}}}});"}
but no direct methods, I've currently worked around this by using reflection to generate the wrappers myself for my user controls with X.AddScript and a very long string - which is pretty much what Ext SHOULD do and DID do in Ext 1, is there any better way to do this and make it work? or am i stuck to this nasty work around of generating the scripts myself?Note: thread is duplicate of http://forums.ext.net/showthread.php...-DirectMethods as I didnt realise my premium support was activated - could the other thread be deleted?
Last edited by Daniil; Sep 13, 2012 at 11:05 AM.
Reason: [CLOSED]