hey guys

i made a script inspired by wordpress widgets'page to drag&drop blocks of my sites

but problem is in saving the position after droping

this is jquery code , i used to do the above target :

<script type="text/javascript" >$(function(){
    $('.widget')
    .each(function(){
        $(this).hover(function(){
            $(this).find('h4').addClass('collapse');
        }, function(){
        $(this).find('h4').removeClass('collapse');
        })
        .find('h4').hover(function(){
            $(this).find('.in-widget-title').css('visibility', 'visible');
        }, function(){
            $(this).find('.in-widget-title').css('visibility', 'hidden');
        })
        .click(function(){
            $(this).siblings('.widget-inside').toggle();
            //Save state on change of collapse state of panel
            updateWidgetData();
        })
        .end()
        .find('.in-widget-title').css('visibility', 'hidden');
    });

    $('.column').sortable({
        connectWith: '.column',
        handle: 'h4',
        cursor: 'move',
        placeholder: 'placeholder',
        forcePlaceholderSize: true,
        opacity: 0.4,
        start: function(event, ui){
            //Firefox, Safari/Chrome fire click event after drag is complete, fix for that
            if($.browser.mozilla || $.browser.safari)
                $(ui.item).find('.widget-inside').toggle();
        },
        stop: function(event, ui){
            ui.item.css({'top':'0','left':'0'}); //Opera fix
            if(!$.browser.mozilla && !$.browser.safari)
                updateWidgetData();
        }
    })
    .disableSelection();
});

function updateWidgetData(){
    var items=[];
    $('.column').each(function(){
        var columnId=$(this).attr('id');
        $('.widget', this).each(function(i){
            var collapsed=0;
            if($(this).find('.widget-inside').css('display')=="none")
                collapsed=1;
            //Create Item object for current panel
            var item={
                id: $(this).attr('id'),
                collapsed: collapsed,
                order : i,
                column: columnId
            };
            //Push item object into items array
            items.push(item);
        });
    });
    //Assign items array to sortorder JSON variable
    var sortorder={ items: items };

    //Pass sortorder variable to server using ajax to save state
    $.post('updatePanels.php', 'data='+$.toJSON(sortorder), function(response){
        if(response=="success")
            $("#console").html('<div class="success">Saved</div>').hide().fadeIn(1000);
        setTimeout(function(){
            $('#console').fadeOut(1000);
        }, 2000);
    });
}

</script>

and a simple php file

but problem is its not sending data to target php file

is there anything wrong with my code ?