Autor Tópico: for (var i = 0; i <= data.length; i++) { não funciona mais?  (Lida 10692 vezes)

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
for (var i = 0; i <= data.length; i++) { não funciona mais?
« Online: 09 de Abril de 2021, 18:40 »
Esta tradicional linha em javascript não funciona mais!?

Dá um erro de
Código: [Selecionar]
cannot read property length of null
Tentei colocar ao redor disto um

Código: [Selecionar]
if (data != null) {
mas não adiantou.

Alguém consegue dar um help?

Offline zekkerj

  • Usuário Ubuntu
  • *
  • Mensagens: 19.735
  • Gratidão gera gratidão, lamúria atrai lamúria...
    • Ver perfil
    • Blog do Zekke
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #1 Online: 12 de Abril de 2021, 16:09 »
Essa variável "data" foi corretamente inicializada?
Pesquise antes de perguntar, sua dúvida pode já ter sido respondida.
Não respondo dúvidas por MP, coloque sua dúvida no fórum onde ela pode ser pesquisada pelos seus colegas!
Não venha ao fórum apenas para perguntar. Se você sabe a resposta de um problema, porque não ajudar seu colega? ;D

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #2 Online: 12 de Abril de 2021, 17:00 »
Postei todo o script para ilustrar o exemplo. É uma script para imprimir grafico de chart.js buscando os dados no mysql. O erro citado é na parte do Ajax. Este exemplo está no canal do Guilherme Chinaglia no youtube, e funciona lá.

Código: [Selecionar]
$('document').ready(function () {

    $.ajax({
        type: "POST",
        url: "chart.php",
        dataType: "json",
        success: function (data) {
           
            var nomearray = [];
            var valorarray = [];

            if (data !== null) {
           
                for (var i = 0; i <= data.length; i++) {

                    nomearray.push(data[i].nome);
                    valorarray.push(data[i].valor);
                }

            }

            grafico(nomearray, valorarray);
           
        }
    });

})

function grafico (nome, valor) {

    // A estrutura abaixo já vem pré-pronta da biblioteca. Ajustar fatores
    var ctx = document.getElementById('chart');
    var myChart = new Chart(ctx, {
        type: 'bar',
        data: {
       
            //
            labels: nome,
       
            // No site do chart.js tem varias opcoes de configuracao
            datasets: [{
                label: 'qde ',
                data: valor,
           
                // The rgba() are an extension of RGB color values with an alpha channel which specifies the opacity of the color
                backgroundColor: [
    'rgba(153, 102, 255, 0.3)',
    'yellow'
                ],
                borderColor: [
                    'rgba(153, 102, 255, 1)',
                    'rgba(255, 99, 132, 1)'
                ],
                borderWidth: 1
            }]
        },
        options: {
            scales: {
                yAxes: [{
                    ticks: {
                        beginAtZero: true
                    }
                }]
            }
        }
    });

}
« Última modificação: 12 de Abril de 2021, 17:02 por maurov »

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #3 Online: 13 de Abril de 2021, 11:51 »
Na tela do navegador, nada aparece. No console do navegador, aparece o seguinte erro:
Código: [Selecionar]
Uncaught TypeError: Cannot read property 'length' of null
    at Object.acquireContext (Chart.min.js:7)
    at Qe.construct (Chart.min.js:7)
    at new Qe (Chart.min.js:7)
    at grafico (app.js:45)
    at Object.success (app.js:33)
    at c (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at l (jquery.min.js:2)
    at XMLHttpRequest.<anonymous> (jquery.min.js:2)

Na mensagem de erro, onde diz chart.min.js:7 , faz um link para:
https://cdnjs.cloudfare.com/ajax/libs/chart.js/2.9.3/chart.min.js7
« Última modificação: 13 de Abril de 2021, 11:53 por maurov »

Offline zekkerj

  • Usuário Ubuntu
  • *
  • Mensagens: 19.735
  • Gratidão gera gratidão, lamúria atrai lamúria...
    • Ver perfil
    • Blog do Zekke
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #4 Online: 13 de Abril de 2021, 14:57 »
Nunca fui muito versado em JS. Mas essa comparação "!==", como aparece no script, está correta?

Experimente também inverter o código, em vez de testar se data não é "null", teste se é, e caso seja, dê algum aviso. Tipo assim:
Código: [Selecionar]
...
if( data == null ) {
    alert( "data é null!!!" );
}
else {
...
Pesquise antes de perguntar, sua dúvida pode já ter sido respondida.
Não respondo dúvidas por MP, coloque sua dúvida no fórum onde ela pode ser pesquisada pelos seus colegas!
Não venha ao fórum apenas para perguntar. Se você sabe a resposta de um problema, porque não ajudar seu colega? ;D

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #5 Online: 13 de Abril de 2021, 18:55 »
Vou testar. Uso ==  ou === ?

Offline zekkerj

  • Usuário Ubuntu
  • *
  • Mensagens: 19.735
  • Gratidão gera gratidão, lamúria atrai lamúria...
    • Ver perfil
    • Blog do Zekke
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #6 Online: 14 de Abril de 2021, 10:21 »
Use "==". A menos que vc tenha alguma documentação autorizando a forma com três sinais de igual...
Pesquise antes de perguntar, sua dúvida pode já ter sido respondida.
Não respondo dúvidas por MP, coloque sua dúvida no fórum onde ela pode ser pesquisada pelos seus colegas!
Não venha ao fórum apenas para perguntar. Se você sabe a resposta de um problema, porque não ajudar seu colega? ;D

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #7 Online: 14 de Abril de 2021, 11:43 »
Não deu.
Vou testar outras versões de min.js e posto aqui

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #8 Online: 14 de Abril de 2021, 12:23 »
No teste sugerido;
Abriu aquela janela da alert com a mensagem 'data é null' e o botão se OK para voltar à janela inicial.

Então, voltando ao php que acessa o DB:
Código: [Selecionar]
$pdo = new PDO('mysql:host=localhost;dbname=mydb;port=3306;charset=utf8','myusername','mypassword');

    $query = "SELECT tb_testepai.nome, tb_testefilha.valor FROM tb_testepai LEFT JOIN tb_testefilha ON tb_testepai.id = tb_testefilha.id_pai";
    $statement = $pdo->prepare(sql);
    $statement->execute();
    while($results=$statement->fetch(PDO::FETCH_ASSOC) ) {
        $result[]=$results;
    }
    echo json_encode($result);

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #9 Online: 14 de Abril de 2021, 12:26 »
o SELECT foi criado, testado e executado dentro do phpmyadmin. Então está ok

Offline zekkerj

  • Usuário Ubuntu
  • *
  • Mensagens: 19.735
  • Gratidão gera gratidão, lamúria atrai lamúria...
    • Ver perfil
    • Blog do Zekke
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #10 Online: 14 de Abril de 2021, 12:28 »
Não encontrei nada que ajude na sua dúvida original, mas pelo menos achei uma boa explicação da diferença entre "==" e "===" (e também, logicamente, entre "!=" e "!==").
http://www.macoratti.net/18/09/js_dif1.htm

De volta ao seu problema, uma possibilidade é que o tipo/valor armazenado em "data" seja alguma coisa que não possui a propriedade "length".

Outra coisa a confirmar, é se o código sendo executado é o seu, ou o que está no site da CloudFlare. Vc confirmar isso na chamada de carga do script JS, na página HTML fonte.
Pesquise antes de perguntar, sua dúvida pode já ter sido respondida.
Não respondo dúvidas por MP, coloque sua dúvida no fórum onde ela pode ser pesquisada pelos seus colegas!
Não venha ao fórum apenas para perguntar. Se você sabe a resposta de um problema, porque não ajudar seu colega? ;D

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #11 Online: 14 de Abril de 2021, 16:13 »
vou tentar usar while com mysqli e criar 2 dados json ao invés de um array, já que assim não consegui.
Posto aqui o que der.
Valeu a parceria!

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #12 Online: 15 de Abril de 2021, 10:51 »
O erro não era ali, mas ainda não achei a resposta. Porque o arranjo fico como NULL?
Script:
Código: [Selecionar]
$query="SELECT a.nome, b.valor FROM tb_testepai a LEFT JOIN tb_testefilha b ON a.id = b.id_pai";
$result=mysqli_query($dbc,$query) or die ('Erro' . mysqli_error($dbc));
while ($row = mysqli_fetch_array($result)) {
        $nome = $row['nome'];
        $valor = $row['valor'];
        echo 'Resposta do echo $nome dentro do while: '.$nome;
        echo '<br >';
        echo 'Resposta do echo $valor dentro do while: '.$valor;
        echo '<br />';
}

    echo 'Resposta do echo json result: '.json_encode($result);

Resultado de tela:
Código: [Selecionar]
Resposta do echo $nome dentro do while: joao
Resposta do echo $valor dentro do while: 30
Resposta do echo $nome dentro do while: joao
Resposta do echo $valor dentro do while: 15
Resposta do echo $nome dentro do while: maria
Resposta do echo $valor dentro do while: 20
Resposta do echo json result: {"current_field":null,"field_count":null,"lengths":null,"num_rows":null,"type":null}

Offline zekkerj

  • Usuário Ubuntu
  • *
  • Mensagens: 19.735
  • Gratidão gera gratidão, lamúria atrai lamúria...
    • Ver perfil
    • Blog do Zekke
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #13 Online: 15 de Abril de 2021, 12:25 »
Hmmmmm... veja só... vc primeiro está iterando sobre o resultado da consulta, depois vc chama json_encode() sobre a consulta...

Mas, imagine que a cada vez que vc chame mysqli_fetch_array() pra ver a próxima linha da consulta, o resultado seja alterado, para remover a linha atual? Quando vc sai da iteração, pode ser que o resultado da consulta realmente não tenha mais nada, e assim, quando você tenta lê-la, os resultados serão nulos...

Talvez vc tenha que, de alguma forma, "resetar" a consulta, depois de iterar sobre ela. Ou chamar json_encode() antes de iterar com mysqli_fetch_array().
Outra alternativa seria buscar na documentação alguma forma de consultar/iterar sobre o resultado da consulta, de forma não destrutiva.
Pesquise antes de perguntar, sua dúvida pode já ter sido respondida.
Não respondo dúvidas por MP, coloque sua dúvida no fórum onde ela pode ser pesquisada pelos seus colegas!
Não venha ao fórum apenas para perguntar. Se você sabe a resposta de um problema, porque não ajudar seu colega? ;D

Offline maurov

  • Usuário Ubuntu
  • *
  • Mensagens: 446
    • Ver perfil
Re:for (var i = 0; i <= data.length; i++) { não funciona mais?
« Resposta #14 Online: 15 de Abril de 2021, 14:27 »
Primeiramente imaginei que fosse a forma de pesquisa que estava errada, então refiz pelo mysqli, que uso e sei que funciona, e o resultado no json encode ficou null.
No meu entendimento, acho que o $result feito pelo mysqli_fetch_array tem todos dados. A varaiavel de loop $row apenas vai extraindo um a um. Então, seria necessário o jason_encode na variável $result mesmo. Mas porque ela traz resultados NULL?
Criei um ambiente semelhante ao do tutorial do guilherme chinaglia, mas não consigo extrair os dados.