Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.05.2014, 16:16
Аспирант
Отправить личное сообщение для ArtemGavrilenko Посмотреть профиль Найти все сообщения от ArtemGavrilenko
 
Регистрация: 25.04.2014
Сообщений: 37

Вывод информации из массива в таблицу
Добрый день!
Помогите с выводом информации из массива в таблицу, не могу добавить в 0-ю строку var rows.getElementsByTagName('tr')[0].innerHTML = '<tr><td>Марка техники<td><td>Модель техники<td><td>Страна производитель<td><td>Цена<td></tr>';
И как на место i*j подставить значению из массива
var goods = [
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '82.1',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.11',
				},
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '892',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.21',
				},
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '920',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.31',
				},
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '92П',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.22',
				},
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '922.3',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.42',
				},
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '952.2',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '2.42',
				},
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '1025.2',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '2.22',
				},
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '1221.2',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '2.24',
				},
				{		
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '1523.В',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '2.16',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '82.1',
					country: {
						ru:'Украина',
						ua: 'Україна',
					},
					price: '2.16',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '892',
					country: {
						ru:'Украина',
						ua: 'Україна',
					},
					price: '1.85',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '1221.2',
					country: {
						ru:'Украина',
						ua: 'Україна',
					},
					price: '1.19',
				},
			]		
		var countGoods = goods.length;				
		
		var table = document.createElement('table');
		table.setAttribute('border', '1');
		table.setAttribute('color', '000');
		table.setAttribute('width','500');
		table.setAttribute('height', '300');

		var tbody = document.createElement('tbody');

						
		
		for(var i = 0; i < countGoods; i++){
			var tr = document.createElement('tr');
			var rows.getElementsByTagName('tr')[0].innerHTML = '<tr><td>Марка техники<td><td>Модель техники<td><td>Страна производитель<td><td>Цена<td></tr>';
				for (var j = 0; j < 4; j++) {
					var td = document.createElement('td');			
					td.innerHTML = i*j; 
					tr.appendChild(td);
				}
				tbody.appendChild(tr);		
		}
		table.appendChild(tbody);				
		document.getElementById('table-lizing-traktor').appendChild(table);				
		}
Ответить с цитированием
  #2 (permalink)  
Старый 16.05.2014, 16:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

ArtemGavrilenko,
то есть вы хотите строку в строку вложить?
Ответить с цитированием
  #3 (permalink)  
Старый 16.05.2014, 16:23
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от ArtemGavrilenko
var rows.getElementsByTagName
что есть rows и зачем var
Ответить с цитированием
  #4 (permalink)  
Старый 16.05.2014, 16:38
Аспирант
Отправить личное сообщение для ArtemGavrilenko Посмотреть профиль Найти все сообщения от ArtemGavrilenko
 
Регистрация: 25.04.2014
Сообщений: 37

чтобы в первой строке было Марка техники Модель техники Страна производитель Цена, а остальных данные из массива
добился "чтобы в первой строке было Марка техники Модель техники Страна производитель Цена", а каким образом можно занести данные из массива в таблицу?

Последний раз редактировалось ArtemGavrilenko, 16.05.2014 в 16:50.
Ответить с цитированием
  #5 (permalink)  
Старый 16.05.2014, 17:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

ArtemGavrilenko,

<!DOCTYPE HTML>

<html>

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

