Ребята помоги разобраться с созданием редактируемой таблицы. Нужно создать таблицу с редактируемыми ячейками. По щелчку на ячейку открывалась форма редактирования в самой ячейке,для первого столбца получается, а как сделать для другого не знаю... index.php <?php require_once("scripts/dbdata.php"); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ru"> <head> <title>WebListEditor</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <link rel="stylesheet" type="text/css" href="css/styles.css" /> <script type="text/javascript" src="scripts/libs/prototype.js"></script> <script type="text/javascript" src="scripts/libs/scriptaculous.js?load=effects,controls"></script> <script type="text/javascript" src="scripts/tasks.js"></script> </head> <body> <?php $con = connect(); ?> <div id="content"> <?php $res = mysql_query("SELECT * FROM listitems"); if ($res === FALSE) { echo "Ошибка при отправке запроса к БД:".mysql_error(); } elseif (mysql_num_rows($res) == 0) { echo "<div id=\"noItems\">Записей нет</div>"; } else { ?> <p><b>Справочник пользователей:</b></p> <ul id="list"> <?php $i = 0; while ($item = mysql_fetch_array($res, MYSQL_ASSOC)) { $i++; ?> <li id="listNum_<?php echo $i - 1; ?>"> <table width="70" border="1"> <tr> <td width="70"> <div class='itemNum'><?php echo $i; ?></div> </td> <td width="120"> <div class='itemValue' onclick='closeOtherEditors(<?php echo $i - 1; ?>)' id="itemId_<?php echo $item['id']; ?>"><?php echo $item['item']; ?></div> </td> <td> <div class='utemValue' onclick='closeOtherEditors(<?php echo $i - 1; ?>)' id="utemId_<?php echo $utem['id']; ?>"><?php echo $item['utem']; ?></div> </td> </tr> </table> </a> <script type="text/javascript"> editors.push(addEditor("itemId_<?php echo $item['id'];?>", "<?php echo $item['id'];?>")); </script> </li> <?php } ?> </ul> <?php } ?> </div> <?php mysql_free_result($res); mysql_close($con); ?> <form action="#" id="add_item_form"> <p> <label for="item_value"></label> <input type="text" id="item_value" size="20" /> <input type="text" id="utem_value" size="20" /> <input type="button" value="Добавить" onclick="addItem()" /> </p> </form> </body> </html> task.js //глобальный массив для хранения редакторов var editors = []; //эта функция создает редактор для заданного элемента function addEditor(item, id) { return new Ajax.InPlaceEditor(item, "scripts/updateitem.php", { highlightcolor: "#ffffff", size: "4", savingText: "Сохраняю...", callback: function(form, value) { return "value=" + value + "&id=" + id; } }); } //////////// function addEditor(utem, id) { return new Ajax.InPlaceEditor(utem, "scripts/updateitem.php", { highlightcolor: "#ffffff", size: "4", savingText: "Сохраняю...", callback: function(form, value) { return "value=" + value + "&id=" + id; } }); } /////////////// //эта функция добавляет элемент в список function addItem() { //читаем введенное в форму значение var v = $('item_value').value; //формируем строку с параметрами запроса var pars = $H({value:v}).toQueryString(); //выполняем запрос new Ajax.Request( "scripts/additem.php", {method:"post", parameters:pars, onSuccess:parseAddItemResponse} ); } //эта функция вызывается если запрос на добавление нового //элемента в список был выполнен function parseAddItemResponse(transport) { var data = eval('(' + transport.responseText + ')'); //проверяем были ли ошибки if (data.error_mes == null) { //удаляем сообщение об ошибке (если оно осталось после //предыдущего вызова) var errMes = $('err_mes'); if (errMes != null) { Element.remove(errMes); } //удаляем строку "нет записей" (если она есть) var noItems = $('noItems'); if (noItems != null) { Element.remove(noItems); } //вставляем полученный результат в конец списка var list = $('list'); if (list == null) { var content = $('content'); var newItem = new Insertion.Bottom(content, "<ul id=\"list\"></ul>"); list = $('list'); } //вставляем новый элемент в конец списка new Insertion.Bottom(list, "<li id='listNum_" + (editors.length) + "'><div class='itemNum'>" + (editors.length + 1) + "</div>" + "<div class='itemValue' " + "onclick='closeOtherEditors(" + editors.length + ")' id='itemId_" + data.id + "'>" + data.value + "</div>" + "<a href='#' class='deleteLink' onclick='deleteItem(" + data.id + ")'><img src='css/images/delete.gif'" + "alt='Удалить' title='Удалить' /></a></li>"); //создаем редактор для нового элемента и добавляем его в массив editors.push(addEditor("itemId_" + data.id, data.id)); //подсвечиваем вставленный элемент var items = $$('#list li'); new Effect.Highlight(items.last(), {startcolor:"#FDFFB9", endcolor:"#FFFFFF", duration:2.0}); } else { //выводим сообщение об ошибке var form = $('add_item_form'); new Insertion.After(form, "<div id=\"err_mes\">" + data.error_mes + "</div>"); } } //эта функция удаляет элемент списка function deleteItem(id) { var pars = $H({itemid:id}).toQueryString(); new Ajax.Request( "scripts/delete.php", {method:"post", parameters:pars, onSuccess:function(transport) { var data = eval('(' + transport.responseText + ')'); //удаляем элемент из списка var listElem = $('itemId_' + data.deletedId).parentNode.getAttribute('id'); Element.remove(listElem); var listNum = listElem.substring(8); //обновляем номера у всех остальных записей var nodes = $$('#list li'); nodes.each( function(node, index) { if (index >= listNum) { node.setAttribute('id', 'listNum_' + index); var innerNodes = $A(node.getElementsByTagName('div')); innerNodes[0].innerHTML = index + 1; innerNodes[1].setAttribute("onclick", "closeOtherEditors(" + index + ")"); } } ); //удаляем редактор из массива editors.splice(listNum,1); }} ); } function closeOtherEditors(curEditor) { editors.each( function(editor, index) { if (index != curEditor) { editor.leaveEditMode(); } } ); }