How to get div values that are dynamically generated by a php script?
Question
I want to alert the name of the item whose place bid button I will click but my code seems to alert only laptop. Can anyone tell me how to get div values that are dynamically generated through a php script. Below is the code for the page.I want to alert name of that item whose place bid I click on. Since the page is dynamically generated which gets item details from a database containing item details.
<?php $con = mysqli_connect("localhost","root","*****","bidding") or die(mysqli_error($con)); $select_query = "select * from items"; $select_query_result = mysqli_query($con, $select_query) or die("Query Mistake"); ?> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Bid</title> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <link rel="stylesheet" href="materialize/css/materialize.css"/> <link rel="stylesheet" type="text/css" href="seperate2.css"> <script src="jquery-3.2.1.min.js"></script> <script src="materialize/js/materialize.min.js"></script> <script type="text/javascript"> function post_data(){ var item_name = document.getElementById("item_name").innerHTML; alert(item_name); } </script> </head> <body> <div class="container"> <h1>Bid</h1> <div class="row"> <?php while($row = mysqli_fetch_array($select_query_result)) { ?> <div class="col s3" > <div id="item_name"><?php echo"$row[item_name]"?></div> <div id="starting_price"><?php echo"$row[starting_price]"?</div> <div><?php echo"$row[description]"?></div> <button class="btn waves-effect waves-teal" onclick="post_data()">Place Bid</button> </div> <?php } ?> </div> </div> </body> </html>
2 answers
solution1
1 2017-11-13 08:00:28
ID of element in HTML must be unique. Use class. In loop you declare static name of ID, that are not unique.
solution2
0 2017-11-16 12:27:39
Your code requires a counter by which the dynamically created DIVs may be accessed. Your <div class="row"> block would be:
<div class="row">
<?php
$divCounter = 0;
while($row = mysqli_fetch_array($select_query_result)) {
$divCounter += 1;
?>
<div class="col s3" >
<div id="item_name<?php echo $divCounter; ?>"><?php echo"$row[item_name]"?></div>
<div id="starting_price"><?php echo"$row[starting_price]"?</div>
<div><?php echo"$row[description]"?></div>
<button class="btn waves-effect waves-teal"
onclick="post_data('<?php echo 'item_name'.$divCounter; ?>')">Place Bid</button>
</div>
<?php } ?>
</div>
Notice that the call to the Javascript function post_data() now provides the DIV id that contains its counter. To complete the job, adjust post_data() to include the parameter:
<script type="text/javascript">
function post_data(divId){
var item_name = document.getElementById(divId).innerHTML;
alert(item_name);
}
</script>
If you prefer, instead of using a counter and concatenating with the static "item_name", you may use the $row[item_name] property instead. Whether or not you can do this will depend on whether this property can serve as a valid HTML id attribute value.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.