[CLOSED] Loading Panel content from DirectMethod

Page 1 of 2 12 LastLast
  1. #1

    [CLOSED] Loading Panel content from DirectMethod

    Hi,

    Please suggest how to load Panel content correctly from a Direct Method if it's possible. I'm getting a client side error doing it as below. Here's my test case:

    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
            }
        }
    
        [DirectMethod]
        public void LoadContent(string url)
        {
            this.Panel1.SuspendScripting();
            this.Panel1.ClearContent();
            this.Panel1.RemoveAll(true);
            this.Panel1.Loader = new ComponentLoader();
            this.Panel1.Loader.Url = url;
            this.Panel1.Loader.Mode = LoadMode.Frame;
            this.Panel1.Loader.DisableCaching = true;
            this.Panel1.Loader.LoadMask.ShowMask = true;
            this.Panel1.Loader.LoadMask.Msg = "Loading it...";
            this.Panel1.Loader.MonitorComplete = false;
            this.Panel1.LoadContent();
        }
    
    </script>
    <!DOCTYPE html>
    <html>
    <head id="Head1" runat="server">
        <title>Ext.NET Examples</title>
        <script>
            var loadContent = function () {
                var url = "Child.aspx";
    
                App.Panel1.clearContent();
    
                X.LoadContent(url, {
                    eventMask: { showMask: false },
                    success: function () {
    
                    }
                });
            };
    
        </script>
    </head>
    <body>
        <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server" DirectMethodNamespace="X" />
            <ext:Viewport ID="Viewport1" runat="server" Layout="FitLayout">
                <Items>
                    <ext:Panel ID="Panel1" runat="server" Icon="Book" Title="Ext.Net">
                        <BottomBar>
                            <ext:Toolbar runat="server">
                                <Items>
                                    <ext:Button runat="server" Text="Load Content" Icon="Application">
                                        <Listeners>
                                            <Click Fn="loadContent" />
                                        </Listeners>
                                    </ext:Button>
                                </Items>
                            </ext:Toolbar>
                        </BottomBar>
                    </ext:Panel>
                </Items>
            </ext:Viewport>
        </form>
    </body>
    </html>
    Last edited by Daniil; Sep 14, 2015 at 2:11 PM. Reason: [CLOSED]
  2. #2
    Loading the panel content seems possible from a direct event but not from a DirectMethod. Another hindrance that I'd love to do away with is having to specify the initial Url in the Panel Loader configuration.

    <%@ Page Language="C#" %>
    
    <script runat="server">
        protected void Button1_Click(object sender, DirectEventArgs e)
        {
            this.Panel3.LoadContent(new ComponentLoader()
            {
                Url = "Child.aspx",
                Mode = LoadMode.Frame,
                DisableCaching = true
            });
        }
    </script>
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Ext.NET Examples</title>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
    
        <ext:Panel
            ID="Panel1"
            runat="server"
            Height="150"
            Width="350"
            Title="Frame Mode">
            <Loader
                runat="server"
                Url="Blank.aspx"
                Mode="Frame"
                ShowMask="true">
                <LoadMask ShowMask="true" />
            </Loader>
            <Buttons>
                <ext:Button runat="server" ID="Button1" Text="Load" OnDirectClick="Button1_Click" />
            </Buttons>
        </ext:Panel>
    </body>
    </html>
  3. #3
    What does the client-side error state?

    I believe X.LoadContent should be App.LoadContent.

    Hope this helps.
    Geoffrey McGill
    Founder & CEO
  4. #4
    Hi Geoffrey,

    Thanks for your response. Attached is the screenshot of the client side error. You can run the original test case in this thread provided that Child.aspx page exists. However, my sense is that the error occurs prior to the Url evaluation.

    Click image for larger version. 

