Форум PHP программистов > JS и данные таблицы

[ Поиск ] - [ Пользователи ] - [ Календарь ]

pavel24071988

1.08.2011 - 11:39

Здравствуйте!

Может кто-нибудь что-нибудь посоветует?

Есть страница Ajax, при нажатии на кнопку (запрос) на страницу выгружается таблица (кол-во строк генериться в зависимости от результата запроса) В таблице есть столбцы: id, name, summ,.... Как можно сделать, что бы при наведении или при нажатии на определенную строку я бы получил name(запись в строке)?
Данные в таблицу загружаются из XML строки

Вот таблица :

ApuktaChehov

1.08.2011 - 12:03

Вставляете в строку, к примеру div, делаете его скрытым, а при нажатии на строку показываете его.

_____________

pavel24071988

1.08.2011 - 12:49

У меня строки и столбцы создаются посредством элемента createElement вот так :

var a = wer.getElementsByTagName('id_doc')[i].childNodes[0].nodeValue;
var r = document.createElement('tr');
var ca = document.createElement('td');
var ta = document.createTextNode(a);
var t = document.getElementById('tbb');
ca.appendChild(ta);
r.appendChild(ca);
t.tBodies(0).appendChild(r);

- т.е как то этой ячейке запихнуть div?

ApuktaChehov

1.08.2011 - 13:25

Этот код не вы писали что-ли?
Запихнуть можно вот так:

ca.appendChild(div);

_____________

pavel24071988

1.08.2011 - 13:44

Спасибо за наводку. Ща поковыряю

pavel24071988

11.08.2011 - 21:38

Извиняюсь за оффтоп
я упростил данный вариант до:

<html>
<head>
  <script language='javascript'>
    function addRow(a,b,c) {
for (i=0; i<10; i++){
      var r  = document.createElement('tr');
      var ca = document.createElement('td');
      var cb = document.createElement('td');
      var cc = document.createElement('td');
      var ta = document.createTextNode(a);
      var tb = document.createTextNode(b);
      var tc = document.createTextNode(c);
      var t  = document.getElementById('test');


      ca.appendChild(ta);
      cb.appendChild(tb);
      cc.appendChild(tc);

      r.appendChild(ca);
      r.appendChild(cb);
      r.appendChild(cc);

      t.tBodies(0).appendChild(r);
    }
}



  </script>
  </head>
<body>

   <form>
      Column A: <input type=text name=a>
  <br>Column B: <input type=text name=b>
      Column C: <input type=text name=c>
  <br><input type=button value='Запрос' onClick='javascript:addRow(a.value, b.value, c.value)'>

   </form>

   <table id="test" align=left >
     <tr><td>id</td><td>name</td><td>summ</td></tr>
   </table>

</body>
</html>

Для хождения по строкам пытаюсь использовать функцию
Вот собственно код с функцией

<html>
<head>

 <script language='javascript'>
function trsetcolor(tableID, selColor, normColor){
     table = document.getElementById(tableID);
     var trs=table.getElementsByTagName('tr');
     for(var j=0;j<trs.length;j++){
       trs[j].onmouseover=function(){this.bgColor = selColor;return false;};
       trs[j].onmouseout=function(){this.bgColor = normColor;return false;};
     }
}
    function addRow(a,b,c) {
for (i=0; i<10; i++){
      var r  = document.createElement('tr');
      var ca = document.createElement('td');
      var cb = document.createElement('td');
      var cc = document.createElement('td');
      var ta = document.createTextNode(a);
      var tb = document.createTextNode(b);
      var tc = document.createTextNode(c);
      var t  = document.getElementById('test');


      ca.appendChild(ta);
      cb.appendChild(tb);
      cc.appendChild(tc);

      r.appendChild(ca);
      r.appendChild(cb);
      r.appendChild(cc);

      t.tBodies(0).appendChild(r);
    }
}


  </script>
</head>
<body onload="trsetcolor('test', '#66ff99', '#ffffff');">

   <form>
      Column A: <input type=text name=a>
  <br>Column B: <input type=text name=b>
      Column C: <input type=text name=c>
  <br><input type=button value='Запрос' onClick='javascript:addRow(a.value, b.value, c.value)'>

   </form>

   <table id="test" align=left >
     <tr><td>id</td><td>name</td><td>summ</td></tr>
   </table>

</body>
</html>

СФОРМИРОВАННЫЕ СТРОКИ НЕ ПОДСВЕЧИВАЮТСЯ, что не так-то?

А еще нужно и вытягивать значения сроки(ячейки) для переменой последующего AJAX запроса

Очень нужна помощь зала !!!!

Быстрый ответ:

Здесь расположена полная версия этой страницы.