在LiveChange事件上条形码扫描AutoTrigger

时间:2016-06-21 13:39:33

标签: sapui5

我的SAPUI5应用程序具有条形码扫描功能。首先,用户将看到弹出窗口,他可以在其中执行条形码扫描,如果扫描的条形码是正确的,它将触发“下一步”按钮,然后将显示另一个弹出窗口以进行下一次条形码扫描。对于第一个条形码,用户必须在第二个条形码上扫描6-7个数字,它应该是5.我的问题是第一个条形码的自动触发器。当用户扫描7位数时,它会触发Next 2x。有没有办法知道扫描条形码文本的最后长度?

这是我的TextInput

的liveChange事件
                        liveChange: function(oEvent) {

                        sText = oEvent.getParameter('value');
                        parent1 = oEvent.getSource().getParent();

                            if ((typeof sText != 'undefined') && (sText.length >= 6) )
                            {

                                sap.ui.getCore().byId(t.createId("costCenterInput")).setValue(sText);
                                setTimeout(function() { 
                                    console.log(parent1.getBeginButton());
                                    if (parent1.getBeginButton() != null){
                                    parent1.getBeginButton().firePress(oEvent); 
                                    }

                                    }, 5000);

                            }
                    }

此代码的问题在于外部条形码扫描仪充当蓝牙键盘,一次输入一个数据。所以说我们扫描1234567,进入6后即使超时也会触发,并在进入7时再次触发。

新代码

    onScanAddressMobile: function(){

    var t = this;
    t.oBundle = this.oApplicationFacade.getResourceBundle();
    var dialog = new sap.m.Dialog(t.createId("ccDialog"), {
            title: t.oBundle.getText("COST_CENTER"),
            type: 'Message',
            content: [
                new sap.m.Text({ text: t.oBundle.getText("SCAN_COST_CENTER")}),
                new sap.m.Input(t.createId("costCenterInput"), {
                    type: "Number",
                    liveChange: 

                    function(oEvent){
                        t.onLiveChange(oEvent);
                    }

                }),
      .....some more code here...
      },

      onLiveChange : function(event) {
        //alert("onLiveChange");
                    var value = event.getParameter("value");
                    if (value && value.length === 6) {
                        alert("6 character");
                        this.timer = setTimeout(this.gotoNextPage(value), 4000);  
                    } else if (value && value.length > 6) {
                        alert("6 or more");
                        if (this.timer) {
                          clearTimeout(this.timer);
                        }
                        this.gotoNextPage(value);
                    }
    },

2 个答案:

答案 0 :(得分:3)

通常,条形码扫描仪可以配置为发送'返回'扫描字符末尾的值(或任何其他字符,但Chr(13)最常见,因为它可以在扫描到输入字段时立即提交表单

看看你是否可以配置你的,只需检查最后一个字符(返回)

答案 1 :(得分:0)

作为蓝牙键盘使用的条形码扫描器将非常快速地“锁定”其数据。如果您收到了6位数字,然后没有收到任何250ms的数据,您可以考虑完成条形码并跳到下一页。

如果您已收到7位数字,您甚至不需要再等待,但可以立即跳到下一页。

所以我猜你的代码必须看起来像这样:

onLiveChange : function(event) {
    var value = event.getParameter("value");
    if (value && value.length === 6) {
        this.timer = setTimeout(this.gotoNextPage, 250)  
    } else if (value && value.length > 6) {
        if (this.timer) {
          clearTimeout(this.timer);
        }
        this.gotoNextPage();
    }
}

请在此jsbin中查找稍稍超时的示例:http://jsbin.com/kolacez/1/edit?html,output

这将会发生:

  • Char 1:Nothing
  • Char 2:Nothing
  • Char 3:Nothing
  • Char 4:Nothing
  • Char 5:Nothing
  • 字符6:设置了计时器,如果在特定时间范围内未收到字符7,则表示条形码已完成并将启动gotoNextPage。
  • 字符7:取消定时器并直接启动gotoNextPage。

因此,如果收到7个字符条形码,则执行char 6和char 7的逻辑,但由于取消了char 6的timer-action,gotoNextPage方法只启动一次。