PDA

View Full Version : [CLOSED] Panel Show event not fired



feanor91
May 02, 2012, 2:04 PM
Hello

Look at that code :


<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>


<script runat="server">
protected void Page_Load(object sender,EventArgs e)
{
// Load the data into the Store and DataBind.
this.stoChartsName.DataSource = this.stoChartsNameData;
this.stoChartsName.DataBind();
this.stoChartsTemplate.DataSource = this.stoChartsTemplateData;
this.stoChartsTemplate.DataBind();
}

private object[] stoChartsNameData
{
get
{
return new object[]
{
new object[] {12,"Abandon rate"},
new object[] {11,"Activity time split"},
new object[] {16,"Average handle time"},
new object[] {17,"Average seconds to answer"},
new object[] {22,"Back order value"},
new object[] {14,"Cost per contact"},
new object[] {24,"Costs (Transport & Waehouse)"},
new object[] {20,"Delivery attempt"},
new object[] {3,"ETFQ"},
new object[] {2,"ETTR"},
new object[] {13,"First call resolution"},
new object[] {23,"Inventory days"},
new object[] {25,"Inventory value"},
new object[] {15,"Occupancy"},
new object[] {6,"OOBF"},
new object[] {18,"Orders"},
new object[] {19,"Parcels shipped"},
new object[] {21,"Product driving back order"},
new object[] {9,"Product split"},
new object[] {1,"Repair by month"},
new object[] {4,"Repair cost"},
new object[] {5,"Stock out"},
new object[] {10,"Type of repair split"},
new object[] {7,"User requests calls & mail"},
new object[] {8,"User requests letters & fax"}
};
}
}


private object[] stoChartsTemplateData
{
get
{
return new object[]
{
new object[] {1,"Service","Activity time split,ETFQ,ETTR,OOBF,Product split,Repair by month,Repair cost,Stock out,Type of repair split,User requests calls & mail,User requests letters & fax",new int[] { 11, 3, 2, 6, 9, 1, 4, 5, 10, 7, 8 },false,20},
new object[] {2,"Logistic","Back order value,Costs (Transport & Warehouse),Delivery attempt,Inventory days,Inventory value,Orders,Parcels shipped,Product driving back order",new int[] {22,24,20,23,25,18,19,21},false,20},
new object[] {3,"Service & Logistic","Activity time split,ETFQ,ETTR,OOBF,Product split,Repair by month,Repair cost,Stock out,Type of repair split,User requests calls & mail,User requests letters & fax,Back order value,Costs (Transport & Waehouse),Delivery attempt,Inventory days,Inventory value,Orders,Parcels shipped,Product driving back order",new int[] {11,3,2,6,9,1,4,5,10,7,8,22,24,20,23,25,18,19,21}, false,20},
new object[] {4,"Call center","Abandon rate,Average handle time,Average seconds to answer,Cost per contact,First call resolution,Occupancy",new int[] {12,16,17,14,13,15},false,20},
new object[] {6,"All charts","Abandon rate,Activity time split,Average handle time,Average seconds to answer,Back order value,Cost per contact,Costs (Transport & Warehouse),Delivery attempt,ETFQ,ETTR,First call resolution,Inventory days,Inventory value,Occupancy,OOBF,Orders,Parcels shipped,Product driving back order,Product split,Repair by month,Repair cost,Stock out,Type of repair split,User requests calls & mail,User requests letters & fax",new int[] {12,11,16,17,22,14,24,20,3,2,13,23,25,15,6,18,19,2 1,9,1,4,5,10,7,8},false,20}
};
}
}


protected void btnDelTemplate_Click(object sender,EventArgs e)
{
X.Msg.Alert("DEL", "Del Button").Show();
}

protected void UpdateTemplate(object sender,EventArgs e)
{
X.Msg.Alert("ValidatEdit", "Validate edit").Show();
}

protected void BeforeEditGrid(object sender, EventArgs e)
{
X.Msg.Alert("BeforeEdit", "Before edit").Show();
}

