Hi,
I applied the example to our test case. (When you open the window, load a grid that is contained in a tab)
To make controls reference, I used the ItemId property.
Attached the example:
BaseMasterPage.Master
<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<!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>
<asp:ContentPlaceHolder ID="TitleContent" runat="server" />
</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="/resources/css/ui.css" />
<ext:ResourcePlaceHolder runat="server" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server" />
</head>
<body>
<ext:ResourceManager ID="resManager" runat="server" ViewStateMode="Disabled" InitScriptMode="Inline" />
<div>
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
</div>
</body>
</html>
Index.aspx
<%@ Page Language="C#" MasterPageFile="~/Views/Shared/BaseMasterPage.Master" Inherits="System.Web.Mvc.ViewPage" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<asp:Content ID="TitleContent" ContentPlaceHolderID="TitleContent" runat="server">
Sample Project - Details
</asp:Content>
<asp:Content ID="HeadContent" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
Ext.ns("Framework");
top.Framework = {
finishLoadGridPanel1: false,
finishLoadGridPanel2: true,
resolveUrl: function ResolveUrl(url) {
var appPath = '<%= Request.ApplicationPath %>';
if (appPath == "/")
return url;
else
return '<%= Request.ApplicationPath %>' + url;
},
openWindow: function () {
top.Trace = new Array();
top.Trace['StartOpenDetail'] = new Date();
Ext.Ajax.request({
url: top.Framework.resolveUrl('/Sample/Sample/Details'),
method: 'GET',
success: function (result, request) {
eval(result.responseText);
},
failure: function (result, request) {
debugger;
alert('error');
}
});
},
loadDetailsFormRecords: function (App, record) {
for (var field in record.data)
App[field].setValue(record.data[field]);
},
insertCustomRecords: function (store, prefix) {
top.Trace['StartInsertCustomRecords' + prefix] = new Date();
var records = new Array();
for (var i = 0; i < 50; i++) {
records[i] = {
SampleId: i + 200,
PropertyType: 'Item ' + i,
Data1: new Date().toString(),
Data2: new Date().toString(),
Data3: new Date().toString(),
Data4: new Date().toString(),
Data5: new Date().toString()
};
}
store.suspendEvents(true);
store.insert(0, records);
store.resumeEvents();
top.Trace['StopInsertCustomRecords' + prefix] = new Date();
},
showTrace: function () {
if (top.Framework.finishLoadGridPanel1 && top.Framework.finishLoadGridPanel2) {
var strReturn = '';
var lastProperty = null;
top.Trace.sort();
for (var property in top.Trace) {
if (Ext.isEmpty(lastProperty))
strReturn = strReturn + property.toString() + ' -> ' + Ext.Date.format(top.Trace[property], 'H:i:s.u') + '<br/>';
else {
var offset = top.Trace[property] - top.Trace[lastProperty];
strReturn = strReturn + property.toString() + ' -> ' + Ext.Date.format(top.Trace[property], 'H:i:s.u') + ' (+' + offset + 'ms) <br/>';
}
lastProperty = property;
}
var offsetTotal = top.Trace[lastProperty] - top.Trace.StartOpenDetail;
strReturn = strReturn + '<u>Total:</u> <b>' + offsetTotal + 'ms</b>';
Ext.Msg.show({
title: 'Trace',
msg: strReturn,
buttons: Ext.Msg.OK,
icon: Ext.Msg.INFO
});
}
}
};
</script>
</asp:Content>
<asp:Content ID="MainContent" ContentPlaceHolderID="MainContent" runat="server">
<ext:Viewport runat="server" Layout="HBoxLayout">
<Content>
</Content>
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Middle" Pack="Center">
</ext:HBoxLayoutConfig>
</LayoutConfig>
<Items>
<ext:Button runat="server" Text="Open Detail">
<Listeners>
<Click Handler="top.Framework.openWindow();" />
</Listeners>
</ext:Button>
</Items>
</ext:Viewport>
</asp:Content>
Details.ascx
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<List<Presentation.Web.MVC.Client.Areas.Sample.ViewModels.VMSample>>" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Register Src="~/Views/Shared/Tab.ascx" TagName="Tab1"
TagPrefix="CustomControls" %>
<ext:Window runat="server" Layout="FitLayout" Title="Details Window" Width="800" Height="600" IDMode="Client">
<Items>
<ext:Panel runat="server" Layout="FitLayout">
<Bin>
<ext:Store ItemID="dsDetails" runat="server" ShowWarningOnFailure="false" DataSource="<%# ((List<Presentation.Web.MVC.Client.Areas.Sample.ViewModels.VMSample>)Model).ToList() %>">
<Model>
<ext:Model runat="server" IDProperty="SampleId">
<Fields>
<ext:ModelField Name="SampleId" Type="Int" SortDir="ASC" />
<ext:ModelField Name="PropertyName" Type="String" />
<ext:ModelField Name="Data1" Type="String" />
<ext:ModelField Name="Data2" Type="String" />
<ext:ModelField Name="Data3" Type="String" />
<ext:ModelField Name="Data4" Type="String" />
<ext:ModelField Name="Data5" Type="String" />
</Fields>
</ext:Model>
</Model>
<Listeners>
<Load Handler="top.Framework.loadDetailsFormRecords(App, records[0]);" Delay="10" />
</Listeners>
</ext:Store>
</Bin>
<Items>
<ext:Panel ID="BorderLayoutMain" runat="server" Layout="BorderLayout">
<Items>
<ext:Panel runat="server" Region="North" Height="55">
<TopBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button runat="server" Text="Text">
<Menu>
<ext:Menu runat="server">
<Items>
<ext:MenuItem Text="Text" Icon="Add">
<ToolTips>
<ext:ToolTip runat="server" Html="Tooltip" />
</ToolTips>
</ext:MenuItem>
<ext:MenuItem Text="Text" Icon="Add" />
<ext:MenuSeparator />
<ext:MenuItem Text="Text" Icon="Disk" />
<ext:MenuItem Text="Text" Icon="Delete" />
<ext:MenuSeparator />
<ext:MenuItem Text="Text" Icon="DoorIn" />
</Items>
</ext:Menu>
</Menu>
</ext:Button>
<ext:Button runat="server" Text="Text">
<Menu>
<ext:Menu runat="server">
<Items>
<ext:MenuItem Text="Text" Icon="Exclamation" />
</Items>
</ext:Menu>
</Menu>
</ext:Button>
<ext:Button runat="server" Text="Text">
<Menu>
<ext:Menu runat="server">
<Items>
<ext:MenuItem Text="Text" Icon="Reload" />
</Items>
</ext:Menu>
</Menu>
</ext:Button>
<ext:Button runat="server" Text="Text">
<Menu>
<ext:Menu runat="server">
<Items>
<ext:MenuItem Text="Text" Icon="PageFind" />
<ext:MenuSeparator />
<ext:MenuItem Text="Text" Icon="CalendarViewWeek" />
<ext:MenuItem Text="Text" Icon="CalendarStar" />
<ext:MenuItem Text="Text" Icon="CalendarViewDay" />
</Items>
</ext:Menu>
</Menu>
</ext:Button>
<ext:Button runat="server" Text="Text">
<Menu>
<ext:Menu runat="server">
<Items>
<ext:MenuItem Text="Text" />
<ext:MenuSeparator />
<ext:MenuItem Text="Text" />
</Items>
</ext:Menu>
</Menu>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<Items>
<ext:Toolbar runat="server">
<Items>
<ext:SplitButton runat="server" Icon="Add" ToolTip="Tooltip">
<Menu>
<ext:Menu runat="server">
<Items>
<ext:MenuItem runat="server" Text="Text" Icon="Add" />
<ext:MenuItem Text="Text" Icon="Add" />
</Items>
</ext:Menu>
</Menu>
</ext:SplitButton>
<ext:Button runat="server" Icon="Disk" ToolTip="Tooltip" />
<ext:Button runat="server" Icon="Delete" ToolTip="Tooltip" />
<ext:ToolbarSeparator />
<ext:Button runat="server" Icon="PageFind" ToolTip="Tooltip" />
<ext:ToolbarSeparator />
<ext:Button runat="server" Icon="CalendarViewWeek" ToolTip="Tooltip" />
<ext:Button runat="server" Icon="CalendarStar" ToolTip="Tooltip" />
<ext:Button runat="server" Icon="CalendarViewDay" ToolTip="Tooltip" />
<ext:ToolbarSeparator />
<ext:Button runat="server" Icon="DoorIn" ToolTip="Tooltip" />
</Items>
</ext:Toolbar>
</Items>
</ext:Panel>
<ext:Panel runat="server" Region="Center" Layout="BorderLayout">
<Items>
<ext:FormPanel ItemID="DetailsForm" runat="server" Url='<%# Url.Action("Save") %>' Border="false"
LabelSeparator=":" LabelAlign="Top" AutoDataBind="true" LabelWidth="110" TrackResetOnLoad="true"
Frame="true" Region="North" Height="75" Layout="HBoxLayout" IDMode="Static">
<Defaults>
<ext:Parameter Name="labelAlign" Value="top" Mode="Value" />
<ext:Parameter Name="margins" Value="5" Mode="Raw" />
</Defaults>
<Items>
<ext:TextField ItemID="SampleId" runat="server" FieldLabel="SampleId" MaxLength="20"
AllowBlank="false" Width="200" />
<ext:TextField ItemID="PropertyName" runat="server" FieldLabel="PropertyName" MaxLength="20"
AllowBlank="false" Width="200" />
<ext:TextField ItemID="Data1" runat="server" FieldLabel="Data1" MaxLength="20" AllowBlank="false"
Width="200" />
<ext:TextField ItemID="Data2" runat="server" FieldLabel="Data2" MaxLength="20" AllowBlank="false"
Width="200" />
<ext:TextField ItemID="Data3" runat="server" FieldLabel="Data3" MaxLength="20" AllowBlank="false"
Width="200" />
<ext:TextField ItemID="Data4" runat="server" FieldLabel="Data4" MaxLength="20" AllowBlank="false"
Width="200" />
<ext:TextField ItemID="Data5" runat="server" FieldLabel="Data5" MaxLength="20" AllowBlank="false"
Width="200" />
</Items>
</ext:FormPanel>
<ext:TabPanel ItemID="mainTabPanel" runat="server" Border="false" Region="Center" DeferredRender="false">
<Items>
<ext:Panel ItemID="tab1" runat="server" Border="false" Title="Tab1" Layout="FitLayout">
<Content>
<CustomControls:Tab1 runat="server" />
</Content>
<Listeners>
<BeforeRender Handler="top.Trace['StartOpenTab'] = new Date();" />
</Listeners>
</ext:Panel>
</Items>
</ext:TabPanel>
</Items>
</ext:Panel>
<ext:PagingToolbar runat="server" StoreID="dsDetails" Region="South" />
</Items>
</ext:Panel>
</Items>
</ext:Panel>
</Items>
<Listeners>
<AfterRender Handler="top.Trace['StopOpenDetail'] = new Date();" />
</Listeners>
</ext:Window>
Tab.ascx
<%@ Control Language="C#" Inherits="Presentation.Web.MVC.Client.Helpers.Controls.Tab1" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:Panel runat="server" Layout="HBoxLayout" Margins="5">
<Items>
<ext:GridPanel runat="server" Flex="1" AutoScroll="true">
<Store>
<ext:Store runat="server" AutoLoad="true" ShowWarningOnFailure="false" WarningOnDirty="false"
RemoteSort="false" TabIndex="-1">
<Proxy>
<ext:AjaxProxy Url='/Sample/Sample/List'>
<Reader>
<ext:JsonReader IDProperty="SampleId" Root="data" TotalProperty="totalCount" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model runat="server" IDProperty="SampleId" Root="data" TotalProperty="totalCount">
<Fields>
<ext:ModelField Name="SampleId" Type="Int" />
<ext:ModelField Name="PropertyName" Type="String" />
<ext:ModelField Name="Data1" Type="String" />
<ext:ModelField Name="Data2" Type="String" />
<ext:ModelField Name="Data3" Type="String" />
<ext:ModelField Name="Data4" Type="String" />
<ext:ModelField Name="Data5" Type="String" />
</Fields>
</ext:Model>
</Model>
<Sorters>
<ext:DataSorter Property="FechaInicioAnotacionAgenda" Direction="DESC" />
</Sorters>
<Listeners>
<BeforeLoad Handler="top.Trace['StartStoreGridPanel1'] = new Date();" />
<Load Handler="
top.Trace['StopStoreGridPanel1'] = new Date();
top.Framework.finishLoadGridPanel1 = true;
/*top.Framework.insertCustomRecords(this, 'GridPanel1'); */
top.Framework.showTrace();" Delay="10" />
</Listeners>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" DataIndex="SampleId" Text="SampleId">
<Renderer Handler="return Ext.util.Format.htmlEncode(value);" />
</ext:Column>
<ext:Column runat="server" DataIndex="PropertyName" Text="PropertyName">
<Renderer Handler="return Ext.util.Format.htmlEncode(value);" />
</ext:Column>
<ext:Column runat="server" DataIndex="Data1" Text="Data1" Width="75">
<Renderer Handler="return Ext.util.Format.htmlEncode(value);" />
</ext:Column>
<ext:Column runat="server" DataIndex="Data2" Text="Data2" Width="75">
<Renderer Handler="return Ext.util.Format.htmlEncode(value);" />
</ext:Column>
<ext:Column runat="server" DataIndex="Data3" Text="Data3" Width="75">
<Renderer Handler="return Ext.util.Format.htmlEncode(value);" />
</ext:Column>
<ext:Column runat="server" DataIndex="Data4" Text="Data4" Width="75">
<Renderer Handler="return Ext.util.Format.htmlEncode(value);" />
</ext:Column>
<ext:Column runat="server" DataIndex="Data5" Text="Data5" Width="75">
<Renderer Handler="return Ext.util.Format.htmlEncode(value);" />
</ext:Column>
</Columns>
</ColumnModel>
<View>
<ext:GridView runat="server" MarkDirty="false" TrackOver="true" StripeRows="true"
LoadMask="false" LoadingUseMsg="false" TabIndex="-1" />
</View>
<SelectionModel>
<ext:RowSelectionModel Mode="Single" runat="server" />
</SelectionModel>
<Listeners>
<AfterRender Handler="top.Trace['StopOpenTab'] = new Date();" />
</Listeners>
</ext:GridPanel>
</Items>
</ext:Panel>
SampleController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Presentation.Web.MVC.Client.Areas.Sample.ViewModels;
using Ext.Net.MVC;
namespace Presentation.Web.MVC.Client.Areas.Sample.Controllers
{
public class SampleController : Controller
{
public ActionResult Details()
{
var entity = new VMSample
{
SampleId = 0,
PropertyName = "Sample Details Window Text",
Data1 = Guid.NewGuid().ToString(),
Data2 = Guid.NewGuid().ToString(),
Data3 = Guid.NewGuid().ToString(),
Data4 = Guid.NewGuid().ToString(),
Data5 = Guid.NewGuid().ToString()
};
var list = new List<VMSample>();
list.Add(entity);
var partialViewResult = this.PartialExtView(list);
partialViewResult.WrapByScriptTag = false;
return partialViewResult;
}
public ActionResult Tab(string containerId)
{
var partialViewResult = new Ext.Net.MVC.PartialViewResult(containerId, Ext.Net.RenderMode.AddTo);
partialViewResult.WrapByScriptTag = false;
partialViewResult.SingleControl = true;
return partialViewResult;
}
public ActionResult List()
{
var listVMSample = new List<VMSample>();
for (var i = 1; i < 100; i++)
{
listVMSample.Add(new VMSample
{
SampleId = i,
PropertyName = "Item " + i.ToString(),
Data1 = Guid.NewGuid().ToString(),
Data2 = Guid.NewGuid().ToString(),
Data3 = Guid.NewGuid().ToString(),
Data4 = Guid.NewGuid().ToString(),
Data5 = Guid.NewGuid().ToString()
});
}
return new StoreResult(listVMSample, listVMSample.Count);
}
}
}
VMSample.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace Presentation.Web.MVC.Client.Areas.Sample.ViewModels
{
public class VMSample
{
public int SampleId { get; set; }
public string PropertyName { get; set; }
public string Data1 { get; set; }
public string Data2 { get; set; }
public string Data3 { get; set; }
public string Data4 { get; set; }
public string Data5 { get; set; }
}
}
In our real application, all references to the controls are undertaken by the Id property and detail windows loaded by iframes.
Would there be any way to prevent migration of the Id property ItemId property? Or an alternative to obtaining or controls through ItemId Id?
Thanks,