javascript - Rows disappearing on Datatables? -


so let me first explain trying emulate. home page, there main table recent table entries. user given set of "favorite" folders can drag , drop table rows main table. rather dragging whole visible row (my rows rather wide, , difficult tell folder drop into) have "information" icon, in case arrow. user can drag icon , drop folder, when @ point should removed main table , appended table within favorite folder. far, of happening in following fiddle (except row not removed main table). problem starts become apparent use of datatables. after adding row favorite folder, there, until click next , previous on pagination. disappears. also, never seems part of table because information on bottom left of datatables not updating. showing 1 2 of 3 entries, when there may 4 total (from rows user dragged). understand add rows datatables, need fnadddata i'm not sure how use in instance, ideas? thank in advance. fiddle: http://jsfiddle.net/yk5fg/4/

$( ".drag" ).draggable({ revert: "invalid" });                $( ".droptarget" ).droppable({                 drop: function( event, ui ) {                   // fade out dropped icon                         ui.draggable.hide();                   var dropped = parseint($(this).attr('title')) + 1;                   $( )                   .attr('title',dropped+' entries');                     var delay =  $(this);                       delay.prop('disabled', true).addclass('ui-state-highlight')                       settimeout(function() {                           delay.prop('disabled', false).removeclass('ui-state-highlight');                       }, 2000)                        var rowid = ui.draggable.prop("id");                       var cloned = $(".basic").find("tr#"+rowid).clone();                       $(".fav1table").append(cloned);                 }               }); 

you can use fnaddtr plug-in http://datatables.net/plug-ins/api add cloned tr

$( ".droptarget" ).droppable({ drop: function( event, ui ) {     //ui.draggable.hide();     var dropped = parseint($(this).attr('title')) + 1;     $( ).attr('title',dropped+' entries');      var delay =  $(this);     delay.prop('disabled', true).addclass('ui-state-highlight')     settimeout(function() {     delay.prop('disabled', false).removeclass('ui-state-highlight');     }, 2000);          //return position of ui.draggable appear inside parent row         ui.draggable.css({"top":"0px","left":"0px"});         //get tr dragged         var rowid = ui.draggable.parents("tr");         //clone rowid          var cloned = rowid.clone();         //make cloned icon draggable         cloned.find(".drag").draggable({ revert: "invalid"});         //add coned tr fnaddtr         $(".fav1table").datatable().fnaddtr(cloned[0]);         //delete rowid fndeleterow  add [0] fix redraw error          $(".basic").datatable().fndeleterow(rowid[0]);     } });     

http://jsfiddle.net/yk5fg/7/
update
count on $(".basic").datatable() change when use .fndeleterow() , icon (draggable) return row


Comments

Popular posts from this blog

c# - How Configure Devart dotConnect for SQLite Code First? -

java - Copying object fields -

c++ - Clear the memory after returning a vector in a function -