Передача id элементов внутри загружаемой с обработчика таблицы

@Артемий_124314 · Регистрация: 25.07.2019

Студворк — интернет-сервис помощи студентам

Всем привет!

Есть JS:
//Здесь по клику передаётся id элемента в обработчик redact.php и данные появляются в скрытом div(который потом отображается как pop up с информацией из обработчика)

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
document.addEventListener("click", function (e) {
    var id = e.target.id;
    console.log(id);
   // передача значения этого id
    var xhr = new XMLHttpRequest();
    xhr.open('POST','redact.php',false);
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    xhr.send(id);
    if (xhr.status != 200) {
              alert( xhr.status + ': ' + xhr.statusText ); 
      } else {
         document.getElementById('redactRow').innerHTML = xhr.responseText;
      }
 
 
});

PHP redact.php:
//Здесь выводятся данные на основании переданного из JS id

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
while($row=mysqli_fetch_assoc($result)){
 
    echo "<tr class='redactTRTH'>";
    echo "<th class='redactTH' >Даты</td>"    ;
    echo "<th class='redactTH'>Наименование</th>"    ;
    echo "<th class='redactTH'>Сумма</th>"    ;
    echo "<th class='redactTH'>Количество</th>"    ;
    echo "<th class='redactTH'>Итого</th>"    ;
    echo "<th class='redactTH'>Статус</th>"    ;
 
 
    echo "</tr>";
 
 
    echo "<tr class='redactTR'>";
    echo "<td class='redactTR' >".$r=$row['date']."</td>"    ;
    echo "<td class='redactTR'>".$d=$row['name']."</td>"    ;
    echo "<td class='redactTR'>".$d=$row['amount']."</td>"    ;
    echo "<td class='redactTR'>".$d=$row['count']."</td>"    ;
    echo "<td class='redactTR'>".$d=$row['total_amount']."</td>"    ;
    echo "<td class='redactTR'>".$d=$row['status']."</td>"    ;
 
 
    echo "</tr>";
    
  
    
    
 
 
}
    echo  "</table>";
    echo "<form method='POST' action='redactRows' onsubmit= 'retur false'>";
    echo "<tr class='redactTR'>";
    echo "<input class='redactTD' type='text' value='".$r=$row['date']."' >" ;
    echo "<input class='redactTD' type='text' value='".$r=$row['date']."' > " ;
    echo "<input class='redactTD' type='text' value='".$r=$row['date']."' > ";
    echo "<input class='redactTD' type='text' value='".$r=$row['date']."'> "  ;
    echo "<input class='redactTD' type='text' value='".$r=$row['date']."' > " ;
    echo "<input class='redactTD' type='text' value='".$r=$row['date']."'> "  ;
    echo "</tr>";
    echo "<input id='perep' type='submit' class='s_copy' value= 'Переписать'>";
    echo "</form>";
 
 
}}

Есть HTML (здесь соответственно :

HTML5
1
2
3
4
    <div id="income" class="income">
     </div>
      <div  id="redactRow" >
     </div>

Есть PHP для дива с id INCOME:

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
while($row=mysqli_fetch_assoc($result)){
 
    echo "<table class='tablephp' id='tablephp' name='tablephp' class='formReportP'>";
    
    
    echo "<tr ' id='". $row["id"] ."' name='row' class='tr'> ";
 
  
    echo "<td class='chek' id='". $row["id"] ."' ><input type='checkbox' class='checkbox' name='".$row["id"] ."' id='check_row'></td>";
 
    echo "<td id='". $row["id"] ."' name='date'  class='td'>".$date=$row['date']."</td>";
    
    echo "<td id='". $row["id"] ."'  name='name' class='td'>".$name=$row['name']."</td>";
  
    echo "<td id='". $row["id"] ."' name='amount' class='td'>".$amount=$row['amount']."</td>";
 
    echo "<td id='". $row["id"] ."' name='count' class='td'>".$count=$row['count']."</td>";
    
    echo "<td id='". $row["id"] ."' name='total_amount' class='td'>".$total_amount=$row['total_amount']."</td>";
 
    echo "<td id='". $row["id"] ."' name='status' class='td'>".$status=$row['status']."</td>";
 
        
 
    
    echo "</tr>";
    
    echo "</table>";

Проблема:
addEventListener работает по все документу, а должен работать только внутри div'a #income, иначе он идёт передача того, чего не надо.
Перерыл документацию нашёл, что обращаться нужно посредством querySelector, но в этом случае, как понял, addEventListener метод не применим.

Как можно ограничить, чтобы событие срабатывало только внутри таблицы из файла income.php внутри div'a #income?

@server_net · 07.08.2019, 13:50