HtmlContentPopup.CustomizeTemplate Event
Fires before a popup is shown on-screen and allows you to modify the HTML-CSS template of this HtmlContentPopup component.
Namespace: DevExpress.XtraEditors
Assembly: DevExpress.XtraEditors.v24.2.dll
Declaration
Event Data
The CustomizeTemplate event's data class is DxHtmlElementEventArgs. The following properties provide information specific to this event:
| Property | Description |
|---|---|
| Bubbles | Returns whether this element can pass an event up along the tree, to its parent HTML elements. You can enable the CancelBubble property to stop an event at this control level. See any “HtmlElementMouse~” event description for more details on bubbling (for example, WinExplorerView.HtmlElementMouseClick). |
| CancelBubble | Specifies whether this element should pass an event to its parent elements. See any “HtmlElementMouse~” event description for more information about bubbling (for example, WinExplorerView.HtmlElementMouseClick). |
| CurrentTarget | |
| Element | |
| ElementId | Returns the unique identifier of an HTML element. Element IDs are set in HTML markup (the “id” property). See any “HtmlElementMouse~” event description for more information (for example, WinExplorerView.HtmlElementMouseClick). |
| NodeName | |
| RootElement | |
| SuppressOwnerEvent | Specifies whether a control whose HTML element triggered this event should raise its own related event. See any “HtmlElementMouse~” event description for more information (for example, WinExplorerView.HtmlElementMouseClick). |
| TagName | |
| Target |
The event data class exposes the following methods:
| Method |
|---|
| HasClassName(String, Boolean) |
| HasId(String, Boolean) |
| HasTag(String, Boolean) |
Remarks
Use FindElement... methods to find an element within a template. You can search for elements that need to be modified by their tags, CSS classes, and IDs. The FindElementsByTag and FindElementsByClass methods return a list of all matching elements, whereas the FindElementById method returns a single element.
When an element that you want to modify is located, use the Style.SetProperty method that takes two parameters: the attribute name and new attribute value (if no attribute with such name was found, it is added to the CSS style).
The code sample below illustrates how to locate a <div> element with the specific ID, and change its background color.
void OnCustomizeTemplate(object sender, DevExpress.Utils.Html.DxHtmlElementEventArgs e) {
var topDivElement = e.Element.FindElementById("parentDiv");
topDivElement.Style.SetProperty("background-color", "Orange");
}