Anil Bhat
Anil Bhat

Reputation: 41

Creating a table dynamically using Javascript

I am trying to create a table dynamically as soon as a page loads. In the code below, I get a response when I click the button, but the table is not displayed on the page. What's wrong with the code below? I have looked at other discussion threads on this topic, but none have helped.

The code in the Javascript file is as follows:

    function showalert() {
            alert('what?');
    }

    function displayGuides() {
            var mgdCell, mgdRow, mgdTable;

      mgdTable = document.createElement('table');
      mgdRow = mgdTable.insertRow(0);
      mgdCell = mgdRow.insertCell(0);
      mgdCell.innerHTML = "1111";
      mgdCell = mgdRow.insertCell(1);
      mgdCell.innerHTML = "2222";
      mgdCell = mgdRow.insertCell(2);
      mgdCell.innerHTML = "3333";
      mgdCell = mgdRow.insertCell(3);
      mgdCell.innerHTML = "4444";
      mgdCell = mgdRow.insertCell(4);
      mgdCell.innerHTML = "5555";
      document.getElementByID('mgdTable').appendChild(mgdTable);
    }

    function mgdUserActions() {
      var create = document.getElementById('create');
      create.onclick = showalert;
      displayGuides();
    }

    window.onload = mgdUserActions;

Upvotes: 0

Views: 4918

Answers (1)

Ryaminal
Ryaminal

Reputation: 108

Your call in displayGuides to document.getElementByID should be document.getElementById. The 'D' in ID should be 'd' Id.

Check out the fiddle of awesomeness

Upvotes: 2

Related Questions