jquery - How to drop elements to a dynamically generated DIV, Drag function is working Fine -

-

here jquery code i'm using:

jquery(function() { jquery(".component").draggable({     //  use helper-clone append 'body' not 'contained' pane     helper: function() {         return jquery(this).clone().appendto('body').css({             'zindex': 5         });     },     cursor: 'move',     containment: "document"  });  jquery('.drag-drop-box').droppable({     accept: '.component',     drop: function(event, ui) {         if (!ui.draggable.hasclass("dropped"))             jquery(this).append(jquery(ui.draggable).clone().addclass("dropped").draggable());         }     }); });

this code works fine on pre-loaded div. creating divs dynamically how can working dynamically generated div.

this html code f static code dropping elements working well

<div class="item-box">                         <div id="tabs-1">                             <div class="drag-drop-box"> </div>                         </div>                     </div>

and here jquery code that's creating divs dynamically:

 function addtab() {   var label = tabtitle.val() || "tab " + tabcounter,     id = "tabs-" + tabcounter,     li = $( tabtemplate.replace( /#\{href\}/g, "#" + id ).replace( /#\{label\}/g, label) ),     tabcontenthtml = tabcontent.val();// || "tab " + tabcounter + " content.";    tabs.find( ".ui-tabs-nav" ).append( li );   tabs.append( "<div id='" + id + "'><div class='drag-drop-box'></div></div>" );   tabs.tabs( "refresh" );   tabcounter++; }

i think need make dynamically created div droppable.

to add code @ end of addtab() function

jquery('#'+id).droppable({    activeclass: 'drag-drop-box-hover',    accept: '.component',    drop: function(event, ui) {      if (!ui.draggable.hasclass("dropped"))         jquery(this).append(jquery(ui.draggable).clone().addclass("dropped").draggable());    } });

i guess current jquery code runs once when page finished loading. @ time existing divs made droppable. new ones code needs run again.


Comments

Post a Comment

Popular posts from this blog

java - WrongTypeOfReturnValue exception thrown when unit testing using mockito -

-
my test list<person> mylist; @test public void testisvalidperson() { mylist = new arraylist<person>(); mylist.add(new person("tom")); when(persondao.get(person)).thenreturn(mylist); when((persondao.get(person)).isempty()).thenreturn(false);//------exception thrown boolean result = service.isvalid("tom"); assertfalse(result); } method tested: public boolean isvalid(string person){ persondao = new persondao(); person personobj = new person(person); return (persondao.get(person).isempty())?false : true; } exception thrown: org.mockito.exceptions.misusing.wrongtypeofreturnvalue: boolean cannot returned get() get() should return list *** if you're unsure why you're getting above error read on. due nature of syntax above problem might occur because: 1. exception *might* occur in wrongly written multi-threaded tests. please refer mockito faq on limitations of concurrency testing. 2. sp...
Read more

c++11 - Intel compiler and "cannot have an in-class initializer" when using constexpr -

-
the following test program compiles , runs fine g++. intel icpc (14.0.2) compile , run if use explicit type double instead of template. template version icpc produces error: icpc -g -o2 -i. -std=c++0x -c main.cc -o main.o main.cc(10): error: member of type "const t [9]" cannot have in-class initializer static constexpr t dx_[9] = { test code template<typename t> class myclass { public: static constexpr t dx_[9] = { 1.5, 2.0, -0.5, -0.5, 0.0, 0.5, 0.5, -2.0, -1.5 }; }; template<typename t> constexpr t myclass<t>::dx_[9]; int main(int argc, char *argv[]) { return 0; } // main why receiving error "cannot have in-class initializer" when using constexpr ? this bug of intel compiler, submitted intel , fixed in future versions. also see multiple constexpr bugs , sfinae bug intel c++ compiler 15 , method constexpr bug c++ compiler 15 on intel forums.
Read more

rest - Spring boot: Request method 'PUT' not supported -

-
i getting request method 'put' not supported error on hitting put method on restful api upload file. following information uploaded ticket. client log restcontroller spring boot app config tomcat log pom.xml 1. client log $ curl -x put -t "/cygdrive/c/a/documents/test.pptx" http://localhost:8080/piranha-storage-service/buckets/gnaval.bucket1/test.pptx <html><head><title>apache tomcat/7.0.52 - error report</title><style><!--h1 {font-family:tahoma,arial,sans-serif;color:white;background-color:#525d76;font-size:22px;} h2 {font-family:tahoma,arial,sans-serif;color:white;background-color:#525d76;font-size:16px;} h3 {font-family:tahoma,arial,sans-serif;color:white;background-color:#525d76;font-size:14px;} body {font-family:tahoma,arial,sans-serif;color:black;background-color:white;} b {font-family:tahoma,arial,sans-serif;color:white;background-color:#525d76;} p {font-family:tahoma,arial,sans-serif;background:white;co...
Read more