Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on May 7th, 2012  |  syntax: None  |  size: 1.29 KB  |  hits: 8  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. JQuery adding elements including a remove listener
  2. function displayElements(objekt) {
  3.     $('#container').empty();
  4.     for(var key in objekt) {
  5.         if(objekt.hasOwnProperty(key)) {
  6.             $('#container').append('<div id="' + key + '">' +
  7.                 key +
  8.                 '<a id="del' + key + '">delete'</a></div>');
  9.             $('#del' + key).click(function() {
  10.                 delete objekt[key];
  11.                 displayElements(objekt);
  12.             });
  13.         }
  14.     }
  15. }
  16.        
  17. // build your markup
  18. function displayElements(objekt) {
  19.     var container = $('#container').empty();
  20.     for (var key in objekt) {
  21.         if (objekt.hasOwnProperty(key)) {
  22.             container.append('<div id="' + key + '">' + key + '<a id="del' + key + '">delete< /a></div > ');
  23.         }
  24.     }
  25. }
  26.  
  27.  
  28. displayElements(objekt);
  29.  
  30. // bind to all anchors who's ids start with 'del'
  31. $("#container").on("click", "a[id^='del']", function() {
  32.     $(this).remove();
  33. });
  34.        
  35. function displayElements(objekt) {
  36.   $('#container').empty();
  37.  
  38.   for (var key in objekt) {
  39.     if (objekt.hasOwnProperty(key)) {
  40.       var $div = $('<div />');
  41.       $div.prop('class', 'delete');
  42.       $div.append($('<a />').attr('id', 'del' + key).text('delete'));
  43.     }
  44.   }
  45. }
  46.  
  47. $('.delete').on('click', 'a[id^="del"]', function() {
  48.   // Delete your stuff
  49. });