Sortable list + ability to re-order each item by inputting rank #

Question

I\'ve searched and searched about how to do this, but to no avail.

Basically I have a pretty standard jQuery sortable list, using a gripper to allow users to rearrange t

Answer 1

here is something that moves the li items around by changing the numbers:

function setOrder() {
    $.each($('ul li input'), function(index, el) {
        el.value = (index + 1);
    });
}

setOrder();

$('ul li input').live('change', function() {
    var change = (parseInt(this.value) - 1);

    if(change > ($('ul li input').length - 1)){
        change = $('ul li input').length - 1; 
    }

    var index = $(this).index('ul li input');
    var move = $('ul li')[change];

    var arr = [];

    $.each($('ul li'), function(ind, el) {
        arr[ind] = $(this).clone();
    })
    arr[index] = move;
    $('input', move).val(index + 1);
    arr[change] = $(this).parent()[0];
    arr.sort();

    $('ul li').remove();
    var indexAt = 0;
    $.each(arr, function(index, el) {
        $('ul').append(el);
    });
    setOrder();
})
$('ul').sortable({
    stop: function(a, b) {
        var arr = [];
        var i = 0;
        $.each($('ul li'), function(ind, el) {
            arr[i] = $(this).clone();
            i++;
        })

        $('ul li').remove();
        $.each(arr, function(index, el) {
            $('ul').append(el);
        });
        setOrder()
    }
});

html:

    
lijrfxgjh
    
ghhgfhj
    
lijrjh
    
gfreydjgj
    
rey
    
gfjgf

fiddle: http://jsfiddle.net/maniator/bDvK8/

it is a bit glitchy, but it is a start