[CLOSED] How do you add a Portlet to a Portal Column from JavaScript?

  1. #1

    [CLOSED] How do you add a Portlet to a Portal Column from JavaScript?

    Hi,

    The following is my Razor view:

    @(X.Panel()
           .Title("Dashboard")      
           .ID("pnlDashboard")
           .IDMode(IDMode.Explicit)
           .IconCls("dashboard-icon")
           .Padding(5)
           .Closable(true)
           .Margins("0 0 0 0")
           .Layout(LayoutType.Border)
           .Items(
               X.Panel()
                .Region(Region.North)
                .Height(45)
                .Layout(LayoutType.HBox)
                .LayoutConfig(
                    new HBoxLayoutConfig {Align = HBoxAlign.Stretch, DefaultMargins = "3", Pack = BoxPack.End}
                   )
                .Items(
                    X.Button().Flat(true).Cls("fa").Html("<i class='fa fa-plus-square-o fa-lg'></i>&nbsp;&nbsp;Add Portlet").UI(UI.Default).Scale(ButtonScale.Small).ArrowAlign(ArrowAlign.Right)
                    .ToolTipType(ToolTipType.Title).ToolTip("Add Portlet")                
                     .Menu(X.Menu()                 
                            .Items(
                                X.MenuItem()
                                 .Text("Open Films").Disabled(false).Listeners(ls=>ls.Click.Handler="AddPortlet(1);"),
                                X.MenuItem()
                                 .Text("This week's Disney Releases").Disabled(false).Listeners(ls=>ls.Click.Handler="AddPortlet(2);"),
                                X.MenuItem()
                                 .Text("Disney Films - Current Ultimates").Disabled(false).Listeners(ls=>ls.Click.Handler="AddPortlet(3);"),
                                X.MenuItem()
                                 .Text("Year GBO to date").Disabled(false).Listeners(ls=>ls.Click.Handler="AddPortlet(4);"),
                                X.MenuItem()
                                 .Text("Release Calendar").Disabled(false).Listeners(ls=>ls.Click.Handler="AddPortlet(5);")
                               )
                        ),
                    X.Button().Flat(true).Cls("fa").Html("<i class='fa fa-floppy-o fa-lg'></i>&nbsp;&nbsp;Save Dashboard Layout").UI(UI.Default).Scale(ButtonScale.Small)
                    .ToolTipType(ToolTipType.Title).ToolTip("Save Dashboard Layout").Listeners(ls=>ls.Click.Handler="SPARTA.Dashboard.SavePortletStates();")                
                   ),
               X.Portal()
                .ID("portalMain")
                .Region(Region.Center)
                .Items(
                    X.PortalColumn()
                     .ID("portalCol1"),
                     
                    X.PortalColumn()
                     .ID("portalCol2"),
                     
                    X.PortalColumn()
                     .ID("portalCol3")
                     
                   )
              )                        
          )
    As you can see, I have three columns defined for the Portal and all I want to do is to Add a Portlet to a Portal Column when the user select one from the Menu.

    Here is my attempt at doing so but it doesn't work.

    AddPortlet: function (id, title) {
              
                var portalCol1 = Ext.getCmp("portalCol1");
    
                if (portalCol1) {                
    
                   // the following is giving me an error
    
                    var portlet = new Ext.ux.Portlet({
                        //xtype: 'portlet',
                        //title: 'Test',
                        //heigh: 300
                    });
    
                    portalCol1.add(portlet);
    
                }
            },
    Please help. Thanks!
    Last edited by Daniil; Jun 04, 2014 at 4:50 PM. Reason: [CLOSED]
  2. #2
    Hi @leonardm,

    Your code produces a JavaScript error.
    Ext.ux.Portlet is not a constructor
    Please clarify have you seen that? It is very worth to be able to see JavaScript errors. Do you know how to see them?

    You should use Ext.app.Portlet instead of Ext.ux.Portlet.
  3. #3
    Quote Originally Posted by Daniil View Post
    Hi @leonardm,

    Your code produces a JavaScript error.
    Ext.ux.Portlet is not a constructor
    Please clarify have you seen that? It is very worth to be able to see JavaScript errors. Do you know how to see them?

    You should use Ext.app.Portlet instead of Ext.ux.Portlet.
    That fixed it. Thank You.

    I had originally found Ext.ux.Portlet code from this thread

    Please close this.

Similar Threads

  1. [CLOSED] Portlet drop when portal in TabPanel
    By prost in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Mar 06, 2013, 6:00 AM
  2. Replies: 2
    Last Post: Dec 27, 2010, 4:42 PM
  3. [CLOSED] [1.0]Moving Portlet from Portal to Portal
    By betamax in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: May 21, 2010, 11:47 AM
  4. Replies: 0
    Last Post: Mar 03, 2010, 9:51 AM
  5. Portal, Portlet & Viewstate
    By Kalitte in forum Bugs
    Replies: 4
    Last Post: Dec 30, 2008, 4:27 AM

Tags for this Thread

Posting Permissions