Solved

delete item from list with a delete icon

Posted on 2010-08-19
4
373 Views
Last Modified: 2012-05-10
Hi Experts,
I am trying to create a preferences list in a webpage using JQUERY.  The prefrences will be selected by user from a wide range of available preferences(checkboxes).  The selected ones will be displayed in list. I need to let the users delete from the list say by clicking on a delete icon right beside the item in the list. If there are 5 items in the list, each will have its delete button right beside it. Whats the best way/efficient way to implement this? I am assuming that JQuery is pretty compatible across browsers.
Any help is greatly appreciated
0
Comment
Question by:guyneo
  • 2
4 Comments
 
LVL 15

Expert Comment

by:SRigney
ID: 33478006
jquery is compatible across browsers, that's the best thing about it.

I'd say as you click checkboxes you add an item to the list with a delete link specifically for it.  The delete link can have an event set up to delete it.

Do you have a page layout that you are already working with?
0
 
LVL 40

Accepted Solution

by:
gurvinder372 earned 500 total points
ID: 33478056
take the following approach
1) create the list with delete icon as img tag
<ul>
   <li>
     <img href=''>
   </li>
</ul>

2) put this jquery code after the list is created in DOM
$("ul li img").bind("click", function(){
   $(this).parent().remove();
});

0
 
LVL 1

Author Comment

by:guyneo
ID: 33534605
. Works perfectly.  Thanks for helping out a newbie like me.
 Now I am trying to delete  items from it.
I am posting it as as seperate question so that I can givepoints seperatealy
0
 
LVL 40

Expert Comment

by:gurvinder372
ID: 33534701
thanks for the points
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

There are a couple ways to attach a JavaScript function to dynamically created elements. You can make a new script for each element as it’s created or you can use delegation. Delegation allows a single script that is added at page creation to mat…
This article is meant to give a basic understanding of how to use R Sweave as a way to merge LaTeX and R code seamlessly into one presentable document.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.

932 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now