protected void CellCommand(object sender, EventArgs e)
{
X.Msg.Alert("CellCommand", "Cell Command").Show();
wndComment.Show();
}

protected void Show(object sender, EventArgs e)
{
X.Msg.Alert("Show", "Show panel").Show();
}



</script>

<!DOCTYPE html protected "-//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 id="Head1" runat="server">
<title>ResMed Global KPIs</title>

<ext:ResourcePlaceHolder ID="ResourcePlaceHolder1" runat="server" Mode="ScriptFiles" />

<script type="text/javascript">

var cancelAddRecord = function ()
{

//var gridName = returnName( this );
var grid = this.grid;

grid.editingPlugin.cancelEdit();
var s = grid.getSelectionModel().getSelection();

for ( var i = 0, r; r = s[i]; i++ )
{
//grid.store.remove( r );
};
grid.store.reload();
};

var addNewRecord = function ()
{



var gridName = this.id.substr( 6 );
var grid = Ext.getCmp( "grd" + gridName );

grid.editingPlugin.cancelEdit();

switch ( gridName )
{
case "Template":
grid.store.insert( 0, {
STR_Template: "New template name",
STR_ChartsInTemplate: "",
BOOL_Private: false,
INT_idUser: 0
} );
break;

}

grid.getView().refresh();
grid.editingPlugin.startEdit( 0, 0 );
};

RendercboCharts = function ( value, p, record )
{
return record.data.STR_ChartsInTemplateName;
};

</script>

<style type="text/css">
body {
background-repeat: no-repeat;
background-position: center center;
z-index: -1;
}

.top-list {
z-index:99999 !important;
}


.desktopEl {
position: absolute !important;
}


</style>

</head>

<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" RethrowAjaxExceptions="True">

</ext:ResourceManager>
<%-- Data stores--%>
<ext:Store ID="stoChartsName" runat="server" AutoLoad="True">
<Reader>
<ext:ArrayReader />
</Reader>
<Model>
<ext:Model ID="Model2" runat="server">
<Fields>
<ext:ModelField Name="INT_idCharts" Type="Int" />
<ext:ModelField Name="STR_FriendlyName" type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>

<ext:Desktop
ID="MyDesktop"
runat="server">
<DesktopConfig ID="DesktopConfig1" Wallpaper="images/DesktopImages/RmdDesktop.jpg" WallpaperStretch="True" runat="server" Icons="start-button">
</DesktopConfig>

<Modules>

