[CLOSED] How to add a button inside a DesktopModule

  1. #1

    [CLOSED] How to add a button inside a DesktopModule

    How can we add a button inside a desktopmodule.shortcut


    @(Html.X().Desktop()
        .ID("compdesktop")
        .Listeners(l => l.Ready.Handler = "HideComponent(this.desktop, this);")
      
        .DesktopConfig(
        (@Html.X().DesktopConfig()
             .DDShortcut(false)
             .AlignToGrid(true)
                .Wallpaper("../Content/resources/wallpapers/backgroud.jpg")
            .Title("COMPENSATION")
            .TitleAlign(TitleAlign.Center)
            .TitleCollapse(true)
            .Items(i => i.Add(
                (@Html.X().Panel()
                    .BodyStyle("background-color: green;")
                    .ID("myPanel")
                    .Region(Region.West)
                               
                )
                
                )
            
            )
        )
             
        )
    //we want the button here with direct event implemented
          .Modules(m => m.Add(
                        (@Html.X().DesktopModule()
                        .ModuleID("Module1")
                        
                        .Shortcut(
                        (@Html.X().DesktopShortcut()
                        .Name("Application Configuration")
                            .IconCls("x-app-shortcut")
                            .Handler("CreateWindow(this);")
                             
                            .TextCls("x-long-label")
                        .SortIndex(1)
                        .X("100")
                        .Y("100")
    
                        ))))
                    )
    Last edited by Baidaly; Nov 13, 2012 at 2:57 AM.
  2. #2
    Hello!

    Where exactly you want to place the button?
  3. #3
    Quote Originally Posted by Baidaly View Post
    Hello!

    Where exactly you want to place the button?
    We want to place a button as a shortcut of DesktopModule. The problem is there is only a handler in the desktopshortcut but no DirectEvent and we are having an issue with this as for each button we need to load a partial view in the window. So based on the button/icon click a window opens and then loads a partial view in it.

    .Modules(m => m.Add(
                    (@Html.X().DesktopModule()
                        .ModuleID("Module1")
                        
                       .Shortcut(
                     (@Html.X().DesktopShortcut()
                      .Name("Application Configuration")
                           .IconCls("x-app-shortcut")
                          .Handler("CreateWindow(this);")
                             
                            .TextCls("x-long-label")
                     .SortIndex(1)
                        .X("100")
                       .Y("100")
    
                        ))))
                    )
  4. #4
    OK, I think it'll be better to use DirectMethods instead of DirectEvents, they have almost the same functionality but will be much more appropriate for your situation.
  5. #5
    Quote Originally Posted by Baidaly View Post
    OK, I think it'll be better to use DirectMethods instead of DirectEvents, they have almost the same functionality but will be much more appropriate for your situation.
    After I changed it to directmethod I get

    Unable to get value of the property 'CreateWindowA': object is null or undefined

    Desktop.cshtml
    @{
        ViewBag.Title = "Desktop";
    }
    <Style>
        .x-item-selected div.ux-desktop-shortcut-bg 
        {
             
                width: 0px !important;
                height: 0px !important;
                
            }
             
            .x-view-over .ux-desktop-shortcut-bg {
               width: 0px !important;
                height: 0px !important;
            }
            .ux-wallpaper {
            display: none;
        }
         
        .ux-desktop-shortcut-text {
            color: black;
        }
        .x-btn-default-large 
        {
         
            background-image: url("../Content/settings.png") !important;
            background-repeat: no-repeat;
            background-position: center;
        }
        .x-btn-body {
            width:150px;
            height:150px;
        }
        
    </Style> 
    <script>
        function HideComponent(control, desktop) {
           
        for(var i = 0 ; i < control.taskbar.items.length;i++) {
           if(i < control.taskbar.items.length -1)
            control.taskbar.items.get(i).hide();
    
       }
    
       
    }
    function CreateWindow(control) {
        debugger;
        var panel = Ext.getCmp('myPanel'),
        region = panel.ownerCt.layout[panel.region];
        region.getCollapsedEl().on('mouseenter', function () {
            if (!panel.collapsed) {
                region.slideOut();
            }
        });
        }
    </script>
    @(Html.X().Desktop()
        .ID("compdesktop")
        .Listeners(l => l.Ready.Handler = "HideComponent(this.desktop, this);")
      
        .DesktopConfig(
        (@Html.X().DesktopConfig()
             .DDShortcut(false)
             .AlignToGrid(true)
             .ContentFromPartial("RenderControl")
           
            //.Items(i => i.Add(
            //    (@Html.X().Panel()
            //        .BodyStyle("background-color: green;")
            //        .ID("myPanel")
            //        .Region(Region.West)
                               
            //    )
                
            //    )
            
            //)
        )
             
        )
    
              .Modules(m => m.Add(
                            (@Html.X().DesktopModule()
                            .ModuleID("Module1")
                            
                            .Shortcut(
                            (@Html.X().DesktopShortcut()
                            .Name("Application Configuration")
                                .IconCls("x-app-shortcut")
                              .Handler("App.direct.CreateWindowA();")
    
                                .TextCls("x-long-label")
                            .SortIndex(1)
                            .X("100")
                            .Y("100")
    
                            ))))
                        )
                   .Modules(m => m.Add(
                                (@Html.X().DesktopModule()
                                .ModuleID("Module2")
    
    
    
                                )
                                .Shortcut(
                                (@Html.X().DesktopShortcut()
    
                                .IconCls("right-arrow")
    
                                .SortIndex(1)
                                .X("250")
                                .Y("100")
    
                                ))))
    
                  .Modules(m => m.Add(
                                (@Html.X().DesktopModule()
                                .ModuleID("Module1")
    
                                .Shortcut(
                                (@Html.X().DesktopShortcut()
                                .Name("Cycle Configuration")
                                .IconCls("x-cycle-shortcut")
                                .TextCls("x-long-label")
                                .QTip("Cycle configuration options.")
                                .SortIndex(1)
                                .X("350")
                                .Y("100")
    
                                ))))
                            )
        )
    DesktopController.cs
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    using Ext.Net;
    
    namespace ExtMVC.Controllers
    {
        public class DesktopController : Controller
        {
       
            public ActionResult Desktop()
            {
                return View();
            }
             [HttpPost]
            public ActionResult BuildModules(FormCollection desktop)
             {
               
                 var panel = new Panel();
                 panel.Title = "Test";
                 panel.Render("compdesktop", RenderMode.AddTo);
                 
                 return null;
             }
    
             public Ext.Net.MVC.PartialViewResult CreateWindow()
            {
                return new Ext.Net.MVC.PartialViewResult
                           {
                               ViewName = "SampleWindow"
                                   
                           };
            }
            [DirectMethod]
             public Ext.Net.MVC.PartialViewResult CreateWindowA()
             {
                 return new Ext.Net.MVC.PartialViewResult
                 {
                     ViewName = "SampleWindow"
    
                 };
             }
    
        }
    }
  6. #6
    Don't forget about [DirectController] attribute.

    [DirectController]
    public class DesktopController : Controller
    {
    	public ActionResult Desktop()
    	{
    		return View();
    	}
    	
    	[HttpPost]
    	public ActionResult BuildModules(FormCollection desktop)
    	{
    		
    		 var panel = new Panel();
    		 panel.Title = "Test";
    		 panel.Render("compdesktop", RenderMode.AddTo);
    		  
    		 return null;
    	}
    
    	public Ext.Net.MVC.PartialViewResult CreateWindow()
    	{
    		return new Ext.Net.MVC.PartialViewResult
    				   {
    					   ViewName = "SampleWindow"
    							
    				   };
    	}
    	
    	[DirectMethod]
    	public Ext.Net.MVC.PartialViewResult CreateWindowA()
    	{
    		return new Ext.Net.MVC.PartialViewResult
    		{
    			ViewName = "SampleWindow"
    
    		};
    	}
    }
  7. #7
    Quote Originally Posted by Baidaly View Post
    Don't forget about [DirectController] attribute.

    [DirectController]
    public class DesktopController : Controller
    {
    	public ActionResult Desktop()
    	{
    		return View();
    	}
    	
    	[HttpPost]
    	public ActionResult BuildModules(FormCollection desktop)
    	{
    		
    		 var panel = new Panel();
    		 panel.Title = "Test";
    		 panel.Render("compdesktop", RenderMode.AddTo);
    		  
    		 return null;
    	}
    
    	public Ext.Net.MVC.PartialViewResult CreateWindow()
    	{
    		return new Ext.Net.MVC.PartialViewResult
    				   {
    					   ViewName = "SampleWindow"
    							
    				   };
    	}
    	
    	[DirectMethod]
    	public Ext.Net.MVC.PartialViewResult CreateWindowA()
    	{
    		return new Ext.Net.MVC.PartialViewResult
    		{
    			ViewName = "SampleWindow"
    
    		};
    	}
    }
    That works thanks!!

Similar Threads

  1. Replies: 8
    Last Post: Sep 28, 2012, 3:42 PM
  2. Replies: 1
    Last Post: Aug 05, 2012, 7:36 PM
  3. Load Usercontrol on DesktopModule
    By Kaveh in forum 2.x Help
    Replies: 6
    Last Post: Apr 28, 2012, 5:59 AM
  4. [CLOSED] Disable/hide desktopmodule / Launcher
    By CarWise in forum 1.x Premium Help
    Replies: 3
    Last Post: Dec 09, 2010, 7:44 AM
  5. How to create DesktopModule object
    By jack_jj in forum 1.x Help
    Replies: 0
    Last Post: Dec 08, 2008, 9:24 AM

Posting Permissions