How to Check If an UI5 Control Is Rendered? - sapui5

Question

I am opening a popover on a specific control inside a FlexColumnLayout. Depending on the screensize it will not be rendered once the mid column is expanded.
I'd like to check if the cotrol is rendered before opening the popover, but i cant seem to find a property that allows that.
Already tried the solutions of this post:
Check if a control is currently rendered and visible
If you want to test around in actuall code just use the demo App of the FlexColumnLayout and try to open a popup on one of the hidden buttons when the begin column is expanded.
Thanks for your help, Eric
Edit 27.08.18 (code in question):
Controller:
/**
* Listner. Triggered when help is canceled.
* Closes popover.
* #author WN00096217 (Eric Schuster)
* #memberof xxxxxxxxxxxx
* #function onHelpCancel
*/
onHelpCancel: function () {
var iHelp = this._oHelpModel.getProperty("/counter");
this._oHelpModel.setProperty("/counter", 0);
this._oHelpModel.getProperty("/p" + iHelp).close();
},
/**
* Listner. Triggered when help is continue.
* Closes popover, opens next popover.
* #author WN00096217 (Eric Schuster)
* #memberof xxxxxxxxxxxxxxxxxxx
* #function onHelpNext
*/
onHelpNext: function () {
var iHelp = this._oHelpModel.getProperty("/counter");
this._oHelpModel.setProperty("/counter", iHelp + 1);
this._oHelpModel.getProperty("/p" + iHelp).close();
this._oHelpModel.getProperty("/p" + (iHelp + 1)).openBy(this._oHelpModel.getProperty("/c" + (iHelp + 1)));
},
controller (part of innit):
this._oHelpModel.setProperty("/c0", this._oView.byId("xxxxx"));
this._oHelpModel.setProperty("/c1", this._oView.byId("xxxx"));
this._oHelpModel.setProperty("/c2", this._oView.byId("xxxxx"));
this._oHelpModel.setProperty("/c3", this._oView.byId("xxxxxx"));
this._oHelpModel.setProperty("/c4", this._oView.byId("xxxxxx"));
this._oHelpModel.setProperty("/c5", this._oView.byId("xxxxx"));
this._oHelpModel.setProperty("/c6", this._oView.byId("xxxxx"));
this._oHelpModel.setProperty("/c7", this._oView.byId("xxxxxx"));
this._oHelpModel.setProperty("/c8", this._oView.byId("xxxxx"));
Component (part of innit):
//p eq popover c eq controll
var oHelpModel = new JSONModel({
counter: 0,
p0: null,
c0: null,
p1: null,
c1: null,
p2: null,
c2: null,
p3: null,
c3: null,
p4: null,
c4: null,
p5: null,
c5: null,
p6: null,
c6: null,
p7: null,
c7: null,
p8: null,
c8: null
});
this.setModel(oHelpModel, "helpModel");
What i d like the controler to look like:
/**
* Listner. Triggered when help is continue.
* Closes popover, opens next popover.
* #author WN00096217 (Eric Schuster)
* #memberof xxxxxxxxxxxxxxxxx
* #function onHelpNext
*/
onHelpNext: function () {
var iHelp = this._oHelpModel.getProperty("/counter");
if("control is rendered"){
this._oHelpModel.setProperty("/counter", iHelp + 1);
this._oHelpModel.getProperty("/p" + iHelp).close();
this._oHelpModel.getProperty("/p" + (iHelp + 1)).openBy(this._oHelpModel.getProperty("/c" + (iHelp + 1)));
} else {
this._oHelpModel.setProperty("/counter", iHelp + 1);
this.onHelpNext();
return;
}
},

Answer 1

use the control's onAfterRendering event. in your corresponding view's controller:
var oControl = this.byId("yourControl");
oControl.addEventDelegate({
onAfterRendering: function() {
// your confirmation that the control is rendered
}
}
UPDATE after op's clarification:
give the control an id if it doesn't have an id yet. get the control by its id. check if the control is active. in your corresponding view's controller:
var oControl = this.byId("yourControl");
oControl.isActive(); // true if the control is visible