PDA

View Full Version : [CLOSED] Customizing and using Portlet Header Tools



PriceRightHTML5team
Jul 17, 2013, 12:48 PM
In my portlet header I was able to hide the Collapse and Close buttons. I want to add some of my own such as a Cog for settings and a Drag handle to indicate to the user that you can move the portlet.

How do I create custom buttons and assign events, using Ext.Net MVC?

What are some other default buttons I can add here?

What's the difference between a topbar and a toolbar?

I see in this extjs example there are several tools in the panel header, such as: pin, refresh, search and save. How do I uses these? Wire-up events to them ect.

http://docs.sencha.com/extjs/4.2.1/#!/example/build/KitchenSink/ext-theme-neptune/#basic-buttons




Thanks,
-Rob




portlet = Html.X().Portlet()
.ID("portlet-" + widget.WidgetId)
.Data(widget.WidgetId)
.ContentFromPartial(widget.WidgetUrl, widgetViewModel)
.Title(widget.WidgetName)
.Closable(false)
.HideCollapseTool(true)
.MinHeight(250);

Daniil
Jul 17, 2013, 4:52 PM
Hi @PriceRightHTML5team,



How do I create custom buttons and assign events, using Ext.Net MVC?

What are some other default buttons I can add here?


Please use a Panel's Tool.
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.panel.Tool

Example

@{
var X = Html.X();
}

<!DOCTYPE html>
<html>
<head>
<title>Ext.Net.MVC v2 Example</title>
</head>
<body>
@Html.X().ResourceManager()

@(X.Portal()
.Items(
X.PortalColumn()
.Items(
X.Portlet()
.Title("Portlet")
.Tools(
X.Tool().Type(ToolType.Up).Handler("alert('Up');"),
X.Tool().Type(ToolType.Down).Handler("alert('Down');")
)
)
)
)
</body>
</html>




What's the difference between a topbar and a toolbar?


The TopBar is a Panel's property. You can configure a Toolbar instance and assign to it. It will appear at the top of a Panel.