PDA

View Full Version : [CLOSED] How to add a button inside a DesktopModule



pawangyanwali
Nov 12, 2012, 9:02 PM
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")

))))
)

Baidaly
Nov 12, 2012, 10:53 PM
Hello!

Where exactly you want to place the button?

pawangyanwali
Nov 12, 2012, 11:17 PM
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")

))))
)

Baidaly
Nov 12, 2012, 11:41 PM
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.

pawangyanwali
Nov 13, 2012, 12:30 AM
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"

};
}

}
}

Baidaly
Nov 13, 2012, 2:12 AM
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"

};
}
}

pawangyanwali
Nov 13, 2012, 2:47 AM
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!!