jquery droppable with click

http://jqueryui.com/demos/droppable/#photo-manager

I'm new in jquery and hoping that someone could help me solving my problem. The link above is the closest to what I wanted.

I want to implement shopping cart but instead of clicking 'trash' icon, I want to be able to click on the image it self and move the image to the shopping cart without any fadein/out effect like the demo on the link above

at the end i want to see a button that will alert the array of the <li> id from the item i selected.

Any help would be appreciated
edyonlineAsked:
Who is Participating?
 
anoyesConnect With a Mentor Commented:
Your images are set up within a list?  In that case, you would want to start by binding a click event to the list items:
$('#ulProducts li').click(function() {
 // Here we'll handle the click
});

Now, in the onclick, you'll take care of adding the item to the shopping cart w/ ajax.  http://docs.jquery.com/Ajax has all the details you'll need on getting AJAX set up.  You can get the id attribute of the item that was clicked on by doing $(this).attr('id'); within the click handler.  Then, after your AJAX request succeedes, you can remove the li from the list by doing ('li#' + previouslyRetreivedID).remove();

Does all that make sense / do you need further clarification?
0
 
edyonlineAuthor Commented:
yes.. i tried the click function... I'm able to implement click function by clicking <li> object and the object move append to the new list. However, how can I click on the same object on the new list, and have the object goes back to the original list?
0
 
anoyesCommented:
What you would essentially have to do is, after adding the new item to the list, add a click handler to it that does the reverse - move it back to the other list.  If you can provide some code samples I can probably show you exactly how to do it.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.