ejmEditor
5 Jun 202324 minutes to read
The Essential JavaScript Mobile Editor controls are used to display or get the value.
Requires
-
module:jQuery
-
module:ej.core
-
module:ej.unobtrusive
-
module:ej.mobile.core
-
module:ej.data
-
module:ej.touch
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox();
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword();
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea();
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric();
</script>Members
autoFocus Boolean
Specifies the control automatically get focus on initialization.
Default Value:
- false
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-autofocus="true" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ autoFocus: true });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-autofocus="true" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ autoFocus: true });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-autofocus="true" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000", autoFocus: true });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-autofocus="true"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ autoFocus: true });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-autofocus="true" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ autoFocus: true });
</script>borderStyle Enum
Specifies the style of the border. See BorderStyle
Default Value:
- ”box”
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-borderstyle="line" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ borderStyle: "line" });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-borderstyle="line" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ borderStyle: "line" });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-borderstyle="line" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000", borderStyle: "line" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-borderstyle="line"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ borderStyle: "line" });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-borderstyle="line" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ borderStyle: "line" });
</script>cssClass String
Sets the root class for Editor theme. This cssClass API helps to use custom skinning option for Editor Control. By defining the root class using this API, we need to include this root class in CSS.
Default Value:
- ””
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-cssclass="customclass" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ cssClass: "customclass" });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-cssclass="customclass" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ cssClass: "customClass" });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-cssclass="customclass" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000", cssClass: "customclass" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-cssclass="customclass"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ cssClass: "customclass" });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-cssclass="customclass" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ cssClass: "customclass" });
</script>enabled Boolean
Specifies whether to enable or disable the control.
Default Value:
- true
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-enabled=false /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
$("#textbox").ejmTextBox({ enabled: false });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-enabled=false /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
$("#password").ejmPassword({ enabled: false });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-enabled=false data-ej-format="+1 (999) 999-9999" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
$("#maskedit").ejmMaskEdit({ enabled: false, mask: "+1 (999) 999-9999" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-enabled=false></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
$("#textarea").ejmTextArea({ enabled: false });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-enabled=false /><!-- Obtrusive way of rendering -->
<input type="number" id="editor" />
<script>
$("#editor").ejmNumeric({ enabled: false });
</script>enablePersistence Boolean
Specifies to maintain the current model value to browser cookies for state maintenance. While refresh the page, the model value will get apply to the control from browser cookies.
Default Value:
- false
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-enablepersistence=false /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
$("#textbox").ejmTextBox({ enablePersistence: false });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej- enablepersistence =false /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
$("#password").ejmPassword({ enablePersistence: false });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej- enablepersistence =false data-ej-format="+1 (999) 999-9999" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
$("#maskedit").ejmMaskEdit({ enablePersistence: false, mask: "+1 (999) 999-9999" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej- enablepersistence =false></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
$("#textarea").ejmTextArea({ enablePersistence: false });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej- enablepersistence =false /><!-- Obtrusive way of rendering -->
<input type="number" id="editor" />
<script>
$("#editor").ejmNumeric({ enablePersistence: false });
</script>format String
Specifies the ‘format’ for maskedit.
Default Value:
- ””
Example
MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000" });
</script>height String
Specifies the text area height on initialization.
Default Value:
- ””
Example
textarea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-height="200"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ height: "200" });
</script>locale String
Change the Control text format based on given culture.
Default Value:
- “en-US”
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-locale="en-US" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ locale: "en-US" });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-locale="en-US" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ locale: "en-US" });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-locale="en-US" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000", locale: "en-US" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-locale="en-US"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ locale: "en-US" });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-locale="en-US" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ locale: "en-US" });
</script>maxLength String
Specifies the maximum length on initialization.
Default Value:
- ””
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-maxlength ="5" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ maxLength: "5" });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-maxlength ="5 " /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ maxLength: "5" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-maxlength ="5"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ maxLength: "5" });
</script>maxValue Int
Specifies the maximum value of the numeric textbox.
Default Value:
- -(Number.MAX_VALUE)
Example
Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-maxvalue="5" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ maxValue: 5 });
</script>minValue Int
Specifies the minimum value of the numeric textbox.
Default Value:
- Number.MAX_VALUE
Example
Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-minvalue="5" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ minValue: 5 });
</script>readOnly Boolean
Specifies whether to be ‘readonly’ on initialization.
Default Value:
- false
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-readonly=true /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
$("#textbox").ejmTextBox({ readOnly: true });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-readonly=true /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
$("#password").ejmPassword({ readOnly: true });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-readonly=true data-ej-format="+1 (999) 999-9999" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
$("#maskedit").ejmMaskEdit({ readOnly: true, mask: "+1 (999) 999-9999" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-readonly=true></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
$("#textarea").ejmTextArea({ readOnly: true });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-readonly=true /><!-- Obtrusive way of rendering -->
<input type="number" id="editor" />
<script>
$("#editor").ejmNumeric({ readOnly: true });
</script>NOTE
In Numeric textbox Specifies whether the control is read only to disable typing the value manually rather than updating by spin button.
renderMode Enum
Specifies the rendering mode of the control. See RenderMode
Default Value:
- auto
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-rendermode="android" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ renderMode: "android" });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-rendermode="android" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ renderMode: "android" });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-rendermode="android" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000", renderMode: "android" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-rendermode="android"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ renderMode: "android" });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-rendermode="android" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ renderMode: "android" });
</script>step Int
Specifies the step value of numeric textbox for increments / decrements.
Default Value:
- 1
Example
Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-step="5" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ step: 5 });
</script>type Enum
Specifies the textbox type.see Type
Default Value:
- ”text”
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-type="tel" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ type: "tel" });
</script>value String
Specifies the ‘value’ on initialization.
Default Value:
- ””
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-value="Enter here" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ value: "Enter here" });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-value="Enter here" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ value: "Enter here" });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-value="12/12/2012" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000", value: "12/12/2012" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-value ="Enter here"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ value: "Enter here" });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-value="10" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ value: "10" });
</script>watermarkText String
The text to be displayed when the value of the textbox is empty.
Default Value:
- ””
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-watermarktext="Enter here" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ watermarkText: "Enter here" });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-watermarktext="Enter here" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ watermarkText: "Enter here" });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-watermarktext="Enter here" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000", watermarkText: "Enter here" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-watermarktext ="Enter here"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ watermarkText: "Enter here" });
</script>width String
Specifies the width on initialization.
Default Value:
- ””
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-width="200" /><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
//Create the textbox
$("#textbox").ejmTextBox({ width: "200" });
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-width="200" /><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
//Create the password
$("#password").ejmPassword({ width: "200" });
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-width="200" /><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
//Create the maskedit
$("#maskedit").ejmMaskEdit({ format: "00/00/0000", width: "200" });
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-width="200"></textarea><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
//Create the textarea
$("#textarea").ejmTextArea({ width: "200" });
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-width="200" /><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmNumeric({ width: "200" });
</script>Events
keyDown
Event triggers when the KeyDown happens on the control.
| Name | Type | Description | |||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| argument | Object |
Event parameters.
|
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-keydown="keyDown" />
<script>
function keyDown(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
$("#textbox").ejmTextBox({
keyDown: function (args) { //handle the event
}
});
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-keydown="keyDown" />
<script>
function keyDown(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
$("#password").ejmPassword({
keyDown: function (args) { //handle the event
}
});
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-keydown="keyDown" />
<script>
function keyDown(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
$("#maskedit").ejmMaskEdit({
format: "00/00/0000",
keyDown: function (args) { //handle the event
}
});
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-keydown="keyDown"></textarea>
<script>
function keyDown(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
$("#textarea").ejmTextArea({
keyDown: function (args) { //handle the event
}
});
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-keydown="keyDown" />
<script>
function keyDown(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmTextBox({
keyDown: function (args) { //handle the event
}
});
</script>keyUp
Event triggers when the KeyUp happens on the control.
| Name | Type | Description | |||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| argument | Object |
Event parameters.
|
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-keyup="keyUp" />
<script>
function keyUp(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
$("#textbox").ejmTextBox({
keyUp: function (args) { //handle the event
}
});
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-keyup="keyUp" />
<script>
function keyUp(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
$("#password").ejmPassword({
keyUp: function (args) { //handle the event
}
});
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-keyup="keyUp" />
<script>
function keyUp(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
$("#maskedit").ejmMaskEdit({
format: "00/00/0000",
keyUp: function (args) { //handle the event
}
});
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-keyup="keyUp"></textarea>
<script>
function keyUp(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
$("#textarea").ejmTextArea({
keyUp: function (args) { //handle the event
}
});
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-keyup="keyUp" />
<script>
function keyUp(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmTextBox({
keyUp: function (args) { //handle the event
}
});
</script>touchEnd
Event triggers when the TouchEnd happens on the control.
| Name | Type | Description | |||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| argument | Object |
Event parameters.
|
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-touchend="touchEnd" />
<script>
function touchEnd(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
$("#textbox").ejmTextBox({
touchEnd: function (args) { //handle the event
}
});
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-touchend="touchEnd" />
<script>
function touchEnd(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->;
<input id="password" />
<script>
$("#password").ejmPassword({
touchEnd: function (args) { //handle the event
}
});
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-touchend="touchEnd" />
<script>
function touchEnd(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
$("#maskedit").ejmMaskEdit({
format: "00/00/0000",
touchEnd: function (args) { //handle the event
}
});
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-touchend="touchEnd"></textarea>
<script>
function touchEnd(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
$("#textarea").ejmTextArea({
touchEnd: function (args) { //handle the event
}
});
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-touchend="touchEnd" />
<script>
function touchEnd(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmTextBox({
touchEnd: function (args) { //handle the event
}
});
</script>touchStart
Event triggers when the TouchStart happens on the control.
| Name | Type | Description | |||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| argument | Object |
Event parameters.
|
Example
TextBox
<!-- Unobtrusive way of rendering -->
<input id="textbox" data-role="ejmtextbox" data-ej-touchstart="touchStart" />
<script>
function touchStart(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="textbox" />
<script>
$("#textbox").ejmTextBox({
touchStart: function (args) { //handle the event
}
});
</script>Password
<!-- Unobtrusive way of rendering -->
<input id="password" data-role="ejmpassword" data-ej-touchstart="touchStart" />
<script>
function touchStart(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="password" />
<script>
$("#password").ejmPassword({
touchStart: function (args) { //handle the event
}
});
</script>MaskEdit
<!-- Unobtrusive way of rendering -->
<input id="maskedit" data-role="ejmmaskedit" data-ej-format="00/00/0000" data-ej-touchstart="touchStart" />
<script>
function touchStart(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="maskedit" />
<script>
$("#maskedit").ejmMaskEdit({
format: "00/00/0000",
touchStart: function (args) { //handle the event
}
});
</script>TextArea
<!-- Unobtrusive way of rendering -->
<textarea id="textarea" data-role="ejmtextarea" data-ej-touchstart="touchStart"></textarea>
<script>
function touchStart(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<textarea id="textarea"></textarea>
<script>
$("#textarea").ejmTextArea({
touchStart: function (args) { //handle the event
}
});
</script>Numeric
<!-- Unobtrusive way of rendering -->
<input type="number" id="editor" data-role="ejmnumeric" data-ej-touchstart="touchStart" />
<script>
function touchStart(args) {
//handle the event
}
</script><!-- Obtrusive way of rendering -->
<input id="editor" type="number" />
<script>
$("#editor").ejmTextBox({
touchStart: function (args) { //handle the event
}
});
</script>