We Keep Coding

Make cell a clickable link in Bootstrap using URL stored as string in database

I have a mysql database table called "names" as per below :
All columns (other than id) are stored as varchar
There is a full .php URL stored in Column "Full Name" for each record but I am getting a stackoverflow code error when using the URL in table below.
id
First Name
Surname
Full Name
Profile
1
John
Smith
John Smith
.PHP URL stored as a text string
2
Jane
Doe
Jane Done
.PHP URL stored as a text string
3
Prakash
Singh
Prakash Singh
.PHP URL stored as a text string
I have some mysql and php that returns the records for the first four columns and puts them into a bootstrap table :
<?php
// Include config file
require_once "conn.php";
// Attempt select query execution
$sql = "SELECT * FROM names";
if($result = mysqli_query($link, $sql)){
if(mysqli_num_rows($result) > 0){
echo '<table class="table table-dark table-hover table-bordered table-striped">';
echo "<thead>";
echo "<tr>";
echo "<th>#</th>";
echo '<th>First Name</th>';
echo "<th>Surname</th>";
echo '<th>Full Name</th>';
echo "</tr>";
echo "</thead>";
echo "<tbody>";
while($row = mysqli_fetch_array($result)){
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td>" . $row['First Name'] . "</td>";
echo "<td>" . $row['Surname'] . "</td>";
echo "<td>" . $row['Full Name'] . "</td>";
echo "</tr>";
}
echo "</tbody>";
echo "</table>";
// Free result set
mysqli_free_result($result);
} else{
echo '<div class="alert alert-danger"><em>No records were found.</em></div>';
}
} else{
echo "Oops! Something went wrong. Please try again later.";
}
// Close connection
mysqli_close($link);
?>
What I would like to do:
Make all cell's in Column "Full Name" to be independently clickable.
Onclick, I would like to take the user to the respective profile URL of the record id without opening a new page.
Attempts:
I added a class to the td for Full Name for an onclick event :
echo "<td class='clickme'>" . $row['First Name'] . "</td>";
This made only the first row of the table clickable.
I added some javascript for the class :
var myMap = document.getElementById("clickme");
myMap.onclick = function() {
var myVar = window.location.replace("https://www.stackoverflow.com");
};
This partially worked, the page refreshes and redirects to the URL provided. However, as each record has it's own URL (stored in the database) I'd like to retrieve the specific URL rather than input an absolute URL here.
Thanks alot in advance for any help rendered!

I never worked with php but in plane html js. you can pass your url through data attibute.
<td class='clickme' data-url="your_cell_url"> First Name </td>
and then in js file
var myMap = document.getElementById("clickme");
myMap.onclick = function() {
var url = this.dataset.url
var myVar = window.location.replace(url);
};
i think it may helps

Try:
echo "<td>" . $row['First Name'] . "</td>";
or if you're using get method for profile page it will look something like this:
echo "<td>" . $row['First Name'] . "</td>";

json_encode for multi line string php to javascript

I am trying to pass a string from php (from mysql) into a variable in javascript which has multiple lines. I understand I need to use php's json_encode() to do this. It's from a textarea and javascript opens a small window and is supposed to write its output. But I can't seem to get past the same error:Uncaught SyntaxError: Unexpected end of input
I'm guessing there's something else I need to do in the javascript
here's the very simple js function:
function view_notes(notes) {
var myWindow = window.open("", "MsgWindow", "width=400,height=400");
console.log(notes);
myWindow.document.write(notes);
}
</script>
And here's the php:
if ($result = $conn->query($sql)) {
// echo "regulars <br>";
/* fetch associative array */
while ($row = $result->fetch_assoc()) {
$phone=$row['phone'];
$formatted_phone=format_phone($phone);
$notes=$row['notes'];
$js_notes=json_encode($notes);
var_dump($js_notes);
echo"<tr>";
echo "<td>";
echo $row['First_Name'];
echo "</td>";
//echo "&nbsp";
echo "<td>";
echo $row['Last_Name'];
echo "</td>";
// echo "&nbsp";
echo "<td>";
echo $formatted_phone;
echo "</td>";
// echo "&nbsp";
echo "<td>";
echo $row['email'];
echo "</td>";
echo "<td>";
echo $row['court_status'];
echo "</td>";
echo "<td>";
echo "<button onclick=\"view_notes($js_notes)\">View Notes</button>";
echo "</td>";
}
/* free result set */
$result->free();
}

