How to handle calling a function without oEvent

Question

I have a CheckBox with a handler attached to the select event. In this function is the code to dynamically populate/ display few fields. If I come on the screen and the data brings in a value which makes the checkbox selected already, then those fields are not displayed (because they become visible only when I select the checkbox).

I want to ensure that if the CheckBox is auto selected, still I should be able to process the logic in the function, which has oEvent as an input parameter. But the issue is that if I call this function from another method, that function does not work as it has many statements like oEvent().getSource() which I do not pass.

Controller.js

onCheckBoxSelect: function(oEvent) {
  var cells = sap.ui.getCore().byId("cell");
  controlCell.destroyContent();
  vc.abc();
  var material= sap.ui.getCore().byId("abc");
  var isSelected = oEvent.getParameters("selected").selected;
  if (isSelected) {
    // ...
  }
},

someFunction : function(){
  if(true){
    // want to call onCheckBoxSelect here
  }
  // ...
},

Answer 1

I would suggest a different approach. Use the same property that you have used in your checkbox binding, to determine the visibility of the other fields, i.e. bind the visible property of each relevant field to that property in your model.

If there is additional post-processing required in populating the fields, you can either use expression binding or custom formatter for field-specific processing, or model binding events if you need to do a bit more "staging" work (in which case you would probably store the resultant data in a client model and bind to that for populating your fields).

Answer 2

If you assign an ID to your checkbox, you can get the checkbox in any function you want as long as it is known in the view. By doing that you won't need the oEvent which is only available when an event on the checkbox is executed.

Example:

var cb = this.byId('checkboxId');
if(cb.getProperty('selected')) {
  // execute code
} else {
  // do something else
}

Answer 3

Decouple the handler body into a separate function so that other functions can call the decoupled function with the right arguments. For example:

Controller

onCheckBoxSelect: function(oEvent) {
  const bSelected = oEvent.getParameter("selected");
  this.doIt(bSelected); // Instead of "doing it" all here
},

someFunction: function(){
  if (/*Something truthy*/) {
    const checkBox = this.byId("myCheckBox");
    const bSelected = checkBox.getSelected();
    doIt(bSelected); // passing the same argument as in onCheckBoxSelect
  }
  // ...
},

doIt: function(bSelected) { // decoupled from onCheckBoxSelect
  // ...
  if (bSelected) {
    // ...
  }
},

View

<CheckBox id="myCheckBox"
  select=".onCheckBoxSelect"
/>

Or since 1.56:

<CheckBox id="myCheckBox"
  select=".doIt(${$parameters>/selected})"
/>

^{Docu: Handling Events in XML Views}

By that, you can have a pure, decoupled function that can be called from anywhere.