<body>
<div id="table-lizing-traktor"></div>
<script>
var goods = [
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '82.1',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.11',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '892',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.21',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '920',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.31',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '92П',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.22',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '922.3',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '1.42',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '952.2',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '2.42',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '1025.2',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '2.22',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '1221.2',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '2.24',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '1523.В',
					country: {
						ru:'Беларусь',
						ua: 'Білорусь',
					},
					price: '2.16',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '82.1',
					country: {
						ru:'Украина',
						ua: 'Україна',
					},
					price: '2.16',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '892',
					country: {
						ru:'Украина',
						ua: 'Україна',
					},
					price: '1.85',
				},
				{
					name: {
						ru:'МТЗ',
						ua: 'МТЗ',
					},
					model: '1221.2',
					country: {
						ru:'Украина',
						ua: 'Україна',
					},
					price: '1.19',
				},
			]
		var countGoods = goods.length;

		var table = document.createElement('table');
		table.setAttribute('border', '1');
		table.setAttribute('color', '000');
		table.setAttribute('width','500');
		table.setAttribute('height', '300');

		var tbody = document.createElement('tbody');
        var tr = document.createElement('tr');
			tr.innerHTML = '<td>Марка техники</td><td>Модель техники</td><td>Страна производитель</td><td>Цена</td>';
            tbody.appendChild(tr);
        var items = ['name','model','country','price'], country = 'ru';
		for(var i = 0; i < countGoods; i++){
			var tr = document.createElement('tr');
				for (var j = 0; j < 4; j++) {
					var td = document.createElement('td');
                    var item = goods[i][items[j]];
					td.innerHTML = item[country] ? item[country] : item;
					tr.appendChild(td);
				}
				tbody.appendChild(tr);
		}
		table.appendChild(tbody);
		document.getElementById('table-lizing-traktor').appendChild(table);


</script>
</body>

</html>
Ответить с цитированием
  #6 (permalink)  
Старый 16.05.2014, 17:17
Аспирант
Отправить личное сообщение для ArtemGavrilenko Посмотреть профиль Найти все сообщения от ArtemGavrilenko
 
Регистрация: 25.04.2014
Сообщений: 37

Благодарю! Мне еще учится и учиться
Ответить с цитированием
  #7 (permalink)  
Старый 29.06.2017, 01:32
Кандидат Javascript-наук
Отправить личное сообщение для zoOmer Посмотреть профиль Найти все сообщения от zoOmer
 
Регистрация: 21.05.2013
Сообщений: 131

рони, Дельный пример)

А не мог бы ты написать точно такое же только на jq ?
Ответить с цитированием
  #8 (permalink)  
Старый 29.06.2017, 02:38
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

создание таблицы из обьекта данных на jquery
zoOmer,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  table{
    border-collapse: collapse;
  }

  </style>
</head>

<body>
<div id="table-lizing-traktor"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

<script>
 $(function(){


var goods = [
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '82.1',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '1.11',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '892',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '1.21',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '920',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '1.31',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '92П',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '1.22',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '922.3',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '1.42',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '952.2',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '2.42',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '1025.2',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '2.22',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '1221.2',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '2.24',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '1523.В',
          country: {
            ru:'Беларусь',
            ua: 'Білорусь',
          },
          price: '2.16',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '82.1',
          country: {
            ru:'Украина',
            ua: 'Україна',
          },
          price: '2.16',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '892',
          country: {
            ru:'Украина',
            ua: 'Україна',
          },
          price: '1.85',
        },
        {
          name: {
            ru:'МТЗ',
            ua: 'МТЗ',
          },
          model: '1221.2',
          country: {
            ru:'Украина',
            ua: 'Україна',
          },
          price: '1.19',
        },
      ]

  var items = ["name", "model", "country", "price"],
    country = "ru",
    table = $("<table/>", {
        attr: {
            border: "1",
            width: "500"
        }
    }),
    tr = $("<tr>");
tr.clone().html("<td>Марка техники</td><td>Модель техники</td><td>Страна производитель</td><td>Цена</td>").appendTo(table);
goods.forEach(function(b) {
    var c = tr.clone().appendTo(table);
    items.forEach(function(a) {
        a = b[a];
        a = a[country] || a;
        $("<td>", {
            html: a
        }).appendTo(c)
    })
});
$("#table-lizing-traktor").append(table);
  })
</script>
</body>

</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывод случайных элементов из массива в таблицу Narm0 Общие вопросы Javascript 10 06.08.2013 12:39
Вывод определенных записей в таблицу без фильтрации Eugent ExtJS 0 27.08.2012 11:23
Вывод с БД в таблицу [EXT JS] RogeR31415 ExtJS 46 28.06.2012 21:02
Вывод информации о свободном месте на жд на сайте Kmetik Events/DOM/Window 2 24.06.2012 12:32
вывод результатов поиска в таблицу в отдельном окне muhrab Элементы интерфейса 16 02.07.2009 17:26