How to make table with DOM?

Question

This code isn't working in IE , so I need put DOM code instead of INNER HTML, ths Gabriel. So, problem is that IE didn't understand innerHTML with TABLE, TR, TD. I need another one way. But I didn't know how, mbe u have links

$(document).ready(function () {
var request = new XMLHttpRequest();
request.open('GET', 'http://api.randomuser.me/?results=11', true);

request.onreadystatechange = function() {
  if (this.readyState === 4) {
    if (this.status >= 200 && this.status < 400) {
      var resp = this.responseText;
      var yourEvent = JSON.parse(resp);
     alert(resp);
     var u = yourEvent.results[0].user;
     //alert(yourEvent.results[0].user.name.title);

     //document.getElementById("table-wrapper").innerHTML=u;

var our_html = "<table 'border='0' cellpadding='0' cellspacing='0'>";
our_html += "<tr><th style='width:52px;border-left:none;'>№</th><th>Имя Фамилия Отчество</th><th>Адрес</th><th>Фото</th><th style='width:180px;border-right: none;'>Действие</th></tr>";
    yourEvent.results.forEach(function(item, item_number){
        var u = item.user; // задрало уже длинно ))
        our_html += "<tr>";
        our_html += "<td style='width:52px;'>" + (parseInt(item_number)+1) + "</td>";
        our_html += "<td class='usname'>" + u.name.title + "." + "<span>" + u.name.first + "</span>" + " " + "<span>" + u.name.last +"</span>" + "</td>";
        our_html += "<td class='usst'>" + "<span>" + u.location.city + "</span>" + ", " + u.location.street + "</td>";
        // чтобы табличку не растаращило, на время отладки
        our_html += '<td style="width:146px;"><img style="max-width:60px; max-height:60px;border-radius: 30px;" src="'+u.picture.medium+'"></td>';
        our_html += '<td style="width:180px; border-right: solid 1px #e1e1e1;"><div class="more" onclick="alert("'+u.name.first+'")">Просмотреть</div></td>';
        our_html += "</tr>";
    });
    our_html += "</table>";

    document.getElementById("table-wrapper").innerHTML=our_html;


    } else {
      //Debug error here!
      console.error("An error occurred");
    }
  }
};
request.send();
request = null;



});

How is it "not working"? Do you get an error? Have you tried debugging it? — Dai, Feb 14 '15 at 08:28
possible duplicate of [Dynamic creation of table with DOM](http://stackoverflow.com/questions/8302166/dynamic-creation-of-table-with-dom) — singhakash, Feb 14 '15 at 08:28
function createTable() { $("#footer").append(""); __ Forgot to delete — Maks, Feb 14 '15 at 08:29
TR , TD , TABLE didn't working in IE with INNER HTML , i Know it. So, i need dom method — Maks, Feb 14 '15 at 08:30
The `innerHTML` problem only _occurs_ if you want to change an existing `tr`, `tbody`, `table`, because for those element `innerHTML` is read-only. But this is should not be the problem in your case. I'm pretty sure there is an error message in the console of IE telling you the problem. — t.niese, Feb 14 '15 at 08:53

score -1 · Answer 1 · edited Feb 14 '15 at 09:15

-1

so, tried another one links.And method like this is works:

$('#table-wrapper').append('<table id="options"><tbody><tr><th>First</th><th>Second</th><th>Third</th><th>Fourth</th><th>Fifth</th></tr></tbody></table>');

Now I just need to put inside my vars.

edited Feb 14 '15 at 09:15

Dan D.

73,243
15
104
123

answered Feb 14 '15 at 08:49

Maks

7
2

How to make table with DOM?

1 Answers1