Spin Event Doesn't Trigger At First Time In Jquery Spinner

I have created a custom spinner which appends a string after a number. var percent = 5.5%; $.widget('ui.pcntspinner', $.ui.spinner, { _format: function(value){

Solution 1:

You are extending the widget so spin won't work you need _spin

$.widget("ui.pcntspinner", $.ui.spinner, {
    _format: function(value){
        return value + " %";
    },

    _parse: function(value){
        returnparseInt(value);
    },

    _spin: function( event, ui ) { 
       alert('value updated by :' + ui);

       if(validation){
         var result = this._super( event, ui ); 
         return result; //<-- important for generic functionality
       }else
       {
         //returning nothing would make value not change
       }
    }
});

Solution 2:

Found the solution. I still don't understand though why spin was not getting triggered the first time but this helped -

var percent = 5.5%;
$.widget("ui.pcntspinner", $.ui.spinner, {

         widgetEventPrefix: "spin",
        _format: function(value){
            return value + " %";
        },

        _parse: function(value){
            returnparseInt(value);
        }
    });


    $("#spinner").pcntspinner().val(percent);