[CLOSED] How to open a window belonging to a desktop module from code behind?

[feanor91]

Hello

What is the code behind function to open a desktop module window?

I tried that :

MyDesktop.Modules("Comment").Window.Primary.Show()

and that :

wndComment.Show()

both command reports

Uncaught TypeError: Cannot call method 'show' of undefined

My window is defined like that :

                    <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">
                                        <DirectEvents>
                                            <Click OnEvent="btnAddModifyComent_Click">
                                            </Click>
                                        </DirectEvents>
                                    </ext:Button>
                                    <ext:Button ID="btnDelComment" runat="server" Text="Delete" Icon="Delete">
                                        <DirectEvents>
                                            <Click OnEvent="btnDelComment_Click">
                                            </Click>
                                        </DirectEvents>
                                    </ext:Button>
                                </Buttons>
                            </ext:Window>
                        </Window>
                    </ext:DesktopModule>

The example to reproduce :

<%@ 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,21,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();
        }


    </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>
                                    </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>

click on the note icon.

[Daniil]

Hi,

I think this is missed in server side API.

For now, I can suggest the following:

MyDesktop.Call("getModule('Comment').createWindow");

We will review it and, probably, add a respective server side method.

[feanor91]

Hi,

I think this is missed in server side API.

For now, I can suggest the following:

MyDesktop.Call("getModule('Comment').createWindow");

We will review it and, probably, add a respective server side method.

OK, this explain that...Thanks.

This call method could be applied on all objext server side to call javascript functions?

[Daniil]

This call method could be applied on all objext server side to call javascript functions?

Yes, it should be available for all Ext.Net.BaseControl inheritors. The Ext.Net.BaseControl is a base Ext.NET class.

[feanor91]

OK thanks. Could we use all javascrip method of an object, passes parameters and all the stuff?

[Daniil]

Well, yes, you can call any JavaScript function and pass any parameters which can be serialized to transmit to client side.

[Daniil]

I think this is missed in server side API.

For now, I can suggest the following:

MyDesktop.Call("getModule('Comment').createWindow");

We will review it and, probably, add a respective server side method.

The LaunchModule method has been added.

Example

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

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

<script runat="server">
    protected void ShowWindow(object sender, DirectEventArgs e)
    {
        this.Desktop1.LaunchModule("Hello");
    }
</script>

<!DOCTYPE html>
    
<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" /> 

        <ext:Desktop ID="Desktop1" runat="server">            
            <Modules>
                <ext:DesktopModule ModuleID="Hello">
                    <Window>
                        <ext:Window runat="server" Title="Greeting">
                            <Content>
                                Welcome to Ext.Net desktop!
                            </Content>
                        </ext:Window>
                    </Window>
                </ext:DesktopModule>
            </Modules>

            <StartMenu Title="Ext.Net Desktop" Icon="Application" Height="300">
                <MenuItems>
                    <ext:MenuItem runat="server" Text="Show Window">
                        <DirectEvents>
                            <Click OnEvent="ShowWindow" />
                        </DirectEvents>
                    </ext:MenuItem>
                </MenuItems>
            </StartMenu>
        </ext:Desktop>
    </form>  
</body>
</html>

[feanor91]

Thank you very much