Name:	Loader Error.png 
Views:	10 
Size:	30.6 KB 
ID:	24227
  5. #5
    Hi Vadym,

    Please define a Loader stub for the Panel in the sample from the first post.
    <Loader runat="server" AutoLoad="false" />
  6. #6
    Hi Daniil,

    The client error is gone but the panel content doesn't load properly. Anything else is missing or misconfigured?

    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
            }
        }
    
        [DirectMethod]
        public void LoadContent(string url)
        {
            this.Panel1.SuspendScripting();
            this.Panel1.ClearContent();
            this.Panel1.RemoveAll(true);
            //this.Panel1.Loader = new ComponentLoader();
            this.Panel1.Loader.Url = url;
            this.Panel1.Loader.Mode = LoadMode.Frame;
            this.Panel1.Loader.DisableCaching = true;
            this.Panel1.Loader.LoadMask.ShowMask = true;
            this.Panel1.Loader.LoadMask.Msg = "Loading it...";
            this.Panel1.Loader.MonitorComplete = false;
            this.Panel1.LoadContent();
        }
    
    </script>
    <!DOCTYPE html>
    <html>
    <head id="Head1" runat="server">
        <title>Ext.NET Examples</title>
        <script>
            var loadContent = function () {
                var url = "Child.aspx";
    
                App.Panel1.clearContent();
    
                X.LoadContent(url, {
                    eventMask: { showMask: false },
                    success: function () {
    
                    }
                });
            };
    
        </script>
    </head>
    <body>
        <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server" DirectMethodNamespace="X" />
            <ext:Viewport ID="Viewport1" runat="server" Layout="FitLayout">
                <Items>
                    <ext:Panel ID="Panel1" runat="server" Icon="Book" Title="Ext.Net">
                        <Loader runat="server" AutoLoad="false" />
                        <BottomBar>
                            <ext:Toolbar runat="server">
                                <Items>
                                    <ext:Button runat="server" Text="Load Content" Icon="Application">
                                        <Listeners>
                                            <Click Fn="loadContent" />
                                        </Listeners>
                                    </ext:Button>
                                </Items>
                            </ext:Toolbar>
                        </BottomBar>
                    </ext:Panel>
                </Items>
            </ext:Viewport>
        </form>
    </body>
    </html>
  7. #7
    I tried with a simple Child.aspx and it appears to be loaded correctly. Please elaborate.
  8. #8
    For example, in IE11, if I try to load the following simple page inside a Panel, the Combobox control doesn't show up although the Page_Load event does fire:

    Child.aspx
    <%@ Page Language="C#" %>
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            this.SelectBox1.GetStore().DataSource = new object[]
            {
                new object[] { "AL", "Alabama", "The Heart of Dixie" },
                new object[] { "AK", "Alaska", "The Land of the Midnight Sun" },
                new object[] { "AZ", "Arizona", "The Grand Canyon State" },
                new object[] { "AR", "Arkansas", "The Natural State" },
                new object[] { "CA", "California", "The Golden State" },
                new object[] { "CO", "Colorado", "The Mountain State" },
                new object[] { "CT", "Connecticut", "The Constitution State" },
                new object[] { "DE", "Delaware", "The First State" },
                new object[] { "DC", "District of Columbia", "The Nation's Capital" },
                new object[] { "FL", "Florida", "The Sunshine State" },
                new object[] { "GA", "Georgia", "The Peach State" },
                new object[] { "HI", "Hawaii", "The Aloha State" },
                new object[] { "ID", "Idaho", "Famous Potatoes" },
                new object[] { "IL", "Illinois", "The Prairie State" },
                new object[] { "IN", "Indiana", "The Hospitality State" },
                new object[] { "IA", "Iowa", "The Corn State" },
                new object[] { "KS", "Kansas", "The Sunflower State" },
                new object[] { "KY", "Kentucky", "The Bluegrass State" },
                new object[] { "LA", "Louisiana", "The Bayou State" },
                new object[] { "ME", "Maine", "The Pine Tree State" },
                new object[] { "MD", "Maryland", "Chesapeake State" },
                new object[] { "MA", "Massachusetts", "The Spirit of America" },
                new object[] { "MI", "Michigan", "Great Lakes State" },
                new object[] { "MN", "Minnesota", "North Star State" },
                new object[] { "MS", "Mississippi", "Magnolia State" },
                new object[] { "MO", "Missouri", "Show Me State" },
                new object[] { "MT", "Montana", "Big Sky Country" },
                new object[] { "NE", "Nebraska", "Beef State" },
                new object[] { "NV", "Nevada", "Silver State" },
                new object[] { "NH", "New Hampshire", "Granite State" },
                new object[] { "NJ", "New Jersey", "Garden State" },
                new object[] { "NM", "New Mexico", "Land of Enchantment" },
                new object[] { "NY", "New York", "Empire State" },
                new object[] { "NC", "North Carolina", "First in Freedom" },
                new object[] { "ND", "North Dakota", "Peace Garden State" },
                new object[] { "OH", "Ohio", "The Heart of it All" },
                new object[] { "OK", "Oklahoma", "Oklahoma is OK" },
                new object[] { "OR", "Oregon", "Pacific Wonderland" },
                new object[] { "PA", "Pennsylvania", "Keystone State" },
                new object[] { "RI", "Rhode Island", "Ocean State" },
                new object[] { "SC", "South Carolina", "Nothing Could be Finer" },
                new object[] { "SD", "South Dakota", "Great Faces, Great Places" },
                new object[] { "TN", "Tennessee", "Volunteer State" },
                new object[] { "TX", "Texas", "Lone Star State" },
                new object[] { "UT", "Utah", "Salt Lake State" },
                new object[] { "VT", "Vermont", "Green Mountain State" },
                new object[] { "VA", "Virginia", "Mother of States" },
                new object[] { "WA", "Washington", "Green Tree State" },
                new object[] { "WV", "West Virginia", "Mountain State" },
                new object[] { "WI", "Wisconsin", "America's Dairyland" },
                new object[] { "WY", "Wyoming", "Like No Place on Earth"} 
            };
        }
    </script>
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>SelectBox - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            
            <h3>SelectBox</h3>
            
            <p>A Component similar to an HTML SELECT input. Supports clicking and dragging
            through the list, with item selection occurring when the mouse button is released.</p>
            
            <ext:SelectBox
                ID="SelectBox1"
                runat="server" 
                DisplayField="state"
                ValueField="abbr"
                EmptyText="Select a state...">
                <Store>
                    <ext:Store runat="server">
                        <Model>
                            <ext:Model runat="server">
                                <Fields>
                                    <ext:ModelField Name="abbr" />
                                    <ext:ModelField Name="state" />
                                    <ext:ModelField Name="nick" />
                                </Fields>
                            </ext:Model>
                        </Model>            
                    </ext:Store>    
                </Store>    
            </ext:SelectBox>
        </form>
    </body>
    </html>
  9. #9
    Hello Vadym,

    Your last code sample seems very different from your first. Please start a new thread if you are changing the topic.
    Geoffrey McGill
    Founder & CEO
  10. #10
    Hi Geoffrey,

    I've just posted for convenience a sample of a simple page (Child.aspx) that I'm trying to load within a Panel. The parent page hosting the Panel object is essentially the code sample posted at the very beginning. I could re-post both if that would be helpful.
Page 1 of 2 12 LastLast

Similar Threads

  1. [CLOSED] Loading Panel Content from Model
    By barnali in forum 3.x Premium Help
    Replies: 1
    Last Post: Feb 15, 2015, 6:27 AM
  2. [CLOSED] Mask position when loading Panel's content
    By RCN in forum 2.x Premium Help
    Replies: 10
    Last Post: Oct 17, 2012, 2:02 PM
  3. Tab Panel Content Loading
    By xMAC in forum 1.x Help
    Replies: 5
    Last Post: Dec 10, 2010, 7:07 AM
  4. Replies: 2
    Last Post: Mar 09, 2010, 12:55 PM
  5. Dynamic loading content page into Panel
    By wildspirit in forum 1.x Help
    Replies: 2
    Last Post: Feb 04, 2009, 5:59 PM

Tags for this Thread

Posting Permissions