2017-03-09 15 views
1

我在這裏瘋了...我已經花了超過16個小時試圖讓這個東西上班,如果有人有任何線索,這種邪惡行爲的原因請諮詢..如何用mottie鍵盤輸入美分並將它們保留在那裏?

我有多個輸入在那裏我連接鍵盤這樣每個輸入的表單內型號:因爲它應該

$('.amount').keyboard({ 
    layout: 'custom', 
    customLayout : { 
     'normal' : ['1 2 3', '4 5 6', '7 8 9','{clear} 0 {bksp}','{accept}'] 
    }, 

    display : { 
     'accept' : 'Confirm:Confirm (Shift-Enter)', 
     'bksp' : 'Delete:Delete', 
     'clear': 'Clear:Clear' 
    }, 

    beforeVisible: function(e, keyboard, el) { 
     $("#"+keyboard.$keyboard[0].id).addClass("hide-me"); 
    }, 

    restrictInput: true, 
    preventPaste: true, 
    autoAccept: true, 
    usePreview: false, 
    useWheel: false, 
    repeatRate: 0, 

    // this function is so I can display cents in the input 
    // there is no decimal in the keyboard as part of the requirements 
    change: function(e, keyboard, el) { 
     if (el.value === null || el.value === "") { 
      el.value = "0.00"; 
     } 

     el.value = parseInt(el.value); 
     el.value = el.value * 0.01; 
    }, 

    // this function is so I can display cents in the inputs 
    // there is no decimal in the keyboard as part of the requirements 
    accepted: function(e, keyboard, el) { 
     if (el.value === null || el.value === "") { 
      el.value = "0.00"; 
     } 

     el.value = parseInt(el.value); 
     el.value = el.value * 0.01; 
    }, 

    caretToEnd: 'true', 
    maxLength : '20', 
    css: { 
     container: 'center-block dropdown-menu custom-keypad', 
     buttonDefault: 'btn-kb', 
     buttonHover: 'btn-primary', 
     buttonAction: 'active', 
     buttonDisabled: 'disabled' 
    } 
}); 

鍵盤彈出,我可以正確地看到我輸入小數爲I型和我確認我的輸入。我的目標是總結所有input.val(),並在窗體上發生任何更改後立即驗證它們。這樣做的功能是這樣的:

$('form').on('change', '.amount', function() { 
     var balance = NUMBER; 
     var sum = 0; 

     $(".amount").each(function(){ 
      var valTotal = Number($(this).val()); 
      if (!isNaN(valTotal)) { 
       sum += valTotal; 
      } 
     }); 

     if (sum > balance) { 
      //stuff happens 
     } 

    });//.end of form 

這裏是問題的開始,當我去總結投入,我的小數消失!現在2222是2222,所以我的總數是錯的,導致我的總額總是大於我的餘額。我試圖創建一個小提琴,但它不會彈出的結果框的鍵盤,所以我不能告訴你一個活生生的例子..

這是CDN的我使用的是:

https://cdnjs.cloudflare.com/ajax/libs/virtual-keyboard/1.26.17/js/jquery.keyboard.extension-all.min.js

https://cdnjs.cloudflare.com/ajax/libs/virtual-keyboard/1.26.17/js/jquery.keyboard.min.js

請告知!

回答

2

因此,我與插件的創建者取得了聯繫,他很友善地通過電子郵件回答我的問題。他的解決方案非常完美

你可以看到小提琴就在這裏.. http://jsfiddle.net/Mottie/egb3a1sk/2506/

/* VIRTUAL KEYBOARD DEMO - https://github.com/Mottie/Keyboard */ 
$(function() { 

    // this function is so I can display cents in the input 
    // there is no decimal in the keyboard as part of the requirements 
    function convert(el) { 
    var value = el.value; 
    if (el.value === null || el.value === "") { 
     value = "0.00"; 
    } 
    value = parseInt(value, 10); 
    value = value * 0.01; 
    el.value = value.toFixed(2); 
    } 

    NUMBER = 100; 
    function sum() { 
    var balance = NUMBER; 
    var sum = 0; 
    $(".amount:not(:disabled)").each(function() { 
     var valTotal = Number($(this).val()); 
     if (!isNaN(valTotal)) { 
     sum += valTotal; 
     } 
    }); 
    if (sum > balance) { 
     //stuff happens 
    } 
    $('.sum').text(sum); 
    } 

    $('.amount').keyboard({ 
    layout: 'custom', 
    customLayout: { 
     'normal': ['1 2 3', '4 5 6', '7 8 9', '{clear} 0 {bksp}', '{accept}'] 
    }, 

    display: { 
     'accept': 'Confirm:Confirm (Shift-Enter)', 
     'bksp': 'Delete:Delete', 
     'clear': 'Clear:Clear' 
    }, 

    beforeVisible: function(e, keyboard, el) { 
     $("#" + keyboard.$keyboard[0].id).addClass("hide-me"); 
    }, 

    restrictInput: true, 
    preventPaste: true, 
    autoAccept: true, 
    usePreview: false, 
    useWheel: false, 
    repeatRate: 0, 

    change: function(e, keyboard, el) { 
     convert(el); 
    }, 
    accepted: function(e, keyboard, el) { 
     convert(el); 
     sum(); 
    }, 

    caretToEnd: 'true', 
    maxLength: '20', 
    css: { 
     container: 'center-block dropdown-menu custom-keypad', 
     buttonDefault: 'btn-kb', 
     buttonHover: 'btn-primary', 
     buttonAction: 'active', 
     buttonDisabled: 'disabled' 
    } 

    }); 

}); 

的主要問題是,$(「量」)選擇了包括隱藏重複輸入,所以他把它改爲$(」 .amount:沒有(關閉)「) 而且他還完成之後格式化發生在‘接受’

完美工作的總和()操作=)

相關問題