CODEWITHSUNDEEP
jquery-uijquery-ui-spinner
dragonfly
dragonfly

Reputation: 17773

jQuery UI Spinner with letters A-Z or other custom range

Is there a way to customize jQuery UI spinner, so that A-Z letters (or any custom range) is possible?

Upvotes: 1

Views: 4866

Answers (2)

Bojan Hrnkas
Bojan Hrnkas

Reputation: 1694

I built up on Andrews code and built a spinner widget that takes a string array for input.

You can see the solution here.

Upvotes: 0

Andrew Whitaker
Andrew Whitaker

Reputation: 126052

Yes, this is possible. Here's a simple example using A-Z, adapted from the provided time example:

$.widget("ui.alphaspinner", $.ui.spinner, {
    options: {
        min: 65,
        max: 90
    },
    _parse: function(value) {
        if (typeof value === "string") {
            return value.charCodeAt(0);
        }
        return value;
    },
    _format: function(value) {
        return String.fromCharCode(value);
    }
});

Usage:

$("#my-input").alphaspinner();

Example: http://jsfiddle.net/4nwTc/1/

The above example creates a new widget called alphaspinner that inherits from spinner. You can do this for just one spinner with the following:

$(function() {
    var spinner = $("#alpha-spinner").spinner({
        min: 65,
        max: 90
    }).data("spinner");

    spinner._parse = function (value) {
        if (typeof value === "string") {
            return value.charCodeAt(0);
        }
        return value;        
    };

    spinner._format = function (value) {
        return String.fromCharCode(value);        
    }
});​

Example: http://jsfiddle.net/4nwTc/2/

Upvotes: 3

Related Questions