Как я могу добавить строку таблицы, используя событие onclick в td

Итак, у меня есть еще одно раскрывающееся под именем пользователя при нажатии, показывая имя, адрес электронной почты и т. д. для этого пользователя, но он выводит информацию о пользователе для каждого пользователя под каждым именем пользователя, а не сразу под тем, который я щелкнул на.

Есть ли способ заставить его показывать только следующий элемент, а не все скрытые?

Я попытался захватить индекс щелкнутого (тот, который имеет имя пользователя, но я не могу заставить функцию работать с использованием любого типа логики типа index + 1.

Вот код, который у меня есть сейчас:

<?php
  for ($output_user = 0; $output_user <= $num_pending - 1; $output_user++)
  {
    echo "\n\t<tr class=\"pending_users\">\n\t\t<td class=\"admin\">".$pending_user[$output_user][0]."</td>";
    echo "\n\t\t<td class=\"m_1\"><input type=\"checkbox\" value=\"approve\"/></td>";
    echo "\n\t\t<td class=\"m_l\"><input type=\"checkbox\" value=\"deny\"/></td>";
    echo "\n\t</tr>";
    echo "\n\t<tr class=\"showhide\">\n\t\t<td class=\"admin\" colspan=\"3\">Name:".$pending_user[$output_user][1]." ".$pending_user[$output_user][2]."\nEmail: ".$pending_user[$output_user][3]."\nEnrol Date: ".$pending_user[$output_user][4]."</td>\n\t</tr>";
    echo "\n\t</tr>";
  }
?>
<script>
 $(document).ready(function() {
  //Hides specific user details when the page loads
  $("div.show_user_info tr.showhide:visible").hide();

  //Makes every other row another bgcolor - effects pending user table only
  $("tr.pending_users:odd").css("background-color", "#ffff00");
 });

 $("td.admin").click(function () {
  var nextIndex = $("tr").index(this) + 1;
  $("div.show_user_info tr.showhide:hidden").slideDown("slow");
 });

 $("tr.showhide").click(function () {

  $(this).slideUp("slow");          
 });
</script>

Страница, над которой я работаю, — это страница администратора, где пользователь может одобрять или отклонять запросы на регистрацию. Я использую php для динамического создания строки таблицы для каждого пользователя в базе данных, ожидающей регистрации.

При этом, когда пользователь нажимает на имя пользователя пользователя, я хочу вставить +, который покажет информацию о пользователях (имя, дату запроса и т. д.), и это исчезнет, ​​когда пользователь нажмет на другое с другим имя пользователя на нем, и он отображает другую строку и т. д. для этого пользователя.

PHP, который я использую для создания строк таблицы, таков:

<?php
    for ($output_user = 0; $output_user <= $num_pending - 1; $output_user++)
    {
        echo "\n\t<tr>\n\t\t<td class=\"admin\">".$pending_user[$output_user][0]."</td>";
        echo "\n\t\t<td class=\"m_1\"><input type=\"checkbox\" value=\"approve\"/></td>";
        echo "\n\t\t<td class=\"m_l\"><input type=\"checkbox\" value=\"deny\"/></td>";
        echo "\n\t</tr>";
    }
?>

Могу ли я создать событие onclick, которое делает это с помощью php, или мне нужно использовать javascript? Я облазил весь интернет в поисках примеров чего-то подобного, но ничего полезного не нашел.


javascript php onclick tablerow
person Beaker    schedule 06.10.2012    source источник
comment
вы против использования javascript?   -  person MikeB    schedule 06.10.2012
comment
Я не знаю, почему вы так усложняете простые вещи. Зачем нужен джаваскрипт. Просто перечислите имена вместе со ссылками «одобрить» и «отклонить» и перезагрузите страницу после обновления базы данных.   -  person FirmView    schedule 06.10.2012
comment
Вы также используете флажок - это тоже неправильно. Это должна быть радиокнопка   -  person FirmView    schedule 06.10.2012
comment
@MikeB, зачем тебе здесь javascript?   -  person FirmView    schedule 06.10.2012
comment
Я как бы думал, что сделал Роджер Нг   -  person MikeB    schedule 06.10.2012
comment
@FirmView Я думаю, что OP хочет иметь сжатое представление, которое может расширяться или сжиматься в зависимости от выбранного пользователя, а не постоянно отображать всю информацию.   -  person Tieson T.    schedule 06.10.2012
comment
+1 за эту информацию. В этом случае я бы также отобразил все детали в каждой строке, а в конце будет 2 ссылки «одобрить» и «отклонить». Для администратора было бы утомительной задачей каждый раз нажимать знак + и - знак, чтобы изучить детали.   -  person FirmView    schedule 06.10.2012

Ответы (3)


arrow_upward
2
arrow_downward

Для удобства и кросс-браузерной совместимости я использовал для этого jQuery, но, конечно, вы могли бы сделать это и без него (или даже вообще без javascript, если ваши пользователи не возражают против перезагрузки страницы каждый раз).

Я предположил структуру, в которой у вас будет элемент с классом details, содержащий дополнительную информацию, которую вы хотите сохранить скрытой по умолчанию. Посмотрите мой jsFiddle, чтобы увидеть, как это работает на практике.

$(".details").each(function() {
  var $link = $("<a href='javascript:void(0)'>+</a>");
  var $details = $(this);
  $details.hide().before($link);

  $link.on("click", function() {
    $details.toggle();
    $(".details").not($details).hide();
  });
});​
person Renato Zannon    schedule 06.10.2012

arrow_upward
1
arrow_downward

Вам настоятельно рекомендуется использовать jQuery для достижения этой цели. Добавьте <div id="user_info"></div> в то место, где вы хотите отобразить информацию.

$("#YOUR USER DIV").click(function() {
    $("div#user_info").html("SOME USER INFORMATION WITH HTML");
});
person Roger Ng    schedule 06.10.2012

arrow_upward
0
arrow_downward

Вы, безусловно, можете сделать это, превратив свой интерактивный «+» в ссылку, которая вызывает ваш php-скрипт со строкой запроса, описывающей то, на что вы нажали, и php возвращает страницу с дополнительными сведениями для пользователя, указанного в строке запроса... но вероятно, было бы лучше, если бы пользователь сделал это с помощью javascript.

person Adrien Delessert    schedule 06.10.2012