MSComponentBase

Namespace: Wisej.Web.Ext.MobiScroll

Assembly: Wisej.Web.Ext.MobiScroll (4.1.0.0)

• Component
  • Component
    • MSComponentBase

Base class for the MobiScroll components that are attached to an existing control, such as DatePicker and Select.

C#

public abstract class MSComponentBase : Component

VB.NET

Public MustInherit Class MSComponentBase
    Inherits Component

The component is not a control: it loads the MobiScroll packages and, when the control assigned to Control is rendered, creates the MobiScroll component identified by WidgetClass on the first child control of Control, using the current Options. The MobiScroll events listed in WiredEvents are forwarded to the server and raised through the WidgetEvent event.

Example:

The following example attaches a date picker to a panel and shows the selected date in a label.

var picker = new DatePicker(new
{
	controls = new[] { "calendar" },
	display = "inline"
});
picker.WidgetEvent += (s, e) =>
{
	if (e.Type == "onChange")
		this.labelDate.Text = e.Data.valueText;
};
picker.Control = this.panelDate;

Constructors

MSComponentBase(className, options)

Constructs a new instance of the MSComponentBase class.

Name	Type	Description
className	String	The name of the MobiScroll JavaScript function that creates the component, i.e. "mobiscroll.datepicker".
options	Object	Initial set of options.

The constructor also wires the MobiScroll events onCancel, onChange, onClose, onFilter, onOpen, onPosition and onTempChange to the WidgetEvent event.

Throws:

• ArgumentNullException className is null or empty.

Example:

The following example defines a time picker component based on the MobiScroll datepicker.

public class TimePicker : MSComponentBase
{
	public TimePicker()
		: base("mobiscroll.datepicker", new { controls = new[] { "time" } })
	{
	}
}

Fields

Name	Type	Description	Value
WiredEvents	WiredEvents	Lists the MobiScroll events that are forwarded to the server and raised through the WidgetEvent event.

Properties

Control

Control: Gets or sets the control associated with the component.

The MobiScroll component is created in the browser on the first child control of this control, as soon as the control is rendered, using the Options set at that time. Assign this property after the options are set.

Example:

The following example creates a select component on the text box contained in a panel.

// this.panelCity contains this.textBoxCity as its first child control.
var select = new Select(new
{
	data = new[] { "Atlanta", "Berlin", "London", "Paris" }
});
select.Control = this.panelCity;

Options

Object: Returns or sets the dynamic object with the options passed to the MobiScroll component when it is created.

The fields of the object are the options of the MobiScroll component identified by WidgetClass (i.e. display, data, controls) and are read when the component is created in the browser, after Control is assigned and rendered. Changing the options after the component has been created doesn't update it.

The parameterless constructors of the derived classes set this property to null: assign a new object before setting individual fields.

Example:

The following example assigns the options of a select component before attaching it to a panel.

var select = new Select();
select.Options = new
{
	data = new[] { "Small", "Medium", "Large" },
	display = "anchored"
};
select.Control = this.panelSize;

WidgetClass

String: Returns the name of the MobiScroll JavaScript function that creates the component, i.e. "mobiscroll.select".

The value is set by the constructor of the derived class.

Methods

OnAddReferences(list)

Ensures the Control exists in the ComponentManager.

Parameter	Type	Description
list	IList

OnWebEvent(e)

Parameter	Type	Description
e	WisejEventArgs

OnWebRender(config)

Parameter	Type	Description
config	Object

OnWidgetEvent(e)

Raises the WidgetEvent event.

Parameter	Type	Description
e	WidgetEventArgs	A WidgetEventArgs with the name of the MobiScroll event and its data.

It is called for every event received from the MobiScroll component. Derived classes can override it to process specific events, and must call the base implementation to raise WidgetEvent.

Example:

The following example traces the events of a date picker before they are raised to the application.

public class TracingDatePicker : DatePicker
{
	public override void OnWidgetEvent(WidgetEventArgs e)
	{
		System.Diagnostics.Trace.WriteLine($"MobiScroll event: {e.Type}");

		base.OnWidgetEvent(e);
	}
}

Events

WidgetEvent

EventHandler<WidgetEventArgs> Fired when the MobiScroll component raises one of the events listed in WiredEvents.

Type is the name of the MobiScroll event, i.e. "onChange", and Data is a dynamic object with a copy of the event arguments received from the component.

Example:

The following example updates the form when the user changes the date and when the picker is closed.

this.datePicker1.WidgetEvent += (s, e) =>
{
	switch (e.Type)
	{
		case "onChange":
			this.labelDate.Text = e.Data.valueText;
			break;

		case "onClose":
			this.buttonSave.Enabled = true;
			break;
	}
};

Inherited By

Name	Description
DatePicker	The Mobiscroll Datepicker component lets you select a date, a time, or a range of dates using a calendar or scroller wheels.
Select	The Mobiscroll Select component lets you pick a single or multiple values from a list of options.

Implements

Name	Description
IUserData
IWisejComponent
IWisejSerializable