Change method has keyboard as object

[esolutions4ev1]

Honestly this could just be my limited knowledge of Mottie. I'm working on overriding the "+" and "-" keystrokes in order to increment/decrement the field and using JSFIDDLE (http://jsfiddle.net/Mottie/Em8sG/625/) as a testing platform. The validate method has "keyboard" coming through as a string which is what I expect, however the change method is coming through as an object and when I dumped the results it is the method and property list of the keyboard object. I can't tell what I would be doing wrong and change seems to be the appropriate method to use. Is this a bug or I'm doing it wrong?

$('#keyboard').keyboard({

    acceptValid: false,
    layout: 'custom',
   display : {
    'alt'  : '\u2666', // Diamond
  },
  customLayout : {
      'default' : [ '{alt} {accept} {cancel}', '+ -' ],
      'alt'   : [ '{alt} {accept} {cancel}', '1 2 3', '4 5 6', '7 8 9', '0 . c' ]
  },
    alwaysOpen   : true,

    visible: function(e, key, el)
{
    key.$preview[0].select();
},
    change: function(e, key, el)
{
    alert(key);
     if (key == '+') {
        alert(e.$preview.val());
   e.$preview.val(e.$preview.val()+1);
    }
},
    validate: function(e, key, el)
{
    // Accept only numeric
    var test = /\d+/.test(key);
    if (!test) { e.$preview.val(''); }
    return test;
},

});

[Mottie]

Try this method that adds an action key instead of using the change callback - demo:

$.extend($.keyboard.keyaction, {
    plus: function(base){
        var v = parseFloat(base.$preview.val()) || 0;
        base.$preview.val(v+1);
    },
    minus: function(base){
        var v = parseFloat(base.$preview.val()) || 0;
        base.$preview.val(v-1);
    }
});

$('#keyboard').keyboard({
    acceptValid: false,
    layout: 'custom',
    display: {
        'alt'   : '\u2666', // Diamond
        'plus'  : '+',
        'minus' : '-'
    },
    customLayout: {
        'default': ['{alt} {accept} {cancel}', '{plus} {minus}'],
        'alt': ['{alt} {accept} {cancel}', '1 2 3', '4 5 6', '7 8 9', '0 . c']
    },
    alwaysOpen: true,
    visible: function(e, key, el) {
        key.$preview[0].select();
    },
    validate: function(e, key, el) {
        // Accept only numeric
        var test = /\d+/.test(key);
        if (!test) {
            e.$preview.val('');
        }
        return test;
    },

});​

[Mottie]

I'm guessing the above solution has solved the problem, so I'm closing this issue. Please feel free to reopen it if you continue to have problems.