SAP UI5 combo box - disable editing in the control


1.sapui5 framework
2.basic javascript knowledge

What we are going to do is simple.We will create a combobox and then we will access HTML DOM and disable the input field that is contained in the combobox.

1.Create ComboBox control and place it in the page.

var comboboxName = new sap.m.ComboBox("comboboxId", {
    items: [sap.ui.core.Item({
        text: "item1"
2.Access HTML DOM inside onAfterRendering method and disable input field of combobox.

comboboxName.onAfterRendering = function() {
    if (sap.m.ComboBox.prototype.onAfterRendering) {
    document.getElementById("comboboxId-inner").disabled = true;
See it in action below

ComboBox Editing Disabled

This method is not recommendable.But I didnt find any other way to achieve this.Also keep in mind that if sapui5 development team change innerworking of combobox this code may not work if sapui5 libraries are updated.
If you enjoyed this post, Please Share!!


Post a Comment

Powered by Blogger.