Question

在我的应用程序中，我有一个由smartform组成的XML视图。我需要访问在解析和呈现smartform之后可用的输入元素（通过sap.ui.getCore().byId()）。

我的视图控制器中的onAfterRendering会在渲染视图后立即触发（我获取所有非智能形式的元素，如标题等），但在解析和渲染smartform之前。通过alert进行的初步测试也证明了这一点。

是否有任何事件在smartform渲染后触发，我可以挂钩访问我的输入元素？

开发人员指南walkthrough正在扩展smartform，因此有init方法，但在我的情况下，我正在扩展基本控制器，而我的初始化用于页面视图。

感谢您的任何指示。

我的观点：

<mvc:View
controllerName="myns.controller.Add"
xmlns:mvc="sap.ui.core.mvc"
xmlns:semantic="sap.m.semantic"
xmlns:smartfield="sap.ui.comp.smartfield"
xmlns:smartform="sap.ui.comp.smartform"
xmlns="sap.m">
<semantic:FullscreenPage
    id="page"
    title="{i18n>addPageTitle}"
    showNavButton="true"
    navButtonPress="onNavBack">
    <semantic:content>
        <smartform:SmartForm
            id="form"
            editable="true"
            title="{i18n>formTitle}"
            class="sapUiResponsiveMargin" >
            <smartform:Group
                id="formGroup"
                label="{i18n>formGroupLabel}">
                <smartform:GroupElement>
                    <smartfield:SmartField
                        id="nameField"
                        value="{Name}"   />
                </smartform:GroupElement>
            </smartform:Group>
        </smartform:SmartForm>
    </semantic:content>
    <semantic:saveAction>
        <semantic:SaveAction id="save" press="onSave"/>
    </semantic:saveAction>
    <semantic:cancelAction>
        <semantic:CancelAction id="cancel" press="onCancel"/>
    </semantic:cancelAction>
</semantic:FullscreenPage>

我的控制器：

sap.ui.define([
"myns/controller/BaseController",
"sap/ui/core/routing/History",
"sap/m/MessageToast"
],function(BaseController, History, MessageToast){
"use strict";
return BaseController.extend("myns.controller.Add",{
     onInit: function(){
         this.getRouter().getRoute("add").attachPatternMatched(this._onRouteMatched, this);
     },
     onAfterRendering: function(){
        //I tried my sap.ui.getCore().byId() here but does not work
        //An alert shows me this triggers before the smartform is rendered but 
        //after all the other non-smartform elements have rendered
     },
    _onRouteMatched: function(){
        // register for metadata loaded events
        var oModel = this.getModel();
        oModel.metadataLoaded().then(this._onMetadataLoaded.bind(this));
    },
    _onMetadataLoaded:function(){
        //code here....
    },
     onNavBack: function(){
        //code here....
     }
});

}）;

Answer 1

您可以查找SmartForm添加到DOMNodeInserted事件为jQuery的DOM时。为此，您可以使用id标识SmartForm已添加到DOM。

每个UI5元素在添加到DOM后都会获得一些前缀。

例如__xmlview0 - 形式。

因此，为了确保添加所需的表单，您可以split添加元素的ID，然后将其与您提供的ID进行比较。

虽然这不是最佳解决方案，但你可以试试。

onAfterRendering: function() {
    $(document).bind('DOMNodeInserted', function(event) {
        var aId = $(event.target).attr("id").split("--");
        var id = aId[aId.length - 1];
        if (id) {
            if (id == "form") {
                // smart form fields are accessible here
                $(document).unbind("DOMNodeInserted");
            }
        }
    })
}

Answer 2

我的最终解决方案（暂时使用@Dopedev提供的接受答案）：

（在包含smartform的嵌套视图的控制器中）

onAfterRendering: function() {
    $(document).bind('DOMNodeInserted', function(event) {
        var elem = $(event.target);
        var aId = elem.attr("id").split("--");
        var id = aId[aId.length - 1];
        if (id) {
            if (id == "nameField") {
                elem.find("input").on({
                    focus: function(oEvent) {
                        //code here;
                    },
                    blur: function(oEvent) {
                        //code here;
                    }
                });
                /*
               elem.find("input").get(0).attachBrowserEvent("focus", function(evt) {
                    //code here
                }).attachBrowserEvent("blur", function(ev) {
                    //code here
                });
                */
                $(document).unbind("DOMNodeInserted");
            }
        }
    });
}

UI5中针对smartform的onAfterRendering挂钩

2 个答案: