How To Reset Controls To Their Initial Values In Sapui5?

I have a form with a lot of controls (ComboBoxes, TextAreas, RadioButtons) using OpenUI5. I give the values of the controls on the server side in C++. What I want is to have a rese

Solution 1:

Use the API of the respective control. sap.m.ComboBox features the method setSelectedKey(sKey). sap.m.TextArea features the method setValue(sValue). sap.m.RadioButton features the method setSelected(bSelected).

Bind a press event to your reset button. in your press event get the form's controls. then reset the form's controls to their initial states with their respective methods.

<!-- in your e.g. xml view --><Buttontype="Reject"text="Reset"press="onPressResetButton"></Button>

// in your js controller
onPressResetButton: function() {
  ...
  var oComboBox = this.byId("your-combo-box-id");
  oComboBox.setSelectedKey("your-initial-item-key");
  ...
}

Get the initial values for the form's controls from your backend or keep them in a local model in the frontend.

Solution 2:

I think the best way to achieve this is to have two models. One is your odata model which fetches data from server and second is to have local json model.

1. Fetch data from odata and assign it to local model.
2. Bind the local model to the Form
3. Doesn't matter user changes data on form. Local model will be affected.
4. When user presses reset button. Assign your odata model data to local model again that way the default values will be binded again.

Hope this approach helps.