ajax实时+ jquery可拖动和可调整大小

I'm developing an asterisk panel that gets the calls info in real time and displays it on a php page. I have a html div for each monitored channel that the user will be able to move and resize on his screen, i already did the real time function working, but when i put together to the jquery draggable and resizable it wont work...

It works if i use the functions alone (or the real time or the jquery).

Anyone knows if there's any incompatibility of ajax and jquery?

here is my script code:

<script type="text/javascript">
$(function() {
    $( "#draggable-resizable" ).draggable();
    $( "#draggable-resizable" ).resizable();
});


//real time
Event.observe(window,'load', init, false);
function init(){
    getdata();
}
function getdata(){
    var url = "<?php $host?>/integrador/library/phpAMI-1.0/doc/index.php";
    var target = 'load_panel';
    var myAjax = new Ajax.PeriodicalUpdater(target,url,{asynchronous:true,frequency:1});        
}

And here is where i want to update:

<div id="draggable-resizable" class="ui-widget-content" > 
    <table id="load_panel"  width="20%" border="1pt">
        //do my things

sorry about my bad english, if you don't understand something just ask please! thanks

$(document).ready(function(){
   $(".draggable-resizable").draggable({ }).resizable({ });
   $('.draggable-resizable').bind('resize', 'event');
});

that did the trick :)