x-editable + maskedinput returning underscores on enter but not on click

Question

x-editable + maskedinput returning underscores from maskedinput on enter but it does not when I click. Any ideas on how to fix this?

JSFiddle:

• http://jsfiddle.net/xBB5x/10654/

jQuery Library's:

• https://github.com/digitalBush/jquery.maskedinput
• https://vitalets.github.io/x-editable/index.html

HTML:

<a href="#" data-pk="1">1</a>

JS:

$('a').editable({
    type: 'text',
    name: 'username',
    tpl: '<input type="text" id ="zipiddemo" class="mask form-control input-sm dd" style="padding-right: 24px;">'
});

$(document).on("focus", ".mask", function () {
    $(this).mask("?999");
});

Answer 1

JSFiddle:

• http://jsfiddle.net/xBB5x/10655/

HTML:

<a href="#" data-pk="1">1</a>

JS:

$('a').editable({
    type: 'text',
    name: 'username',
    tpl: '<input type="text" id ="zipiddemo" class="mask form-control input-sm dd" style="padding-right: 24px;">',
    display: function(value, response) {
        return false;
    },
    success: function(response, newValue) {
        $(this).html(newValue.replace(/_/g, ''));
    },
});

$(document).on("focus", ".mask", function() {
    $(this).mask("?999");
});