<%-- Template window--%>
<ext:DesktopModule ModuleID="Template" AutoRun="true">
<Window>
<ext:Window ID="wndTemplate"
runat="server"
Icon="Table"
Width="800"
Height="380"
Layout="Fit"
Hidden="True"
ExpandOnShow="True"
MinHeight="100"
MinWidth="100"
Maximizable="False"
Resizable="False"
TitleCollapse="True"
Title="Chart template definition"
Collapsible="True" CloseAction="Destroy">
<Items>
<ext:GridPanel
ID="grdTemplate"
runat="server"
Cls="x-grid-custom"
AutoScroll="False"
ColumnLines="True">
<Store>
<ext:Store ID="stoChartsTemplate" runat="server" WarningOnDirty="False">
<Reader>
<ext:ArrayReader />
</Reader>
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="INT_idTemplate" />
<ext:ModelField Name="STR_Template" />
<ext:ModelField Name="STR_ChartsInTemplateName" />
<ext:ModelField Name="STR_ChartsInTemplateValue" />
<ext:ModelField Name="BOOL_Private" />
<ext:ModelField Name="INT_idUser" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="cmTemplate" runat="server">
<Columns>
<ext:Column Runat="server" ID="idTemplate" DataIndex="INT_idTemplate" MenuDisabled="True" Fixed="True" Groupable="False" Hideable="False" Resizable="False" Sortable="False" Width="30" Text="ID" Hidden="True">
</ext:Column>
<ext:Column Runat="server" Flex="1" ID="Template" DataIndex="STR_Template" MenuDisabled="True" Fixed="True" Groupable="False" Hideable="False" Resizable="False" Sortable="true" MinWidth="200" Text="Template">
<Commands>
<ext:ImageCommand CommandName="Edit" Icon="NoteEdit">
<ToolTip Text="add a comment" />
</ext:ImageCommand>
</Commands>
<Editor>
<ext:TextField ID="TextField1" runat="server"></ext:TextField>
</Editor>
<DirectEvents >
<Command OnEvent="CellCommand">
<ExtraParams>
<ext:Parameter Name="command" Value="command" Mode="raw" Encode="false" ></ext:Parameter>
<ext:Parameter Name="data" Value="record.data" Mode="raw" Encode="true" ></ext:Parameter>
<ext:Parameter Name="column" Value="this.dataIndex" Mode="raw" Encode="false" ></ext:Parameter>
</ExtraParams>
</Command>
</DirectEvents>
</ext:Column>
<ext:Column Runat="server" ID="ChartsInTemplate" DataIndex="STR_ChartsInTemplateValue" MenuDisabled="True" Fixed="True" Groupable="False" Hideable="False" Resizable="False" Sortable="true" Width="500" Text="Charts in template">
<Editor>
<ext:MultiCombo
ID="cboMultiChartsTemplate"
Enabled="true"
runat="server"
Editable="false"
Width="500"
AllowBlank="False"
EmptyText="Please choose a value..."
DisplayField="STR_FriendlyName"
ValueField="INT_idCharts" FireSelectOnLoad="True"
StoreID="stoChartsName">
<ListConfig ID="ListConfig33" runat="server" Cls="top-list">
</ListConfig>
</ext:MultiCombo>
</Editor>
<Renderer Fn="RendercboCharts" />
</ext:Column>
<ext:BooleanColumn
runat="server"
ID="Private"
DataIndex="BOOL_Private"
Width="200"
MenuDisabled="True"
Resizable="False"
Sortable="False"
Text="Template is Private"
TrueText="Yes"
FalseText="No" Fixed="True">
<Editor>
<ext:Checkbox ID="Changebox2" runat="server"></ext:Checkbox>
</Editor>
</ext:BooleanColumn >
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel6" runat="server">
</ext:RowSelectionModel>
</SelectionModel>
<TopBar>
<ext:Toolbar ID="Toolbar3" runat="server">
<Items>
<ext:Button ID="btnAddTemplate" runat="server" Text="Add a template" Icon="Add">
<Listeners>
<Click Fn="addNewRecord" />
</Listeners>
</ext:Button>
<ext:Button ID="btnDelTemplate" runat="server" Text="Remove a template" Icon="Delete">
<DirectEvents>
<Click OnEvent="btnDelTemplate_Click">
<ExtraParams>
<ext:Parameter Name="data" Value="#{grdTemplate}.getRowsValues({selectedOnly : true})" Mode="Raw" Encode="true"></ext:Parameter>
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<View>
<ext:GridView ID="GridView12" runat="server" ToFrontOnShow="False" />
</View>
<Plugins>
<ext:RowEditing ID="RowEditing5" runat="server" AutoCancel="false" >
<DirectEvents>
<ValidateEdit OnEvent="UpdateTemplate">
<ExtraParams>
<ext:Parameter Name="data" Value="e.record.data" Mode="raw" Encode="true" ></ext:Parameter>
</ExtraParams>
</ValidateEdit>
<BeforeEdit OnEvent="BeforeEditGrid">
<ExtraParams>
<ext:Parameter Name="data" Value="#{grdTemplate}.getRowsValues({selectedOnly : true})" Mode="raw" Encode="true" ></ext:Parameter>
</ExtraParams>
</BeforeEdit>
</DirectEvents>
<Listeners>
<CancelEdit Fn="cancelAddRecord" />
</Listeners>
</ext:RowEditing>
</Plugins>
<DirectEvents>
<Show OnEvent="Show"></Show>
</DirectEvents>
</ext:GridPanel>
</Items>
</ext:Window>
</Window>
</ext:DesktopModule>

