Prevent drop of list item in JqueryUI sortable

Question

I have two lists #sortable1 and #sortable 2 which are connected sortables, as shown in this example.

You can drag and drop list items from

Answer 1

For anyone reading this in future, as mentioned by briansol in comments for the accepted answer, it throws error

Uncaught TypeError: Cannot read property 'removeChild' of null

The the documentation particularly says

cancel()

Cancels a change in the current sortable and reverts it to the state prior to when the current sort was started. Useful in the stop and receive callback functions.

Canceling the sort during other events is unreliable, So it's better use the receive event as shown in Mj Azani's answer or use the stop event as follows:

$('#list1').sortable({
  connectWith: 'ul',
  stop: function(ev, ui) {
    if(ui.item.hasClass("number"))
      $(this).sortable("cancel");
   }
}); 

$('#list2').sortable({
   connectWith: 'ul',
});  

Demo