jquery x-editable numeric input

Question

In x-editable library. How to have a numeric input? That does not allow any letter in the input box.

I have tried this code

<a class="items" data-name="itemqty" data-title="Enter Item Quantity" data-type="text" href="#" id="itemqty" onkeypress="return isNumberKey(event)"></a>

<script>
    function isNumberKey(evt) {
      var charCode = (evt.which) ? evt.which : event.keyCode;
      if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
          return false;
      } else {
          return true;
      }      
    }
</script>

but it does not work. If I used a normal input text it works but in x-editable it does not work. Any ideas?

Answer 1

The following solution works for me:

    $('.editable').editable({
        type: 'text', 
        validate: function(value) {
            if ($.isNumeric(value) == '') {
                return 'Only numbers are allowed';
            }
        }
    });

It's important to return an error string (e.g. 'Only numbers are allowed') because otherwise x-editable doesn't recognice that the validation has failed.

Answer 2

$('.jmlcolly,.jumlahitem,.beratsatuan').editable({
    type: 'text', 
    inputclass:'lebar',
    showbuttons:false, 
    title: 'Enter new value' ,
    validate: function(value) {
        if($.trim(value) == '') {
         alert('This field is required');
         return false;
        }
        if ($.isNumeric(value) == '') {
            alert('This Number is required');
            return false;
        }
    }
});