This article describes the API migration process of RadioButton component from Essential JS 1 to Essential JS 2.
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 |
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 |
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 |