link(array(‘jquery’, ‘jquery-ui’), false);
?>

$(document).ready(function(){
//set up the droppable list elements
$(“ul li”).droppable({
accept: “.ui-draggable”,
hoverClass: ‘droppable-hover’,
greedy: true,
tolerance: ‘pointer’,
drop: function(ev, ui) {
var dropEl = this;
var dragEl = $(ui.draggable);

// get category id
var parent_id = this.id.substring(9);
// get category name
var category_name = $(dragEl.find(“span”).get(0)).html();

if (!isNaN(parent_id) && category_name.length > 0) {
var data;
var url = “/path/Categories/”;

// see if we are adding or editing
if (dragEl.attr(“id”).substring(0, 9) == “category_”) {
// get the current id
var id = dragEl.attr(“id”).substring(9);
data = { ‘data[Category][id]‘: id, ‘data[Category][name]‘: category_name, ‘data[Category][parent_id]‘: parent_id };
url += “edit”;
} else {
data = { ‘data[Category][name]‘: category_name, ‘data[Category][parent_id]‘: parent_id };
url += “add”;
}

// post to our page to save our category
$.post(url, data, function() {
$.get(“categories/index/isAjax:1″”, function (data) { destroyDraggable(); $(“#content”).html(data); setupDraggable(); });
});

}
}
});

setupDraggable();
});

function updateDragBox() {
$($(“#ui-draggable”).find(“span”).get(0)).html($(“#CategoryName”).val());
}

function setupDraggable() {
$(“#ui-draggable”).draggable({
containment: ‘#categories’,
stop: function(e,ui) {
$(this).animate({ left: 0, top:0 }, 500);
$(this).html();
}
});

$(“#category_0″”).find(“li”).draggable({
containment: ‘#categories’,
});

}

function destroyDraggable() {
$(“#ui-draggable”).draggable(‘destroy’);
$(“#category_0″”).find(“li”).draggable(‘destroy’);
}

#categories {
padding: 1em 0.5em;
width: 90%;
}

ul li {
background-color: #FFFFFF;
border: 1px solid #000000;
list-style: none;
margin: 1em 0;
padding: 1em;
}

ul li.droppable-hover {
background-color: #FFF000;
}

#category {
border: 1px solid #000000;
margin-top: 1em;
padding: 1em;
width: 97%;
}

#ui-draggable {
background: #FF0000;
padding: 1em;
position: relative;
width: 300px;
}

element(‘draw_category’, array(‘data’ => $categories)); ?>

Enter a category name in the text box below, then drag the object below into the category you wish it to be a part of.

Do these changes look correct? It works in Firefox, but in IE7 I get the javascript error ‘Expected identify, string, or number” at line 61 above.

I have some pages indexed in google for the top ranking.

I am afraid if you would allow or no but can we have a 2 way linking to each others blog. My blog address is:

http://blog.pakcoders.com

Put the keywords “How to build Ajax AutoSuggest” and you will see my blog on the second ranking and it has been there since months.