How not to allow moving parts of a sortable jquery list?

Question

I made a sorted list:

<ul> <li class="line"><a href="#" class="food">milk</a></li> <li class="line"><a href="#" class="food">eggs</a></li> <li class="line"><a href="#" class="food">cheese</a></li> </ul> 

Nevertheless, I want to do everything so that the food in the classroom is not dragged. Since they are links, sometimes when people click on them, they accidentally change the order in the list. Does anyone know how to make food items not drag and drop?

Answer 1

Assuming your sortable .line selector .line :

 $('.line').sortable({ cancel: 'a.food' }); 

See JQuery UI documentation for more on cancellation .