You didn't concated the string properly. To solve replace this line
echo "<button onclick=\"view_notes($js_notes)\">View Notes</button>";
with
echo "<button onclick='view_notes(".$js_notes.")'>View Notes</button>";
To solve the line break issue create one more javascript function
function nl2br (str, is_xhtml) {
if (typeof str === 'undefined' || str === null) {
return '';
}
var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';
return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1' + breakTag + '$2');
}
and use above function in your view_notes function like this
function view_notes(notes) {
var myWindow = window.open("", "MsgWindow", "width=400,height=400");
console.log(notes);
myWindow.document.write(nl2br(notes));
}

Can you share result of
console.log(notes);
Because I think the problem is mismatch of quotes here-
echo "View Notes";
When this evaluates it places $js_notes in double quotes which breack HTML syntex rule.
Go to view source of the page in the browser and inspect this line.
Hope this will help.

passing variable from while loop when user press link (php)

i am searching for a way to pass variable ($result[1]) to a session variable from while loop within a link. will be glad for some help
while ($result = mysqli_fetch_array($dataset,MYSQLI_NUM)){
echo "<tr>";
echo " <td >", "<a href='Rate_Supplier.php'>" . $result[1] ."
</a>","</td>" ;
echo " <td >" . $result[0] . "</td>" ;
echo " <td >" . $result[2] . "</td>" ;
echo "</tr>\n";
}

How to make a link remember what value it had as an href before transferring to be used in the next page

With research, I was able to come up with a neat way to display information in my database into a php page.
Now my next aim is to link each row to another php page that will recognize what account ID the user has clicked
echo "<table border='1'>
<tr>
<th>Account ID</th>
<th>Account Username</th>
<th>Account Password</th>
<th>Account First Name</th>
<th>Account Middle Name</th>
<th>Account Last Name</th>
<th>Account Phase</th>
<th>Account Block - Lot</th>
<th>Account Subdivision</th>
<th>Account Contact Number</th>
<th>Account Email Address</th>
<th>Account Status</th>
</tr>";
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['acc_no'] . "</td>";
echo "<td>" . $row['acc_user'] . "</td>";
echo "<td>" . $row['acc_pass'] . "</td>";
echo "<td>" . $row['acc_fname'] . "</td>";
echo "<td>" . $row['acc_mname'] . "</td>";
echo "<td>" . $row['acc_lname'] . "</td>";
echo "<td>" . $row['acc_phase'] . "</td>";
echo "<td>" . $row['acc_blk-lot'] . "</td>";
echo "<td>" . $row['acc_subd'] . "</td>";
echo "<td>" . $row['acc_contact_num'] . "</td>";
echo "<td>" . $row['acc_email_address'] . "</td>";
echo "<td>" . $row['acc_status'] . "</td>";
echo "</tr>";
}
echo "</table>";
I tried this echo "<td><a href='target php page here'>" . $row['acc_no'] . "</td>" but all the links generated will have the same value. I think JQuery might be needed for this or something but unfortunately, this stuff is not yet taught in our school or there might be a better work around for my problem. please help.

