Cuando seleeciono los datos , se pasan a otra tabla, y cuando busco varias veces en la tabla principal, se borra la tabla de productos seleccionados,como podria evitarlo y guardarlo en un array de objetos para luego insertarlo en la base de datos .
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="https:https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<link rel="https:https://cdn.datatables.net/buttons/1.5.2/css/buttons.dataTables.min.css">
<script src="https://code.jquery.com/jquery-3.3.1.js" type="text/javascript"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js" type="text/javascript"></script>
<script src="https://cdn.datatables.net/rowreorder/1.2.3/js/dataTables.rowReorder.min.js" type="text/javascript"></script>
<script src="https://cdn.datatables.net/responsive/2.2.1/js/dataTables.responsive.min.js" type="text/javascript"></script>
<script src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.print.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.2/js/dataTables.buttons.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js" type="text/javascript"></script>
<script src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.html5.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/rowreorder/1.2.3/css/rowReorder.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.2.1/css/responsive.dataTables.min.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.5.2/css/buttons.dataTables.min.css">
</head>
<body>
<div >
<table id="mitabla" border="1" class=" display table display table-striped">
<thead>
<tr>
<th>Check</th>
<th>Codigo</th>
<th>Articulo</th>
<th>Precio</th>
<th>Cantidad</th>
<th>Presentacion</th>
</tr>
</thead>
<tbody>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO001</th>
<th>Mantequilla</th>
<th>12.5</th>
<th>50</th>
<th>En paquete</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO002</th>
<th>Yogurt</th>
<th>5.60</th>
<th>100</th>
<th>En botella</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO003</th>
<th>Gaseosa</th>
<th>3.50</th>
<th>40</th>
<th>En botella</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO004</th>
<th>Pul</th>
<th>3.50</th>
<th>40</th>
<th>En botella</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO005</th>
<th>Jamonada</th>
<th>2.10</th>
<th>100</th>
<th>En paquete</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO003</th>
<th>Gaseosa</th>
<th>3.50</th>
<th>40</th>
<th>En botella</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO004</th>
<th>Pul</th>
<th>3.50</th>
<th>40</th>
<th>En botella</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO005</th>
<th>Jamonada</th>
<th>2.10</th>
<th>100</th>
<th>En paquete</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO003</th>
<th>Gaseosa</th>
<th>3.50</th>
<th>40</th>
<th>En botella</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO004</th>
<th>Pul</th>
<th>3.50</th>
<th>40</th>
<th>En botella</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO005</th>
<th>Jamonada</th>
<th>2.10</th>
<th>100</th>
<th>En paquete</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO005</th>
<th>Jamonada</th>
<th>2.10</th>
<th>100</th>
<th>En paquete</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO005</th>
<th>Jamonada</th>
<th>2.10</th>
<th>100</th>
<th>En paquete</th>
</tr>
<tr>
<td class="check"><input name="" type="checkbox"></td>
<th>PRO005</th>
<th>Jamonada</th>
<th>2.10</th>
<th>100</th>
<th>En paquete</th>
</tr>
</tbody>
</table>
</div>
<table id="tabla2" class=" display table display table-striped">
<tbody>
</tbody>
</table>
</body>
</html>
<script type="text/javascript">
$(document).ready(function() {
$('#mitabla').DataTable({
rowReorder: {
selector: 'td:nth-child(2)'
},
fixedHeader: true,
responsive: true,
autoFill: true,
paging: true,
ordering: true,
searching: true,
info: true,
// scrollY: 400, // mantiene en tamaño en el eje y
deferRender: true,
scroller: true,
"language": {
"sProcessing": "Procesando...",
"sLengthMenu": "Mostrar _MENU_ registros",
"sZeroRecords": "No se encontraron resultados",
"sEmptyTable": "Ningún dato disponible en esta tabla",
"sInfo": "Mostrando registros del START al END de un total de TOTAL",
"sInfoEmpty": "Mostrando registros del 0 al 0 de un total de 0",
"sInfoFiltered": "(filtrado de un total de MAX registros)",
"sInfoPostFix": "",
"sSearch": "Buscar:",
"sUrl": "",
"sInfoThousands": ",",
"sLoadingRecords": "Cargando...",
"oPaginate": {
"sFirst": "Primero",
"sLast": "Último",
"sNext": "Siguiente",
"sPrevious": "Anterior"
},
"oAria": {
"sSortAscending": ": Activar para ordenar la columna de manera ascendente",
"sSortDescending": ": Activar para ordenar la columna de manera descendente"
}
}
});
$('input[type=checkbox]').click(function() {
if($(this).is(":checked"))
{
// el checkbox esta marcado
// movemos la columna a la tabla2
var tr=$(this).parents("tr").appendTo("#tabla2 tbody");
}else{
// el checkbox esta desmarcado
// movemos la columna a la tabla1
var tr=$(this).parents("tr").appendTo("#mitabla tbody");
}
});
} );
</script>