Contents
- Properties
- Methods
- Events
Having trouble getting help?
Contact Support
Contact Support
Ej1 api migration in EJ2 TypeScript Radio button control
2 May 20235 minutes to read
This article describes the API migration process of RadioButton component from Essential JS 1 to Essential JS 2.
Properties
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
RadioButton Label |
Property: text new ej.RadioButton($(“#radiobutton”), { text: “RadioButton” }); |
Property: label let radioButton: RadioButton= new RadioButton({ label: “RadioButton” }); radioButton.appendTo(“#radiobutton”); |
Checked state |
Property: checked new ej.RadioButton($(“#radiobutton”), { checked: true }); |
Property: checked let radioButton: RadioButton= new RadioButton({ checked: true }); radioButton.appendTo(“#radiobutton”); |
Adding custom class |
Property: cssClass new ej.RadioButton($(“#radiobutton”), { cssClass: “custom-class” }); |
Property: cssClass let radioButton: RadioButton= new RadioButton({ cssClass: “custom-class” }); radioButton.appendTo(“#radiobutton”); |
Disabled state |
Property: enabled new ej.RadioButton($(“#radiobutton”), { enabled: false }); |
Property: disabled let radioButton: RadioButton= new RadioButton({ disabled: true }); radioButton.appendTo(“#radiobutton”); |
State persistence |
Property: enablePersistence new ej.RadioButton($(“#radiobutton”), { enablePersistence: true }); |
Property: enablePersistence let radioButton: RadioButton= new RadioButton({ enablePersistence: true }); radioButton.appendTo(“#radiobutton”); |
RTL |
Property: enableRTL new ej.RadioButton($(“#radiobutton”), { enableRTL: true, text: “RadioButton” }); |
Property: enableRtl let radioButton: RadioButton= new RadioButton({ enableRtl: true, label: “RadioButton” }); radioButton.appendTo(“#radiobutton”); |
HTML Attributes |
Property: htmlAttributes new ej.RadioButton($(“#radiobutton”), { htmlAttributes : { required:”required” }, text: “RadioButton” }); |
Not applicable |
Id property |
Property: id new ej.RadioButton($(“#radiobutton”), { id: “sync” }); |
Not applicable |
Prefix value of Id |
Property: idPrefix new ej.RadioButton($(“#radiobutton”), { idPrefix: “ej” }); |
Not applicable |
Name attribute |
Property: name new ej.RadioButton($(“#radiobutton”), { name: “sports” }); |
Property: name let radioButton: RadioButton= new RadioButton({ name: “sports” }); radioButton.appendTo(“#radiobutton”); |
Value attribute |
Property: value new ej.RadioButton($(“#radiobutton”), { value: “football”, name: “sports” }); |
Property: value let radioButton: RadioButton= new RadioButton({ value: “football”, name: “sports” }); radioButton.appendTo(“#radiobutton”); |
Size |
Property: size new ej.RadioButton($(“#radiobutton”), { size: “small” }); |
Property: cssClass let radioButton: RadioButton= new RadioButton({ cssClass: “e-small” }); radioButton.appendTo(“#radiobutton”); |
Validation rules |
Property: validationRules new ej.RadioButton($(“#radiobutton”), { validationRules:{ required:true } }); |
Not applicable |
Validation message |
Property: validationMessage new ej.RadioButton($(“#radiobutton”), { validationRules:{ required:true }, validationMessage: { required: “Required RadioButton value” } }); |
Not applicable |
Methods
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Destroy |
Method: destroy var radioButton = new ej.RadioButton($(“#radiobutton”), { text: “RadioButton” }); radioButton.destroy() |
Method: destroy let radioButton: RadioButton= new RadioButton({ label: “RadioButton” }); radioButton.appendTo(“#radiobutton”); radioButton.destroy(); |
Disable the RadioButton |
Method: disable var radioButton = new ej.RadioButton($(“#radiobutton”), { text: “RadioButton” }); radiobutton.disable() |
Not applicable |
Enable the RadioButton |
Method: enable var radioButton = new ej.RadioButton($(“#radiobutton”), { text: “RadioButton” }); radiobutton.enable() |
Not applicable |
Events
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
BeforeChange Event |
Events: beforeChange var radioButton = new ej.RadioButton($(“#radiobutton”), { beforeChange: function (args) { /** code block */ } }); |
Not applicable |
Change Event |
Events: change var radioButton = new ej.RadioButton($(“#radiobutton”), { change: function (args) { /** code block */ } }); |
Events: change let radioButton: RadioButton= new RadioButton({ change: (args) => { /** code block */ } }); radioButton.appendTo(“#radiobutton”); |
Create Event |
Events: create var radioButton = new ej.RadioButton($(“#radiobutton”), { create: function (args) { /** code block */ } }); |
Events: created let radioButton: RadioButton= new RadioButton({ created: () => { /** code block */ } }); radioButton.appendTo(“#radiobutton”); |
Destroy Event |
Events: destroy var radioButton = new ej.RadioButton($(“#radiobutton”), { destroy: function (args) { /** code block */ } }); |
Not applicable |