AngularJS x-editable : Accept numeric input only

Question

AngularJS x-editable : Accept numeric input only

I want to have an input field in Angular x-editable which only accepts numeric input. I want to modify this part when you click an editable element. But I can't find it. This if from the

This is what I get when I inspect the element.

I want to validate using ng-keydown, I want to insert it inside this but I don't know how. Please help!

Thanks!

javascript
angularjs

Answer 1

I was able to solve my problem. I edited xeditable.js

You can search this part in xeditable.js

self.inputEl.addClass('editable-input');
self.inputEl.attr('ng-model', '$data');

I added this part

self.inputEl.attr('ng-keydown', 'editableKeydown($event)');

JS of editableKeydown($event)

$scope.editableKeydown = function ($event) {
    if ($.inArray($event.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
        // Allow: Ctrl+A
        ($event.keyCode == 65 && $event.ctrlKey === true) ||
        // Allow: home, end, left, right
        ($event.keyCode >= 35 && $event.keyCode <= 39)) {
        // let it happen, don't do anything
        return;
    }
    // Ensure that it is a number and stop the keypress
    if (($event.shiftKey || ($event.keyCode < 48 || $event.keyCode > 57)) && ($event.keyCode < 96 || $event.keyCode > 105)) {
        $event.preventDefault();
    }

    global.editableCount = global.editableCount + 1;
    if (global.editableCount > 5) {
        $event.preventDefault();
    }
};

Note: global.editableCount is declared from another js file. I'm still a beginner in javascript, jquery and angular so my code are not yet that polished. but this one worked. I was able to make the angular x-editable input accept numeric characters only.