PDA

View Full Version : [CLOSED] General Question on Script Resources/Snippets Dynamic Linked In



cleve
Apr 15, 2013, 6:58 AM
Hi guys,

I just saw a plug-in from sencha
http://www.sencha.com/forum/showthread.php?133438-4.x-Ext.ux.Bootstrap,
a code supports dynamic linked-in of JS resources.
Can this stuff be used to separate ExtJS object creations?
So far as I observed, Ext.net.ResourceMgr.init(...) is the one responsible for all docked server objects and make sure they are created once page is loaded, by injecting pretty long JS snippet.
I randomly search on this issue, looks like what we so far promoted is to separate stuff into "ASCX" and let loader do the script injection. Can I have some more flexible ways to make use of the creation engine. For example, can I harvest the init snippet and temporarily save it to a JS file together with business logic (js script) and let bootstrap add them dynamically?

Any comments?

Daniil
Apr 15, 2013, 9:04 AM
Hi @cleve,

I am not sure that I got the requirement well, but, maybe, you need this.
http://forums.ext.net/showthread.php?20892#post90513

cleve
Apr 16, 2013, 12:58 PM
Hi @cleve,

I am not sure that I got the requirement well, but, maybe, you need this.
http://forums.ext.net/showthread.php?20892#post90513

Partly it's related. I narrowed down the scope of my question and found it had been discussed on "iframe" usage performance and alternative approaches had been proposed.
I bought the one "partialview" for MVC. Here's comes my specific question:


(Page to 1. inject and then 2. show injected object.)



<%@ Page Language="C#" %>
<!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">
<head runat="server" id="theHead">
<script type="text/javascript" src="/scripts/ext/coolite.js"></script>
</head>
<body id="theBody">
<ext:ResourceManager ID="theManager" runat="server"
ShowWarningOnAjaxFailure="false"
DirectMethodProxy="Ignore"
ScriptMode="Debug" />
<ext:Button runat="server" Text="1 - Inject">
<DirectEvents>
<Click Url="/test.aspx/test1" />
</DirectEvents>
</ext:Button>
<ext:Button runat="server" Text="2 - Show">
<Listeners>
<Click Handler="X.getCmp('c_UC_win').show();" />
</Listeners>
</ext:Button>
</body>
</html>




(Control1.ascx with some random objects. Window is my focus because it's hidden and show on forthcoming demand)




<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<string>" EnableViewState="false" ClientIDMode="Static" %>
<ext:Window runat="server" ID="win" Hidden="true">
<TopBar>
<ext:Toolbar runat="server" ID="tb">
<Items>
<ext:Button runat="server" ID="b" Text="A" />
</Items>
</ext:Toolbar>
</TopBar>
<Items>
<ext:Label runat="server" ID="lab" />
</Items>
</ext:Window>
<script type="text/javascript">


var F_<%= ClientID %> = function () {
window.alert('aha!');
}
</script>
<script runat="server">


protected override void OnInit(EventArgs e)
{
base.OnInit(e);
lab.Text = Model;
b.Listeners.Click.Handler = string.Format("F_{0}();", ClientID);
}


</script>



(Some mvc methods)




public ActionResult Index()
{
return View(@"~/test/index.aspx");
}


public ActionResult Test1()
{
WebFormViewEngine eng = this.ViewEngineCollection[0] as WebFormViewEngine;
IView v = eng.FindPartialView(this.ControllerContext, "~/test/control1.ascx", false).View;
Ext.Net.MVC.PartialViewResult r = new Ext.Net.MVC.PartialViewResult();
r.View = v;
//r.SingleControl = true;
r.RenderMode = RenderMode.RenderTo;
r.ControlId = "c";
r.Model = "ABC";
r.IDMode = IDMode.Predictable;
//r.WrapByScriptTag = false;
return r;
}




I have the following issues:
1. Can Ext.Net.MVC.PartialView class have two extra constructor parameters "viewName" and "model"? They'll make it look more compatible with the controller method PartialView();
2. I am still looking for a better way to gain control of particular objects injected. For example, in afore example, button "2 - show" has a very unusual method "X.getCmp('c_UC_win')" . ID 'c_UC_win' doesn't have a clue how it comes. I just decoded it by observing the generated code trunk. Can you guys provide some more explanations for where those ids come from? and give me some guidelines how to make my accessing to those objects easier?

Here's the code generated by partialview



<script type="text/javascript">Ext.onReady(function(){Ext.net.append(Ext.net.getE l(Ext.getBody()),["<div id=\"c_Content\" class=\"x-hidden\">","<script type=\"text/javascript\">"," var F_c_UC = function () {"," window.alert('aha!');"," }","<\/script>","</div>"].join(''));Ext.net.ResourceMgr.destroyCmp("App.__Page_c");Ext.create("Ext.container.Container",{id:"1_c",border:false,renderTo:Ext.getBody(),contentEl:"c_Content"});Ext.create("Ext.window.Window",{id:"c_UC_win",renderTo:Ext.getBody(),width:200,items:[{id:"c_UC_lab",xtype:"netlabel",text:"ABC"}],tbar:{id:"c_UC_tb",xtype:"toolbar",items:[{id:"c_UC_b",text:"A",listeners:{click:{fn:function(item,e){F_c_UC();}} }}]}});});</script>



Thanks.

Daniil
Apr 16, 2013, 4:29 PM
1. Can Ext.Net.MVC.PartialView class have two extra constructor parameters "viewName" and "model"? They'll make it look more compatible with the controller method PartialView();


Thank you for the suggestion. We will discuss adding such constructors for the PartialViewResult class.

Please note that there is the PartialExtView class. It is an extension method for a controller within the Ext.Net.MVC namespace.

Example

return this.PartialExtView("viewName", modelObject);



2. I am still looking for a better way to gain control of particular objects injected. For example, in afore example, button "2 - show" has a very unusual method "X.getCmp('c_UC_win')" . ID 'c_UC_win' doesn't have a clue how it comes. I just decoded it by observing the generated code trunk. Can you guys provide some more explanations for where those ids come from? and give me some guidelines how to make my accessing to those objects easier?


Ok, the id is "c_UC_win".

The "c" comes from

r.ControlId = "c";

"_UC" is a standard postfix for a ViewUserControl.

"win" comes from:

<ext:Window runat="server" ID="win" ...

The Window's id is prefixed with its parent control's id (a ViewUserControl's id) according to:

r.IDMode = IDMode.Predictable;

The simplest way to access a Window is IDMode.Static. A Window's client id will be equal its server ID.

So, you will be able to access it using:

App.win
or

Ext.getCmp("win")

So, it is appropriate only if you are going to render a single partial view (and, respectively, have a single Window on the page). Otherwise, there will be an id conflict (i.e. two same ids) with unpredictable behavior.

If you need to have several partial views (i.e. Windows) on the page, you should care about an uniqueness of ids.

Hope this helps.

cleve
Apr 17, 2013, 2:04 AM
Thanks for the explanation Daniil. It's clear now.

Daniil
Apr 18, 2013, 5:09 AM
1. Can Ext.Net.MVC.PartialView class have two extra constructor parameters "viewName" and "model"? They'll make it look more compatible with the controller method PartialView();


Thank you for the suggestion. We will discuss adding such constructors for the PartialViewResult class.


We leave as it is for now. You can always initialize a PartialViewResult instance using {}.

new PartialViewResult() { /* initialize properties here */}

Also, as I mentioned, there is the extension PartialExtView method which meats the signatures of the native PartialView method.

Anyway, thank you for the suggestion. We will bear it in mind.