Untitled

<!DOCTYPE html>

<html>

  <head>
    <meta charset="utf-8">
    <title>Chessboard</title>
  </head>

  <body>

    <!-- A button to display width -->

    <button onclick="widthCH()">Gimme width!</button>
    <br>
    <p id="widthDP"></p>

    <!-- A button to display lenght -->

    <button onclick="heightCH()">Gimme height!</button>
    <br>
    <p id="heightDP"></p>

    <!-- A button to run the code -->

    <button onclick="chessboard()">Go!</button>
    <br>

    <!-- This is where the strings will appear -->

    <p id="chess"></p>

    <script>

      var widthVal = 8;
      var heightVal = 8;

      // This is the code that collects width data

      function widthCH() {
        widthVal = prompt("Define width.", 8);
      }

      // This is the code that collects width data

      function heightCH() {
        heightVal = prompt("Define height.", 8);
      }

      // This is that excecutes the program

      function chessboard() {

        var row_even = "";
        var row_odd = "";
        var board = "";
        var i = 0;

        // This generates the rows

        if ((widthVal > 0) && (widthVal % 1 == 0) && !(widthVal == NaN)) {

          // This generates the even rows

          while (i < widthVal) {
            if (i % 2 == 0) {
              row_even += "_";
              i++;
            }
            else {
              row_even += "#";
              i++;
            }
          }

          // This resets the counter

          i = 0;

          // This generates the odd rows

          while (i < widthVal) {
            if (i % 2 == 0) {
              row_odd += "#";
              i++;
            }
            else {
              row_odd += "_";
              i++;
            }
          }

          // This resets the counter

          i = 0;
        }

        else {
          widthVal = "nani? :V";
        }

        // This creates the chessboard using the generated rows

        if ((heightVal > 0) && (heightVal % 1 == 0) && !(heightVal == NaN)) {
          while (i < heightVal) {
            if (i % 2 == 0) {
              board += row_even + "<br>";
              i++;
            }
            else {
              board += row_odd + "<br>";
              i++;
            }
          }
        }
        else {
          heightVal = "nani? :V";
        }

        document.getElementById("widthDP").innerHTML = "Width is: " + widthVal;
        document.getElementById("heightDP").innerHTML = "Height is: " + heightVal;
        document.getElementById("chess").innerHTML = board;

      }

    </script>

  </body>
</html>