Remove from a table and insert the same row into another table

Navigation
3

How can I remove a line from a table by clicking on an icon check, and clicking the icon, delete the task with id="nexttasks" task and add it to the table with id="mytasks"

I was able to remove from one table but not add another. What can I do?

I can not use jquery .... Javascript only

Here is the code I've already done: 

<!DOCTYPE html>
    <html>
    <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/font-awesome.min.css">
    </head>
    <body>
    <table class="table table-striped" id="proximasTarefas">
                                                            <thead>
                                                                <tr>
                                                                    <th>Tarefa</th>
                                                                    
                                                                    <th>Ações</th>
                                                                </tr>
                                                            </thead>
                                                            <tbody>
                                                                <tr>
                                                                    <td>Preparar a campanha de adoção</td>
                                                                    <td class="text-center"><i class="fa fa-check"></i></td>
                                                                </tr>
                                                                <tr>
                                                                    <td>Contactar os adotantes da Mamã</td>
                                                                    <td class="text-center"><i class="fa fa-check"></i></td>
                                                                </tr>
                                                                <tr>
                                                                    <td>Levar o Zazu ao veterinário</td>
                                                                    <td class="text-center"><i class="fa fa-check"></i></td>
                                                                </tr>
                                                                <tr>
                                                                    <td>Consultar a FAT da ninhada de Garfe</td>
                                                                    <td class="text-center"><i class="fa fa-check"></i></td>
                                                                </tr>
                                                                
                                                                
                                                                
                                                                    
                                                            </tbody>
                                                        </table>

    </body>
 </html>

The javaScript I made to remove was this: 

function removeLinha(linha) {
              var i=linha.parentNode.parentNode.rowIndex;
              document.getElementById('tabProximasTarefas').deleteRow(i);
            }

But I wanted to put the task that excludes, for example, Preparing the adoption campaign, in another table whose id="my Tasks"

    
asked by anonymous 28.11.2018 / 17:24

2 answers

0

I think this should work: 

function trocaLinha(linha) {
    var conteudo = linha.innerHTML;
    var i=linha.parentNode.parentNode.rowIndex;
    document.getElementById('tabProximasTarefas').deleteRow(i);
    //ou linha.remove();
    var novaLinha = document.getElementById('tabMinhasTarefas').insertRow();
    novaLinha.innerHTML = conteudo;
}

Hugs

    
28.11.2018 / 17:44
0

<!DOCTYPE html>
    <html>
    <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/font-awesome.min.css">
    <script>
    function trocaLinha(linha) {
        var conteudo = linha.innerHTML;
        linha.remove();
        var novaLinha = document.getElementById('minhasTarefas').insertRow();
        novaLinha.innerHTML = conteudo;
    }
	</script>
    </head>
    <body>
	<h1>Proximas tarefas</h1>
    <table class="table table-striped" id="proximasTarefas">
		<thead>
			<tr>
				<th>Tarefa</th>
				
				<th>Ações</th>
			</tr>
		</thead>
		<tbody>
			<tr onclick="trocaLinha(this);">
				<td>Preparar a campanha de adoção</td>
				<td class="text-center"><i class="fa fa-check"></i></td>
			</tr>
			<tr onclick="trocaLinha(this);">
				<td>Contactar os adotantes da Mamã</td>
				<td class="text-center"><i class="fa fa-check"></i></td>
			</tr>
			<tr onclick="trocaLinha(this);">
				<td>Levar o Zazu ao veterinário</td>
				<td class="text-center"><i class="fa fa-check"></i></td>
			</tr>
			<tr onclick="trocaLinha(this);">
				<td>Consultar a FAT da ninhada de Garfe</td>
				<td class="text-center"><i class="fa fa-check"></i></td>
			</tr>
			
			
			
				
		</tbody>
	</table>
	<h1>Minhas tarefas</h1>
	<table class="table table-striped"  id="minhasTarefas">
		<thead>
			<tr>
				<th>Tarefa</th>
				
				<th>Ações</th>
			</tr>
		</thead>
	</table>
    </body>
 </html>
    
29.11.2018 / 16:39
Unconfigured accents when passing data from a txt to a list in Python [closed] Does anyone know how to do a Web Scraping on the SICONV (Free Access) website?