for (var i = 0; i <= data.length; i++) { não funciona mais?

[maurov]

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?

[zekkerj]

Essa variável "data" foi corretamente inicializada?

[maurov]

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
                    }
                }]
            }
        }
    });

}


[maurov]

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

[zekkerj]

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 {
...


[maurov]

Vou testar. Uso ==  ou === ?

[zekkerj]

Use "==". A menos que vc tenha alguma documentação autorizando a forma com três sinais de igual...

[maurov]

Não deu.
Vou testar outras versões de min.js e posto aqui

[maurov]

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);

[maurov]

o SELECT foi criado, testado e executado dentro do phpmyadmin. Então está ok

[zekkerj]

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.

[maurov]

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!

[maurov]

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}

[zekkerj]

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.

[maurov]

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.