How to limit sortable items?
10 MaySome time ago i searched for a way to limit elements on a sortable box (i used jQuery Interface). For example, i had two boxes and one of them needs no more than three items. After i searched and switch net upside down, i ask directly to the creator or Interface and he gave me a simple (but still efficient) solution:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | $('.sort').Sortable({ accept : 'sortItem', activeclass : 'sortableactive', hoverclass : 'sortablehover', helperclass : 'sorthelper', opacity: 0.5, fit : false, floats: true, onStart: function(){ console.log($('#big .sortItem').size()) if ($('#big .sortItem').size() == 3) { //max of items console.log($('#big').get(0).dropCfg.a) $('#big').get(0).dropCfg.a = 'dummyRandom'; } else { $('#big').get(0).dropCfg.a = 'sortItem'; } } }); |
Demo here (click!).
Comments (4)
Bookmark this article!
Your demo does not work.
Works for me! I mean… I tried to move elements from bottom to top and the top area accept only 3 items…
Hmm… Guys, indeed, there is a problem. It seems in firefox 3.5 doesn’t work anymore. I will add soon a post on how to limit sortable on jquery UI with latest version of jquery (i think is better this way).
In fact, i think the problem is on interface itself, rather than my demo
Hi Ionut, it also doesn’t work in IE etc. Do you have any idea for a workaround for this problem? Would be great to hear from you! regards!