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

Untitled

By: a guest on Jul 20th, 2012  |  syntax: None  |  size: 2.35 KB  |  hits: 16  |  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 - resizable not working after manipulating the DOM dynamically
  2. <div id="ParentDIV" style="margin-left:200px; width:800px; height:500px; background:lightgray;">                    
  3.            <div class="dragClass"><p>Drag me around!</p></div>
  4.            <br /><br />
  5.            <img class="dragImgClass" src="logo3.JPG" />
  6.            <br /><br />
  7.            <img class="dragImgClass" src="logo4.JPG" />
  8.        </div>
  9.         <br /><br />
  10.         <input id="Btn4" type="button" onclick="deleteObj();" value="Remove Element" />
  11.        
  12. $(function () {
  13.             BindEvtHandlers();        
  14.  
  15.         });      //End of DOM Ready
  16.  
  17.         function BindEvtHandlers() {            
  18.             $(".dragImgClass").draggable({ delay: 100, containment: "#ParentDIV", scroll: false })
  19.                               .on("click", selectAction);
  20.  
  21.             $(".dragClass").draggable({ delay: 100, containment: "#ParentDIV", scroll: false })
  22.                            .resizable()
  23.                            .on("dblclick", editAction)
  24.                            .on("click", selectAction)
  25.                            .on("blur", "textarea", blurAction);
  26.            }
  27.  
  28.  
  29.         function selectAction() {
  30.             var $this = $(this); //get current obj.                    
  31.  
  32.             if ($this.get(0).tagName == "IMG")
  33.                 $('body').data('CBO', $this.attr('src'));
  34.             else
  35.                 $('body').data('CBO', $this.find('p').html());
  36.  
  37.             $('body').data('selObj', $this);    
  38.             $this.fadeTo('slow', 0.3);            
  39.            }
  40.  
  41.         function deleteObj() {
  42.             var $selObj = $('body').data('selObj');
  43.             alert($selObj.outerHtml());          
  44.  
  45.             var cont = $('#ParentDIV').html();
  46.             cont = cont.replace($selObj.outerHtml(), "");
  47.             $('#ParentDIV').html(cont);
  48.  
  49.  
  50.             $(".dragImgClass").draggable({ delay: 100, containment: "#ParentDIV", scroll: false })
  51.                               .on("click", selectAction);
  52.  
  53.             $(".dragClass").resizable('destroy');
  54.             $(".dragClass").draggable({ delay: 100, containment: "#ParentDIV", scroll: false })
  55.                            .resizable()
  56.                            .on("dblclick", editAction)
  57.                            .on("click", selectAction)
  58.                            .on("blur", "textarea", blurAction);
  59.         }
  60.        
  61. $selObj.remove();
create a new version of this paste RAW Paste Data