Question

Could someone explain me please why this didn’t working:
http://jsfiddle.net/4nzYr/

<ul>
    <li class="draggable">hello</li>
    <li class="draggable">how are you today</li>
</ul>

and..

  $(function(){
        $('.draggable').draggable({axis: 'y', start: function (event, ui){var dragged=true}})
            if (dragged == true){$('<p>super</p>').appendTo($('.draggable'))}
            })

I i expected append new paragraph. And for more i expected to have possibility to use variable dragged to other actions.

Answer 1

You are calling this code only once when the page loads. This will never be append because the code is never run again after dragging.

if (dragged == true){
    $('<p>super</p>').appendTo('li');
}

You need another event to stick this code block into. Also notice that dragged is now defined outside of draggable’s start delegate. For example:

$(function() {
    var dragged = false;

    $('.draggable').draggable({
        axis: 'y',
        start: function (event, ui) {
            dragged = true;
        }
    });

    $('#checkButton').click(function() {
        if (dragged == true){
            $('<p>super</p>').appendTo('li');
        }
    });
});