[CLOSED] Issue with Dialog

  1. #1

    [CLOSED] Issue with Dialog

    Hello,

    I'm upgrading to Ext.Net 5.0 but I'm stuck on dialog. On previous version I called a javascript function to oepn a new dialog wich contains another ext.net page.

    Unfortunatelly I cannot make it work with version 5.0 and I do not know why. This is an example code wich reproduces the issue.

    When clicked the button should open a dialog wich contains the same page. The dialog is opened and the call to the page is done, but nothing is shown.

    Any Clues?

    This is the code for test.aspx

    <%@ Page Language="C#" %>
    
    <%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>
    
    <script runat="server">
        protected void Button1_Click(object sender, DirectEventArgs e)
        {
                    
             string script="newWindow('test.aspx',{title: 'New title'})";
            Button1.AddScript(script);
        }
    </script>
    
    <!DOCTYPE html>
        
    <html>
    <head runat="server">
        <title>Ext.NET Example</title>
        <script type="text/javascript">
            var newWindow = function (url, config) {
                new Ext.Window(Ext.apply({
                    renderTo: Ext.getBody(),
                    resizable: false,
                    title: "Test",
                    height: 500,
                    width: 500,
                    frame: true,
                    autoLoad: {
                        showMask: true,
                        mode: "iframe",
                        url: url
                    }
                }, config)).show();
            }
        </script>
    </head>
    
    <body>
        <ext:ResourceManager runat="server" Theme="Triton" />
        
        <form runat="server">
            <ext:Panel 
                ID="Window1"
                runat="server" 
                Title="Welcome to Ext.NET"
                Height="215"
                Width="350"
                Frame="true"
                Collapsible="true"
                Cls="box"
                BodyPadding="5"
                DefaultButton="0"
                Layout="AnchorLayout"
                DefaultAnchor="100%">
                <Items>
                    <ext:TextArea 
                        ID="TextArea1" 
                        runat="server" 
                        EmptyText=">> Enter a Test Message Here <<"
                        FieldLabel="Message" 
                        Height="85" 
                        />
                </Items>
                <Buttons>
                    <ext:Button 
                        ID="Button1"
                        runat="server" 
                        Text="Submit"
                        Icon="Accept" 
                        OnDirectClick="Button1_Click" 
                        />
                </Buttons>
            </ext:Panel>
        </form>
    </body>
    </html>
    Last edited by fabricio.murta; Oct 31, 2019 at 6:13 PM.
  2. #2
    Hello @jcanton!

    The client-side syntax has changed to loader instead of an autoLoad object. For the equivalence, the loader object should have an autoLoad: true property.

    In other words, your autoLoad property in the window object should be:

    loader: {
        showMask: true,
        url: url,
        renderer: 'frame',
        autoLoad: true
    }
    You may also want to change the window creation syntax from:

    new Ext.Window(Ext.apply({ window_config }, config)).show();
    Into

    Ext.create("Ext.Window", { window_config }).show();
    Where window_config would be the window config object, in your case:

    var window_config = {
      renderTo: Ext.getBody(),
      resizable: false,
      title: "Test",
      height: 500,
      width: 500,
      frame: true,
      loaderoad: {
        showMask: true,
        mode: "frame",
        url: url,
        autoLoad: true
      }
    }
    I just turned in a variable to make it easier to understand what changed in the component creation code.

    An example close to what you need would be the TabPanel > Add Tabs one. The difference there is the pages are loaded within a tab panel (container), while your container is a window.

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Thank you!!,

    It works now.
  4. #4
    Hello @jcanton.

    Thanks for the feedback, and glad it helped!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. [CLOSED] FileUploadField as File Dialog
    By Argenta in forum 3.x Premium Help
    Replies: 12
    Last Post: Dec 23, 2015, 7:42 AM
  2. File Upload Dialog
    By davidhoyt in forum User Extensions and Plugins
    Replies: 39
    Last Post: May 27, 2013, 7:19 PM
  3. Fileupload after Save Dialog issue
    By reyonlines in forum 1.x Help
    Replies: 5
    Last Post: Jan 03, 2011, 6:27 PM
  4. Get the value from prompt dialog and save
    By CoolNoob in forum 1.x Help
    Replies: 5
    Last Post: Oct 23, 2009, 3:13 PM
  5. [CLOSED] Save as dialog?
    By Jurke in forum 1.x Premium Help
    Replies: 1
    Last Post: Jun 01, 2009, 1:53 PM

Posting Permissions