Set up your survey to use JavaScript
and place the following script in the source of the question:
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
// Identify this question
var qID = {QID};
var thisQuestion = $('#question'+qID);
// Listeners on the rankable items
$('.ui-sortable', thisQuestion).on('sortstop', function(event, ui) {
insertRankIndicators();
});
$('.ui-sortable li', thisQuestion).on('dblclick', function(event, ui) {
setTimeout(function() {
insertRankIndicators();
}, 100);
});
// A function to insert ranking indicators
function insertRankIndicators() {
$('.inserted-rank', thisQuestion).remove();
$('.dragDropRankList li', thisQuestion).each(function(i) {
$(this).append('<span class="inserted-rank">#'+(i+1)+'</span>');
});
}
// Insert some styles (these could be in template.css)
var newStyles = '.ui-sortable-handle {\
position: relative;\
}\
.ui-sortable li .inserted-rank {\
position: absolute;\
top: 5px;\
right: 5px;\
}';
$('head').append('<style type="text/css">'+newStyles+'</style>');
});
</script>
