post link ID value from php to another php page when clicked
I'm hoping you guys can help me out. So the question is, how to get that link id from page 1 and send it to page 2 when the link is clicked? So I can query based on clicked id to display its own content instead of displaying the whole content for each id. Page 2 is included in page 1. So connection to database is the same. Floors table and Rooms table is in the same database.
Here is my code.
Page 1 (sidebar menu. For example Ground Floor, 1st Floor)
<?php
$result = $conn->query("select * from floors");
while ($row = $result->fetch_assoc())
{
?><li><a href="#floor" data-toggle="tab" id="<?php echo $row['floorid'];?>"><?php echo $row['floorname'];?></a></li><?php
}
?>
Page 2 (sidebar menu content. For example Ground Floor content, 1st Floor content)
<?php
$result = $conn->query("SELECT * FROM rooms WHERE floorid = '".$_GET['id']."'");
while($row = $result->fetch_assoc())
{
......
}
mysqli_close($conn);
?>
You can archive this in many ways but I'm going to show your 2 ways you can get this done.
First will be pure PHP,
1st page:
<?php
$result = $conn->query("select * from floors");
while ($row = $result->fetch_assoc())
{
?><li><a class="links" href="page2.php?id=<?php echo $row['floorid'];?>" data-toggle="tab" id="<?php echo $row['floorid'];?>"><?php echo $row['floorname'];?></a></li><?php
}
?>
Above code will directly send your data to the 2nd page where you want it to get your data from the data base. This will work but it will load your 2nd page on to the browser (if that what you want). But you have tagged 'javaScript' so I'm going to show you another way using jQuery and AJAX.
1st apge PHP:
<?php
$result = $conn->query("select * from floors");
while ($row = $result->fetch_assoc())
{
?><li><a class="links" href="#" id="<?php echo $row['floorid'];?>"><?php echo $row['floorname'];?></a></li><?php
}
?>
<div id="tab content>
<div id="floor" class="tab-pane fade in">
</div>
</div>
You can put this part in the same page as the above code or you can put it in separate JS file and link it to you PHP.
$(document).ready(function() {
$(document).on('click', '.links', function(){
var id = $(this).prop('id');
$.ajax({
url: 'page2.php',
type: 'get',
data: {'id': id}
}).then(function (response) {
if (response) {
$('#floor').html(response);
}
});
});
})
What the above code does is when the document is ready it listens or looks for click event's on the specified class which is '.links'. When the functions see there's a click event on any link under the '.link' class it takes the the click even and reads the 'id' property value.
Then using AJAX it sends the that captured data to your 2nd PHP graps the response from that PHP and populates the div under the id 'floor'.
Plus point is that your processing PHP won't be loaded it will be processed in the server and the main page will not get refreshed the div will be re-written with the in coming response text.
Hope this helps if it doesn't work just let me know.
NOTE: Please read up and switch to using prepared statements. If you're using mysqli then read this. If you're using PDO then read this.