扩展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方法不起作用

回答

相关问题