Eolis
Eolis

Reputation: 655

jQuery Spinner that can display string and number values?

So I want to create a jQuery spinner that increments when clicked but if its value is 0 (or any targeted value, but lets go with 0 ) I want it to display the word 'unlimited' instead of 0, and then when incremented start counting as if 0 was a number, so it will read: unlimited, 1,2,3,4, etc. Is there any way to do this? Ive found methods for counting through the alphabet and the like but changing one value to a string seems rather difficult. here is a fiddle of a basic spinner:

var spinner = $( "#spinner" ).spinner();
$( "#spinner" ).spinner({
    min: -1,
    max: 50,
});

http://jsfiddle.net/nmnx0y7a/1/

Upvotes: 1

Views: 242

Answers (2)

dfsq
dfsq

Reputation: 193271

One more version:

$("#spinner").spinner({
    min: -1,
    max: 50,
    spin: function(e, ui) {
        if (ui.value == 0) {
            e.preventDefault();
            this.value = "unlimited"
        }
    }
})
.val('unlimited');

Demo: http://jsfiddle.net/nmnx0y7a/9/

Upvotes: 2

Keith Enlow
Keith Enlow

Reputation: 914

This isn't the most elegant solution...but it will work. Hope it helps.

var spinner = $( "#spinner" ).spinner();
$( "#spinner" ).spinner({
    min: -1,
    max: 50,
});
$(document).ready(function(){
    $('#spinner').val("unlimited");
   $(document).click(function(){
       if($("#spinner").val() == 0)
       {
           $("#spinner").val("unlimited");
       }
   });
});

When the document loads it will immediately put the value of the spinner to "unlimited" and then no matter where you click on the document, it will always check to see if its 0 and then change it to "unlimited".

In fact a better solution would be to put the clikc on a div the spinner is inside.

Upvotes: 0

Related Questions