擴展sap.m.Input：onAfterRendering方法不起作用

我爲sap.m.Input創建了自定義擴展。在onAfterRendering我想用jquery-maskmoney使用如下掩蓋值：擴展sap.m.Input：onAfterRendering方法不起作用

$('#'+this.getId()+'-inner').maskMoney({ thousands : '', decimal : '.' });'

當我在控制檯敷面膜，一切工作正常。但是，當我嘗試添加它在onAfterRendering方法，我得到了一些錯誤，當我試圖給setValue：

amountInputControl.setValue(data.amount); // Its is an instance of NumericInput

錯誤：

TypeError: Cannot read property 'val' of undefined 
    at sap.m.InputBase._getInputValue (InputBase.js:9) 
    at sap.m.InputBase.updateDomValue (InputBase.js:32) 
    at sap.m.InputBase.setValue (InputBase.js:34) 
    at sap.ui.controller.updateFieldsForReference //Here was executed operation setValue

NumericInput.js

jQuery.sap.declare("control.customInputTypes.NumericInput"); 
      sap.ui.define(['jquery.sap.global', 'sap/m/Input'], 

       function(jQuery, BaseInput) { 
        "use strict"; 

        var commonControlInput = BaseInput.extend('control.customInputTypes.NumericInput', /** @lends sap.m.Input.prototype */ { 
         metadata: {}, 
         renderer : { 
          render : function(oRm, oControl) { 
           sap.m.InputRenderer.render(oRm, oControl); 
          } 
         } 
        }); 

     commonControlInput.prototype.onAfterRendering = function() { 
        $('#'+this.getId()+'-inner').maskMoney({ thousands : '', decimal : '.' }); 
       }; 

      return commonControlInput; 
    }, /* bExport= */ true);

我甚至沒有觸及InputBase類，所以我不知道什麼是錯的？如果我不應用這個面具一切正常。也許我不能在控件的onAfterRendering方法中使用jQuery？

來源

2016-11-28 Remiwaw

你能提一下SAPUI5版本和jQuery-maskmoney版本嗎？我試過你的代碼，並沒有遇到任何問題。 –

起初我因子評分你可能要檢查sap.m.MaskInput，但我想這不正是你想要的...

無論如何，有幾件事我會在你的代碼改變。這裏是跑步jsbin example：

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>SAPUI5 single file template | nabisoft</title> 
     <script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" 
      id="sap-ui-bootstrap" 
      data-sap-ui-theme="sap_bluecrystal" 
      data-sap-ui-libs="sap.m" 
      data-sap-ui-bindingSyntax="complex" 
      data-sap-ui-compatVersion="edge" 
      data-sap-ui-preload="async"></script> 
      <!-- use "sync" or change the code below if you have issues --> 

     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-maskmoney/3.0.2/jquery.maskMoney.min.js"></script> 

     <!-- XMLView --> 
     <script id="myXmlView" type="ui5/xmlview"> 
      <mvc:View 
       controllerName="MyController" 
       xmlns="sap.m" 
       xmlns:core="sap.ui.core" 
       xmlns:mvc="sap.ui.core.mvc" 
       xmlns:cit="control.customInputTypes"> 

       <cit:NumericInput value="1219999234" /> 

      </mvc:View> 
     </script> 

     <script> 
      sap.ui.getCore().attachInit(function() { 
       "use strict"; 

       //### Custom Control ### 
       // remove the first parameter in "real" apps 
       sap.ui.define("control/customInputTypes/NumericInput",[ 
        "jquery.sap.global", 
        "sap/m/Input", 
        "sap/m/InputRenderer" 
       ], function(jQuery, Input, InputRenderer) { 
        "use strict"; 

        return Input.extend("control.customInputTypes.NumericInput", { 

         init : function() {       
          this.addEventDelegate({ 
          onAfterRendering : function(){ 
           var $input = jQuery("#"+this.getId()+"-inner"); 
           $input.maskMoney({ 
           thousands : ".", 
           decimal : "," 
           }).maskMoney("mask"); 
          }.bind(this) 
          }); 
         }, 

         renderer : InputRenderer 

        }); 
       }); 

       //### Controller ### 
       sap.ui.define([ 
        "sap/ui/core/mvc/Controller" 
       ], function (Controller) { 
        "use strict"; 

        return Controller.extend("MyController", { 
         onInit : function() { 

         } 
        }); 
       }); 

       //### THE APP: place the XMLView somewhere into DOM ### 
       sap.ui.xmlview({ 
        viewContent : jQuery("#myXmlView").html() 
       }).placeAt("content"); 

      }); 
     </script> 

    </head> 

    <body class="sapUiBody"> 
     <div id="content"></div> 
    </body> 
</html>

來源

2016-11-29 15:18:53 Nabi

好吧，它的工作，移動onAfterRendering綁定到init方法幫助。我們仍然有問題的插件：https://github.com/plentz/jquery-maskmoney 正是這一個 https://github.com/plentz/jquery-maskmoney/issues/203 所以我們已經使用 https://github.com/BankFacil/vanilla-masker 和everyting正在工作。感謝您的幫助 – Remiwaw

擴展sap.m.Input：onAfterRendering方法不起作用

回答

相關問題