I am not sure how to integrate the logic inside a While loop, I mean
as long as the loop is not finished, does this mean the $_GET or
$_POST will loop with it?
while($row = mysql_fetch_array($result))
{
echo "<tr>";
// Step 1.
// Create a custom URL that points to this same script,
// passing the account number as a $_GET parameter.
echo '<td>' . $row['acc_no'] . "</td>";
echo "<td>" . $row['acc_user'] . "</td>";
echo "<td>" . $row['acc_pass'] . "</td>";
echo "<td>" . $row['acc_fname'] . "</td>";
echo "<td>" . $row['acc_mname'] . "</td>";
echo "<td>" . $row['acc_lname'] . "</td>";
echo "<td>" . $row['acc_phase'] . "</td>";
echo "<td>" . $row['acc_blk-lot'] . "</td>";
echo "<td>" . $row['acc_subd'] . "</td>";
echo "<td>" . $row['acc_contact_num'] . "</td>";
echo "<td>" . $row['acc_email_address'] . "</td>";
echo "<td>" . $row['acc_status'] . "</td>";
echo "</tr>";
// Step 2.
// Check if the user has already clicked a one of the URLs we custom made in step 1.
if (isset($_GET['id'] && $_GET['id'] == $row['acc_no']){
// the user has, so let's allow them to change the fields.
// This form appears directly under the record that was clicked.
echo '<form action="commitChangesScript.php" method="post">';
echo '<input type="text" name="fname">';
//repeat for any fields you want to be able the change.
// ...
echo '</form>';
}
}
First create the custom URLs, this can be done without a form by simply creating a link to the location with a query string at the end of it.
On the first page load, isset($_GET['id'] will never be true, because the user presumably hasn't selected an account yet. The first page load create the table as well as all the links for specific users. The URLs are unique because they are created using the account number. For account #1, the URL is pointed at thisScript.php?id=1, for account #987 the URL is thisSciprt.php?id=987.
When the user selects an account number, a new form appears allowing them to change fields. This works because $_GET['id'] will be set to the account number that was selected. We can compare that input with the field in the DB allowing all other rows not to have the form.
This is just an example of what would work. The form included would interrupt the <table> which might look kind of gross.
does this mean the $_GET or $_POST will loop with it?
$_GET and $_POST are defined outside of the while, meaning they will not be repeatedly defined. They are however, within scope inside the while loop as demonstrated in the example I've shown.

Javascript/PHP redirect

Hello fellow programmers!
I'm working on a personal project (mainly to learn php/javascript) and have ran into an issue with redirection when clicking on a link. I have a bit of a strange situation on a tabbed page I've created and I think that may be what is causing my problem.
I'm trying to allow the user to click the (which due to css has made it look different than normal ) to redirect them to a new page with more details. I THINK that the second tag on my page is what is throwing me off because I have a form in it.
I have tried tons of different things like window.location.href="", location.href="", document.location="", etc... But the same thing always occurs. I am able to get both alert messages, so I know I am getting into my JavaScript (even when I put it into it's own .js file).
Anyway advice/help would be very helpful. Also, if anyone has a suggestion on cleaning this code up a bit, that would also be truly helpful.
Below is basically what I have.
Thanks in advance for your help!
<html>
<head>
<title>test site</title>
<link rel="stylesheet" href="test.css" type="text/css" media="screen" />
<script src="test.js" type="text/javascript"></script>
<script type="text/javascript">
function viewDetails(modelId){
alert(modelId);
window.location.href="new url?ModelID=" + modelId;
alert('redirecting would be way awesome...');
}
</script>
</head>
<body onload="load()">
<div id="tabbed_box_1" class="tabbed_box">
<h4>Navigation Tabs<small>Select a tab</small></h4>
<div class="tabbed_area">
<?php
mysql_connect('host','user','password');
mysql_select_db("database");
echo "<ul class='tabs'>";
echo "<li><a href='javascript:tabSwitch(1, 2);' id='tab_1' class='active'>Inventory</a></li>";
echo "<li><a href='javascript:tabSwitch(2, 2);' id='tab_2' >Add Project</a></li>";
echo "</ul>";
echo "<div id='content_1' class='content'>";
echo "<ul>";
$modelsSQL = "SELECT * FROM Model ORDER BY Name";
$modelsResult = mysql_query($modelsSQL);
while ($modelRow = mysql_fetch_array($modelsResult)){
$modelID = $modelRow[0];
$sqlAvailCount = "SELECT * FROM Project WHERE ModelID = " . $modelID . " AND Sold = 0";
$sqlSoldCount = "SELECT * FROM Project WHERE ModelID = " . $modelID . " AND Sold = 1";
$resultAvailCount = mysql_query($sqlAvailCount);
$resultSoldCount = mysql_query($sqlSoldCount);
$rowAvailCount = mysql_num_rows($resultAvailCount);
$rowSoldCount = mysql_num_rows($resultSoldCount);
echo "<li><a href='' onclick='javascript:viewDetails($modelID);'>" . $modelRow[1] . "<small>in stock: <value>"
. $rowAvailCount . "</value> sold: <value>" . $rowSoldCount . "</value></small></a></li>";
}
echo "</ul>";
echo "</div>";
echo "<div id='content_2' class='content'>";
echo "<form action='project_insert.php' method='post' name='projectAddForm'>";
echo "<table cellpadding='5'>";
// Project Model Selection
echo "<tr><td>";
echo "<label for='model'>Model</label>";
echo "</td><td>";
echo "<select name='model' style='width: 250px;'>";
echo "<option value='-1' selected>SELECT</option>";
$modelListSQL = "SELECT * FROM Model ORDER BY Name";
$modelListResult = mysql_query($modelListSQL);
while ($modelListRow = mysql_fetch_array($modelListResult)){
echo "<option value='" . $modelListRow['ID'] . "'>" . $modelListRow['Name'] . "</option>";
}
echo "</select>";
echo "</td></tr>";
// Project Material Selection
echo "<tr><td>";
echo "<label for='material'>material</label>";
echo "</td><td>";
echo "<select name='material' style='width: 250px;'>";
echo "<option value='-1' selected>SELECT</option>";
$materialListSQL = "SELECT * FROM Material ORDER BY Name";
$materialListResult = mysql_query($materialListSQL);
while ($materialListRow = mysql_fetch_array($materialListResult)){
echo "<option value='" . $materialListRow['ID'] . "'>" . $materialListRow['Name'] . "</option>";
}
echo "</select>";
echo "</td></tr>";
// Project Finish Selection
echo "<tr><td>";
echo "<label for='finish'>finish</label>";
echo "</td><td>";
echo "<select name='finish' style='width: 250px;'>";
echo "<option value='-1' selected>SELECT</option>";
$finishListSQL = "SELECT * FROM Finish ORDER BY Name";
$finishListResult = mysql_query($finishListSQL);
while ($finishListRow = mysql_fetch_array($finishListResult))
{
echo "<option value='" . $finishListRow['ID'] . "'>" . $finishListRow['Name'] . "</option>";
}
echo "</select>";
echo "</td></tr>";
// Project Craftsman Selection
echo "<tr><td>";
echo "<label for='craftsman'>craftsman</label>";
echo "</td><td>";
echo "<select name='craftsman' style='width: 250px;'>";
echo "<option value='-1' selected>SELECT</option>";
$craftsmanListSQL = "SELECT * FROM Craftsman ORDER BY FirstName";
$craftsmanListResult = mysql_query($craftsmanListSQL);
while ($craftsmanListRow = mysql_fetch_array($craftsmanListResult)){
echo "<option value='" . $craftsmanListRow['ID'] . "'>" . $craftsmanListRow['FirstName'] . " " . $craftsmanListRow['LastName'] . "</option>";
}
echo "</select>";
echo "</td></tr>";
//Project Description
echo "<tr><td>";
echo "<label for='description'>Description</label>";
echo "</td><td>";
echo "<input type='text' name='description' id='textArea' style='width:250px'>";
echo "</td></tr>";
// Project Selling Price
echo "<tr><td>";
echo "<label for='price'>Price</label>";
echo "</td><td>";
echo "<input id='price' name='price' type='number' style='width:150px'>";
echo "</td></tr>";
// Project Completion Date
echo "<tr><td>";
echo "<label for='date'>Finish Date</label>";
echo "</td><td>";
$dateArray = getdate();
$month = $dateArray[mon];
$day = $dateArray[mday];
if ($month < 10){
$month = '0' . $dateArray[mon];
}
if ($day < 10){
$day = '0' . $dateArray[mday];
}
$todaysDate = $dateArray[year] . '-' . $month . '-' . $day;
echo "<input type='date' name='date' value='" . $todaysDate . "' style='width:150px'>";
echo "</td></tr>";
// Buttons
echo "<tr><td align='center'>";
echo "<input type='button' name='Save' value='Save' onclick='javascript:validateAndSubmit(this.form);' style='width:100px'>";
echo "</td><td align='center'>";
echo "<input type='button' name='Cancel' value='Cancel' onclick='javascript:cancelEntry();' style='width:100px'>";
echo "</td></tr>";
echo "</table>";
echo "</form>";
echo "</div>";
?>
</div>
</div>
</body>

window.location.href may not trigger reload in some browsers and cases..
You should add a reload after
like this:
window.location.href = '/foo/bar/';
window.locaton.reload(true)
But, some browsers delay milliseconds to perform location.href set. In this cases the window.location.reload(true) may complete before this.
Therefore, add a timeout in reload:
window.location.href = '/foo/bar/';
setTimeout('window.locaton.reload(true)', 500);
works in all browsers for me

Good morning! I found the cause of my problem this morning and have been able to resolve the issue. The problem I was causing is because I am using the tag (stylized by css) to display the information, with an onclick event to call my JS code to redirect. Within the tag I had the href='', thinking that the JS would override that functionality, it doesn't!
Removing the href='' from the tag resolved the issue and allowed me to redirect to the new page. A second solution is to use my php code to dynamically create the href link within the tag.
echo "<li><a onclick='viewDetails($modelID);'>" . $modelRow[1] . "<small>in stock: <value>" . $rowAvailCount . "</value> sold: <value>" . $rowSoldCount . "</value></small></a></li>";
OR
echo "<li><a href='inventorydetails.php?ModelID=" . $modelID . "'>" . $modelRow[1] . "<small>in stock: <value>" . $rowAvailCount . "</value> sold: <value>" . $rowSoldCount . "</value></small></a></li>";
I think I will go with the second example for two reasons. First, it provides the link icon when hovering (which I know I can add through css, but this is easier. Second, less JS code.
I thank you for all your help in resolving this!