jQuery + ajax livesearch

Question

I am doing a mysql database search and retrieving some results via ajax livesearch using the example on w3schools and i want to manipulate those results (drag and drop them) but im having a problem because the script loads before you enter the search and get the results so it does absolutely nothing no the search results. Any thoughts on this matter ?

Answer 1

Ah - thanks for the clarification.

The elements you want to drag are being created after the drag/drop initialization. You need make them draggable:

for example, add 'dragMe' as a class to the items. Once the list is populated from the server, then make those items dragable:

$('.dragMe').draggable();

I would really look into jQuery's ajax functions and their autocomplete

To clarify and for jquery (against your cited example):

function showUser(str)
{
   $.get( 'getuser.php', { q: str },
       function(data) {
          $('#txtHint').html( data ); // add the returned content to #txtHint
          $('#txtHint').find('.dragItem').draggable(); //make the new items draggable
       }, 'html' );
}

In your php, change your display so it is blocks that can be dragged.

while($row = mysql_fetch_array($result))
  {
  echo "<div class="dragItem">"; // see how we're adding the 'dragItem' class? 
  echo "Firstname " . $row['FirstName'];
  echo "</div>";
  }

past that, you'll really want to do some more research to get a better idea of whats going on.

Answer 2

how can i make it so that the scripts loads after the list is populated by the search and the elements have their respective classes ?