F4 Value Help 30초 만에 완성 #shorts #SAP #Fiori

직접 해보기

1. XML View에 F4 아이콘 추가

sap.m.Input에 showValueHelp: true를 설정하면 F4 아이콘이 자동으로 나타납니다. 클릭 시 valueHelpRequest 이벤트가 발생하므로 여기서 Dialog를 열면 됩니다.

// XML View
<Input showValueHelp="true"
       valueHelpRequest=".onValueHelpRequest" />

// Controller
onValueHelpRequest: function() {
  if (!this._oDialog) {
    Fragment.load({
      name: "myApp.view.ValueHelp",
      controller: this
    }).then(function(oDialog) {
      this._oDialog = oDialog;
      this.getView().addDependent(oDialog);
      oDialog.open();
    }.bind(this));
  } else {
    this._oDialog.open();
  }
},

onConfirm: function(oEvent) {
  var oItem = oEvent.getParameter("selectedItem");
  this.byId("supplierInput").setValue(oItem.getTitle());
  this._oDialog.destroy();
  this._oDialog = null;
}

참고: ABAP Search Help vs Fiori Value Help

ABAP에서는 SE11에서 Search Help(SHPM/SHPD)를 정의해 필드에 연결하지만, UI5 Fiori에서는 OData 서비스를 백엔드로 사용하는 ValueHelpDialog를 직접 구성합니다. 최신 Fiori Elements는 @Common.ValueList 어노테이션 하나로 자동 생성됩니다.

showValueHelp="true" + valueHelpRequest 이벤트로 수동 dropdown 없이 깔끔한 F4 팝업을 만든다.