Search code examples
jqueryjquery-uispinnerreadonlydisabled-control

How do I disable or hide jQuery UI spinner buttons without disabling widget?


I originally was using the option to disable the spinner widget, but I don't want to use that, because it causes the value of the widget to be lost when the form is submitted. What I am looking for is to set the widget to readOnly.

When I set it to read only, it correctly makes it so the user cannot type in the field, but unfortunately they can still click the up and down buttons. I am wanting to know if there is a way to either disable or hide the spinner buttons without affecting the text part of the widget, so I can later re-enable or show those buttons.

Thanks in advance! -David


Solution

  • To hide the spinner controls, run this:

    $('.ui-spinner a.ui-spinner-button').css('display','none');

    To make them reappear run this:

    $('.ui-spinner a.ui-spinner-button').css('display','block');

    Change the selector value to fit your document structure.