Send data from a html table to php

0

Hello

I have a table

<table>
  <thead>
    <th>Codigo</th>
    <th>Nome</th>
  </thead>
  <tr>'insira o código aqui'
     <td>1</td>
     <td>Carlos</td>
  </tr>
  <tr>
     <td>2</td>
     <td>Charles</td>
  </tr>
  <tr>
     <td>3</td>
     <td>José</td>
  </tr>
</table>

I would like to know if you have "get" this data and send it to php can be via json or even javascript

I tried to use this:

var dadosDataTabela = [];

function verificarTabela() {
    $('.item').each(function () {
       var todos_itens = {
           codigo   : $(this).children()[0].innerText,
           nome     : $(this).children()[1].innerHTML,

       };
       dadosDataTabela.push(todos_itens);
    });
}

and to send JSON.stringify(dadosDataTabela),

But I have not yet had success as received in php. To then send this data to the bank

    
asked by anonymous 07.03.2017 / 00:56

3 answers

1

There is a jQuery library that does the hard work ( table-to-json ), and why I could see from the documentation, it is very customizable:

$('#converter-tabela').click( function() {
  var table = $('#tabela').tableToJSON();
  console.log(table);
  alert(JSON.stringify(table));  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><scriptsrc="http://www.developerdan.com/table-to-json/javascripts/jquery.tabletojson.min.js"></script>

<table id="tabela">
  <thead>
    <th>Codigo</th>
    <th>Nome</th>
  </thead>
  <tr>
     <td>1</td>
     <td>Carlos</td>
  </tr>
  <tr>
     <td>2</td>
     <td>Charles</td>
  </tr>
  <tr>
     <td>3</td>
     <td>José</td>
  </tr>
</table>
<button id="converter-tabela" >Converter</button>
    
07.03.2017 / 01:09
1

With php you can do this: put the html code of the table in the variable $ tab

$tab = "
<table>
<thead>
<th>Codigo</th>
<th>Nome</th>
</thead>
<tr>'insira o código aqui'
<td>1</td>
<td>Carlos</td>
</tr>
<tr>
<td>2</td>
<td>Charles</td>
</tr>
<tr>
<td>3</td>
<td>José</td>
</tr>
</table>
";

$er = "/<td(.*?)?>(.*?)+<\/td>/i";
preg_match_all ($er, $tab, $matches);

$td00=$matches[0][0];
$td01=$matches[0][1];
$td02=$matches[0][2];
$td03=$matches[0][3];
$td04=$matches[0][4];
$td05=$matches[0][5];

...("Insert into tabela (coluna1,coluna2,coluna3,coluna4,coluna5,coluna6)
values ('".$td00."','".$td01."','".$td02."','".$td03."','".$td04."','".$td05."')");

The function preg_match_all () will return an integer with the number of occurrences found by the regular expression.

The function accepts 5 parameters, 3 of which are mandatory and 2 are optional. learn more at preg_match_all

$resultado = preg_match_all($pattern, $subject, $matches);
  • $ pattern will be the expression regultar,
  • $ subject will be the text (subject) that the expression will search
  • $ matches will be an array with occurrences (strings found).
  

Or you can also get the $ tab variable data from a file

$file = fopen("filename.html","r");

while(! feof($file))
  {
  $result=$result. fgets($file);
  }
fclose($file);

$tab = ".$result.";
    
07.03.2017 / 01:41
0

Using the lib that @ Bonifazio indicated:

data.php

<?php
    $data = json_decode($_POST['dados_tabela'], true);

    /*
       $data terá o seguinte valor:
       array(
          array(
              "Codigo": 1
              , "Nome": "Carlos"
          )
          ... os demais nomes
       )

       É só percorrer o array com um laço e gravar no banco
    */
    // Retorna a confirmação para o javascript
    echo json_encode(array('success' => true));
?>

index.html

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><scriptsrc="http://www.developerdan.com/table-to-json/javascripts/jquery.tabletojson.min.js"></script>
<script>
    $('#converter-tabela').click( function() {
        var table = $('#tabela').tableToJSON();
        console.log(table);
        alert(JSON.stringify(table)); 
        // Você envia os dados para o PHP utilizando AJAX
        $.ajax({
            // Enviamos os dados da tabela para um script PHP
            url: 'dados.php'
            , data: { dados_tabela: table }
            , method: 'POST'
        }).then(function(result) {
           // No retorno, apenas confirmamos
           if (result.success) {
               alert('Enviado para o servidor com sucesso!');
           }
       });
     });
</script>

<table id="tabela">
  <thead>
    <th>Codigo</th>
    <th>Nome</th>
  </thead>
  <tr>
     <td>1</td>
     <td>Carlos</td>
  </tr>
  <tr>
     <td>2</td>
     <td>Charles</td>
  </tr>
  <tr>
     <td>3</td>
     <td>José</td>
  </tr>
</table>
<button id="converter-tabela" >Converter</button>
    
07.03.2017 / 05:23