<ext:DesktopModule ModuleID="Comment">
<Window>
<ext:Window
ID="wndComment"
runat="server"
Icon="Table"
Width="400"
Height="400"
Layout="Fit"
Hidden="True"
ExpandOnShow="True"
MinHeight="100"
MinWidth="100"
Maximizable="False"
Resizable="False"
TitleCollapse="True"
Title="Comment"
Padding="5"
Collapsible="True">
<Items>
<ext:Hidden ID="idKPIs_Comment" runat="server" Text=""></ext:Hidden>
<ext:Hidden ID="idKPIs_KPIs" runat="server" Text=""></ext:Hidden>
<ext:Hidden ID="FieldToComment" runat="server" Text=""></ext:Hidden>
<ext:TextArea ID="txtComment" runat="server" Width="390" Height="360"></ext:TextArea>
</Items>
<Buttons>
<ext:Button ID="btnAddModifyComent" runat="server" Text="OK">
</ext:Button>
<ext:Button ID="btnDelComment" runat="server" Text="Delete" Icon="Delete">
</ext:Button>
</Buttons>
</ext:Window>
</Window>
</ext:DesktopModule>
</Modules>

<StartMenu ID="StartMenu1" Height="300" Title="Start Here" runat="server" HideTools="True">
<MenuItems>
<ext:MenuItem Text="Tools" Icon="Wrench">
<Menu>
<ext:Menu ID="mnuTemplate" runat="server">
<Items>
<ext:MenuItem Text="Charts template" Icon="Eye">
<Listeners>
<Click Handler="#{MyDesktop}.getModule('Template').createWindow();" />
</Listeners>
</ext:MenuItem>
</Items>
</ext:Menu>
</Menu>
</ext:MenuItem>
</MenuItems>
</StartMenu>

<TaskBar ID="TaskBar1" runat="server" TrayWidth="50">
<TrayClock ID="TrayClock1" runat="server" ></TrayClock>
</TaskBar>
</ext:Desktop>



</form>
</body>

</html>


Show Event on panel is not fired. Why?

Daniil
May 02, 2012, 4:30 PM
Hi,

The Show event fires after the component is shown when calling the show method.
http://docs.sencha.com/ext-js/4-1/#!/api/Ext.AbstractComponent-event-show

Showing the Window doesn't call the GridPanel show method, so the Show event is not fired.

Please use the Window Show event.

feanor91
May 02, 2012, 5:14 PM
Ah, OK

But the problem is I have 11 tabs to show, and I want to save the name of the first shown that could be different from the first tab, because, depending of user preferences some tabs could be shown and other hides when launching the application, so how to get that name from the show event of the window?

Daniil
May 02, 2012, 8:49 PM
Hopefully, I correctly understand the requirement.

Example

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!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>Ext.NET Example</title>
</head>
<body>
<ext:ResourceManager runat="server" />

<ext:Window ID="Window1" runat="server" Hidden="true">
<Items>
<ext:TabPanel runat="server" ActiveTabIndex="1">
<Items>
<ext:Panel runat="server" Title="Tab 1" />
<ext:Panel runat="server" Title="Tab 2" />
</Items>
</ext:TabPanel>
</Items>
<Listeners>
<Show Handler="alert(this.items.get(0).getActiveTab().title);" />
</Listeners>
</ext:Window>

<ext:Button runat="server" Text="Show">
<Listeners>
<Click Handler="App.Window1.show();" />
</Listeners>
</ext:Button>
</body>
</html>

feanor91
May 03, 2012, 4:20 AM
Hello

I will try that in a few hour at work, but one thing is sure : I wish I have your knowledge...You are like Obelix : you fell into Ext when you were a baby?

Edit: I change to a directevents because I have to deal with in code behind, but it works perfectly. Thanks.

Daniil
May 03, 2012, 8:34 AM
:) I'm in Ext.NET since June of 2010.

feanor91
May 03, 2012, 8:41 AM
I understand better