1
私は各IDとデータベースからの対応するIDを区別しようとしています。例:Name_val19
。行var name=document.getElementById("name_val"+id).innerHTML;
はヌル値を戻しています。.getElementById( "name_val" + id).innerHTMLがnullであるのはなぜですか?
<html>
<head>
</head>
<body>
<div id="wrapper">
<table align="center" cellpadding="10" border="1" id="user_table">
<tr>
<th>NAME</th>
<th>AGE</th>
<th></th>
</tr>
<?php
include "connect.php";
$select=mysqli_query($connection,"SELECT * FROM user_detail");
if($select!=NULL){
while ($row=mysqli_fetch_array($select,MYSQLI_BOTH))
{
?>
<tr id="row<?php echo $row['id'];?>">
<td id="name_val<?php echo row['id'];?>"><?php echo $row['name'];?></td>
<td id="age_val<?php echo $row['id'];?>"><?php echo $row['age'];?></td>
<td>
<button class="edit_button" id="edit_button<?php echo $row['id'];?>" onclick="edit_row('<?php echo $row['id'];?>');">Edit</button>
<button class="save_button" id="save_button<?php echo $row['id'];?>" onclick="save_row('<?php echo $row['id'];?>');">Save</button>
<button class="delete_button" id="delete_button<?php echo $row['id'];?>" onclick="delete_row('<?php echo $row['id'];?>');">Delete</button>
</td>
</tr>
<?php
}
}
?>
<tr id="new_row"><form id="insert" onclick="insert_db()">
<td><input type="text" id="new_name"></td>
<td><input type="text" id="new_age"></td>
<td><button type="button" value="Insert Row" onclick="insert_row()">Insert</button></td>
</form></tr>
</table>
</div>
</body>
<script type="text/javascript" src="./js/jquery-3.2.0.js"></script>
<script type="text/javascript" src="./js/modify_records.js"></script>
</html>
'
答えて
は最初、私は
getElementByClass("edit_button") to get <button class="edit_button" id="...">
getElementByIdをを使用してみてください、あなたのIDが複雑であるため、クラスによって要素を取得をお勧めします、いくつかのことのようになります。値は、データベースもPHPコードに格納されています()は、id = ""属性でdom(html)要素をjsスコープに取得しようとしているので、何かを行うことができます。それはgetElementByIdを(「IDofElement」)
getElementById("row") gets <p id="row"> </p>
する必要がありますが、それはあなたが何をありますのでご getElementByIdを(「IDofElement」+「全体AJAX応答」)を行う
var id=response;
はエラーをスロー呼び出していない設定のように見えますidのidを持つdom要素<div id="rowENTIRE-AJAX-RESPONSE"></div>
出典
2017-07-11 19:16:00 Mbreitling95
あなたはこれらのすべてのIDであなた自身を殺しています。 HTML5 data-attributeを使用して、レコードのID を一度にの行に保存してください。
要素(例えば.find()と.closest())とattach event handlersを見つけるために、その能力を最大限にjQueryのを利用します。
document.getElementById
とonclick
の属性は、passéの場合はjQueryとなります。あなたのコードがきれいになります
クイックデモ
出典
2017-07-11 20:06:57 Mikey
関連する問題