Common Properties

Shared features and properties among all Wisej controls.

All Wisej controls are derived from the Wisej.Web.Control class and share many common properties and methods. While some properties are obvious: BackColor, Font, Text, etc. some other are related to more advanced functionality usually not found in any other web system.

The list below is not complete, but it provides a lot of useful information.

Anonymous

When true, the control is "transparent" to pointer events. If you place a Button on a Page and set the property Anonymous of the button to true, when the user clicks on the button, the event will bubble to Page and will fire on the Page: the button is completely transparent to the pointer.

Some events have the OriginalTarget property. If you have an event that carries the OriginalTarget, you can retrieve which anonymous control the user interacted with.

AppearanceKey

It's the name of the appearance in the theme that a control uses to style itself in the browser.

The value is null by default, which means that the control will use its default appearance name.

Retrieve the default appearance name by casting the control to Wisej.Core.IWisejControl, like this: ((Wisej.Core.IWisejControl)this).AppearanceKey;

AllowDrag

Enables a control to initiate Drag & Drop operations. When false (default), drag & drop is disabled for the control.

Drag & Drop

AllowDrop

Enables a control be the target of the Drag & Drop operation. When false (default), the control will deny the drop operation.

Drag & Drop

Capture

When true, all pointer events, anywhere on the browser and on any control, are captured and redirected to the control capturing the pointer. A resize action is an example of capturing the pointer.

Fires the ⚡ MouseCaptureChanged on the control losing the capture and on the control gaining the capture.

Movable

When true, the user is able to grab and move the control. When the user starts moving the control, it will fire the StartMove event. When done, it will fire the EndMove event and the control's Location property will be updated with the new location.

Move & Resize

ResizableEdges

Allows you to enable any of the four sides of any control to become draggable and resizable. When the user starts resizing a control, it will fire the StartResize event. When done it will fire the EndResize event and the control's Size property will be updated with the new dimensions.

Move & Resize

Dock

Determines how a control is resized with its parent. The priority of the docking is determined by the order of the controls.

button1 is last in the controls collection

button1 is first in the controls list

At design time use SendToBack() or BringToFront() or Controls.SetChildIndex() to alter the position of a control in the collection and adjust the docking priority.

Docking also works with Padding. The padding of a container reduces the space used by the docked child controls.

Docking is also affected by the control position in the control list. Controls first are close to the viewer in a hypothetical 3D model.

Anchor

Anchoring is similar to Docking but it "anchors" a specific side to the parent's control and keeps the relative distance.

In the designer you can use the tiny arrows that show next to the four sides to anchor or un-anchor a side. To prevent accidental anchoring, you can turn off the visual shortcut in the design toolbar using the "Show/Hide Anchors"

When a control is not docked on both sides the relative distance is preserved proportionally on both sides. It can be used to keep a control centered vertically or horizontally.

BackgroundImage

All controls expose the BackgroundImage, BackgroundImageSource, and BackgroundImageLayout properties. They allow you to define the background of any control, in addition to any image property that the control may have.

Button with a BackgroundImage

States

Represents an array of system and custom states. The States property allows you to add system states or define your own states and style them in the theme.

ClientEvents

The ClientEvents property is a collection of JavaScript events and code that runs in the browser when the event is fired. In the JavaScript handler code refer to the event argument as "e".

CssClass & CssStyle

CssStyle accepts any CSS string that will be rendered on the client directly in the style attribute of the widget's main element.

CssClass is similar to CssStyle but it accepts one or more CSS class names and adds them to the class attribute of the widget's main element.

InitScript

In InitScript you can add any JavaScript that will run when the control is first created in the browser. The script runs in the control's context (this = widget).

Enabled

Enables or disables a control and all its children at any level. Disabled controls are rendered as enabled in the designer.

When reading the value of the Enabled property you may get _false _even when you have set the property to true if any parent is disabled.

Visible

Hides or shows a control. Controls are rendered on the client only when they are made visible once.

Setting Visible to true is the same as calling the Show() method, and setting it to false is the same as calling the Hide() method.

Invisible controls are visible in design mode. You can hide the invisible control by turning off the "Show Hidden Controls" option in the toolbar.

When reading the value of the Visible property you may get _false _even when you have set the property to _true _if any parent is not visible.

ShowLoader

Every Wisej control has the ShowLoader property; when set to true, the control is blocked by an ajax spinner.

There is an Application.ShowLoader property that blocks the entire page.

If you need to run long operations and want to show a loader to block a control, you must either update the client using Application.Update() after setting the ShowLoader property to true, or execute the code after setting ShowLoader to true asynchronously.

TabStop & TabIndex

Most Wisej controls expose the TabStop and TabIndex properties. TabStop controls whether a participates in the tabbing order. TabIndex indicates the tabbing order of the control within the parent.

Tab Order

ToolTipText

Sets the tooltip text on any control.

You can alter the shared tooltip widget using the Tooltip component. Most aspects of the tooltip system can be changed in the theme under the "tooltip" appearance key.