CODEWITHSUNDEEP
javascriptjqueryjquery-ui-sortable
Alex
Alex

Reputation: 68004

Custom data in jQuery sortable?

on the "update" callback you can get the order of elements with $(this).sortable('toArray');

But this order contains the element IDs.

How can I get a custom attribute, like data-myattr? I want that order to contain values from this attibute instead of IDs....

   $('ul').sortable({
     handle: 'h2'
     items: 'li',
     context: this,
     update: function(){        

       var order = $(this).sortable('toArray');

       // here I want a array of values from my attribute, not ID values...
       alert(order);

       ....

     }
   });

The HTML is simple:

<ul>
  <li data-myattr="a-1" id="whatever">
    ...
  </li>
  ...

Upvotes: 17

Views: 12586

Answers (3)

julien_c
julien_c

Reputation: 5092

As of August '12, this is implemented directly in jQuery UI:

var order = $(this).sortable('toArray', {attribute: 'data-myattr'});

Upvotes: 42

Luke Girvin
Luke Girvin

Reputation: 13442

$("ul").sortable({
  .
  .
  .
  update: function(event, ui) {        
    var arr = $(this).sortable('toArray');
    var i, n;
    var attrs = [];
    for (i = 0, n = arr.length; i < n; i++) {
      attrs.push($('#' + arr[i]).data('myattr'));
    }

    alert(attrs);  
  }
});

Upvotes: 4

Alper
Alper

Reputation: 1105

$("li").data("myattr") // if you use jQuery, >= 1.4.3

$("li").attr("data-myattr") // for erlier

JS Fiddle here

Upvotes: 0

Related Questions