0

I'm getting an error when I press the button, error says:

Uncaught TypeError: Cannot read property 'innerHTML' of null at HTMLButtonElement. (javascript.js:13)

This targets the 13 line in my js code: problems seems to be in html or js from line 1 to the end of the first for in line 17.

My html code:

document.getElementById("boton").addEventListener("click", function() {

  var textarea = 0;
  var auxiliar = 0;
  var longitud = document.getElementsByTagName("textarea").length;
  var j = 1; // I initilizate j as 1 
  var entrada = [];

  for (i = 0; i < longitud * 2; i += 2) {
    document.write(nombre) //properly writes as an output 'textarea1' which is the first id
    auxiliar = document.getElementById("textarea" + j).value.split(" "); // HERE IT IS LINE 13!!! here throws the error cant perform value at a null element
    entrada.push(auxiliar[i]);
    entrada.push(auxiliar[i + 1]);

  }


  // imprimir depuracion: abrir inspector>console
  console.log(entrada);


  // ENTRADA
  // declaración de variables ambito, multiple, iniciar
  var d1, d2, i = 0;
  var temporal = [0, 0, 0, 0, 0]; // valores del ejercicio : D A M I C
  // imprimir
  document.write("<b>entrada</b><br/>");
  // bucle repetir hasta fin de entrada
  do {
    d1 = entrada[i];
    d2 = entrada[i + 1];
    document.write(d1 + " " + d2 + "<br/>");
    i += 2;
  } while (i < longitud * 2) // fin de fichero 


  // SALIDA 
  document.write("<b>salida</b><br/>");
  var j = 0;
  i = 0;
  // recorrer entrada
  do {
    d1 = entrada[i];
    d2 = entrada[i + 1];
    if (d1 != 'N' && d1 != 'E') { // AND
      // almacenar el dia
      // valores del ejercicio : D A M I C
      if (d1 == 'D') {
        j = 0;
      }
      if (d1 == 'A') {
        j = 1;
      }
      if (d1 == 'M') {
        j = 2;
      }
      if (d1 == 'I') {
        j = 3;
      }
      if (d1 == 'C') {
        j = 4;
      }
      temporal[j] = temporal[j] + parseFloat(d2);
      j++;
    } else {
      // fin del dia y calculos
      var maximo = 0,
        minimo = 999,
        media = 0,
        suma = 0,
        elementos = 0,
        vmin, vmax, cat, cmin = 0,
        cmax = 0;
      for (k = 0; k < temporal.length; k++) {
        console.log(k + " --" + temporal[k]);

        if (temporal[k] == minimo) {
          cmin++;
        }
        if (temporal[k] == maximo) {
          cmax++;
        }
        if (temporal[k] < minimo) {
          minimo = temporal[k];
          vmin = k;
          cmin = 0
        }
        if (temporal[k] > maximo) {
          maximo = temporal[k];
          vmax = k;
          cmax = 0
        }

        if (temporal[k] != 0) {
          elementos++;
          suma += temporal[k];
        }
      }
      media = suma / elementos;
      console.log(" m" + vmin + " M" + vmax + " e" + elementos + " s" + suma + " m" + media + " " + cmin);

      // imprimir resultados (deberiamos usar funciones y arrays con indices)
      if (vmax == 00) {
        cat = 'DESAYUNO';
      }
      if (vmax == 01) {
        cat = 'COMIDA';
      }
      if (vmax == 02) {
        cat = 'MERIENDA';
      }
      if (vmax == 03) {
        cat = 'CENAS';
      }
      if (vmax == 04) {
        cat = 'COPAS';
      }
      if (cmax > 0) {
        cat = 'EMPATE';
      }
      document.write(cat + "#");
      document.getElementById("resultado").value += cat;
      if (vmin == 00) {
        cat = 'DESAYUNO';
      }
      if (vmin == 01) {
        cat = 'COMIDA';
      }
      if (vmin == 02) {
        cat = 'MERIENDA';
      }
      if (vmin == 03) {
        cat = 'CENAS';
      }
      if (vmin == 04) {
        cat = 'COPAS';
      }
      if (cmin > 0) {
        cat = 'EMPATE';
      }
      document.write(cat + "#");
      document.getElementById("resultado").value += cat;
      if (media > temporal[1]) {
        cat = 'NO';
      } else {
        cat = 'SI';
      }
      document.write(cat + "<br/>");
      document.getElementById("resultado").value += cat;



      // reset para el proximo dia
      var temporal = [0, 0, 0, 0, 0];
      j = 0;
    }
    i += 2; // indice de la entrada  
  } while (i < longitud * 2) // fin de fichero 

});
textarea {
  display: block;
  margin-top: 20px;
}
<p>Datos a introducir</p>
<textarea id="textarea1" row="1" col="10"></textarea>
<textarea id="textarea2" row="1" col="10"></textarea>
<textarea id="textarea3" row="1" col="10"></textarea>
<textarea id="textarea4" row="1" col="10"></textarea>
<textarea id="textarea5" row="1" col="10"></textarea>
<textarea id="textarea6" row="1" col="10"></textarea>
<textarea id="textarea7" row="1" col="10"></textarea>
<textarea id="textarea8" row="1" col="10"></textarea>
<button id="boton" type="button">procesar</button>
<textarea id="resultado" row="1" col="10"></textarea>
mplungjan
  • 134,906
  • 25
  • 152
  • 209
Rddevelop
  • 133
  • 1
  • 8
  • 2
    `document.write` overwrites the entire document, once it's done, you probably no longer have any textareas, depending on what `nombre` is – adeneo Oct 03 '17 at 09:39
  • Replace `document.write(nombre)` with `console.log(nombre)` – gurvinder372 Oct 03 '17 at 09:39
  • Also you did not define `nombre`. You must use innerHTML or appendChild instead of document.write. Please also read https://stackoverflow.com/questions/802854/why-is-document-write-considered-a-bad-practice – mplungjan Oct 03 '17 at 09:43
  • unabled to change the post since it says i have a lot of code but please consider that nombre should be ("textarea"+j) thats what i meant to write – Rddevelop Oct 03 '17 at 09:48
  • thanks for the answers, by using console.log() instead of document.write now i dont get the exception but it says undefined in all the elements of the array 'auxiliar' except in the first 2 elements any idea why that happens? i dont see why the rest elements are not asigned. – Rddevelop Oct 03 '17 at 09:54

0 Answers0