Develop Reference

Retrieve whole string from a javascript value variable

I am trying to save a large string as a value in an javascript variable, the problem is that can only save the first word of the string in the javascript variable, my source code is the following :
The JS function is called when a button is clicked by the user, then the value of the button("The value of the variable is the large string") is stored in the javascript variable, and then is been displayed in an html form. The source code of the html form is the following:
var input; //prepare var to save large string
$(function() {
// contact form animations
$('button[id="contactbutton"]').click(function() {
input = $(this).val(); //set var input to value of the pressed button
document.getElementById("someInput").value = input;
console.log('input : ' + input);
$('#contactForm').fadeToggle();
})
$(document).mouseup(function (e) {
var container = $("#contactForm");
if (!container.is(e.target) // if the target of the click isn't the container...
&& container.has(e.target).length === 0) // ... nor a descendant of the container
{
container.fadeOut();
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="contactForm" >
<p><h4><i>First Choose the clients and then the file which will be uploaded in order to proced</i></h4></2>
<hr>
<input type="text" id="someInput" name="someInput" readonly></input>
<hr>
</div>
The buttons are displayed in an html table, the table drags the data using mysql queries and display them in the website. Then an addition column is created consisting only of buttons, each button is given a different value, the source code of the table is the following:
$con = mysql_connect("localhost","root",'');
if(!$con){
die("Cannot Connect" . mysql_error());
}
mysql_select_db("client_app",$con);
$get_notifications= "SELECT * FROM `notifications history` ";
$notifications = mysql_query($get_notifications,$con);
echo "<table class=table table-condensed>
<thead>
<tr>
<th>Recipient</th>
<th>Title</th>
<th>Message</th>
<th>Time Sended</th>
</tr>
</thead>";
while($record = mysql_fetch_array($notifications)){
echo "<action=usersfiles.php method=post>";
echo "<tr>";
echo "<td>".$record['recipient']." </td>";
echo "<td>".$record['title']." </td>";
echo "<td>"."<button value=".$record['content']." id=contactbutton>Content</button>"." </td>";
echo "<td>".$record['received']." </td>";
echo "</tr>";
echo "</form>";
}
echo "</table>";
mysql_close();
Can anyone please help me?

Click a <td> element to cause a self posting event with an SQL query involving multiple tables. PHP

What I have is a table that is pulled from a database. The goal is that I want to be able to click on any team and have a self posted page produce a table with previous yearly results per row (multiple tables, year by year) and a row of total stats. For example: Click on San Jose and get 2014-2015 stats in 1 row, 2015-2016 in the next row and then a total of all the seasons added up. Not really sure how to implement it. I would love to get some suggestions on the best way to attack this problem.
Link To My Project
Here is some of my code, so you can see how I am doing it so far.
$query = "SELECT * FROM standings2015_2016 WHERE confid='2' ORDER BY pts DESC, losses ASC, otl ASC, gf-ga DESC";
$result = $db->query($query);
echo "<h3>Western Conference</h3>";
echo "<table class='table sortable'>";
echo "<tr class='TableHeaders'>";
echo "<td class='hover'>Place</td>";
echo "<td class='hover'>Team</td>";
echo "<td class='hover'>Wins</td>";
echo "<td class='hover'>Losses</td>";
echo "<td class='hover'>OTL</td>";
echo "<td class='hover'>Points</td>";
echo "<td class='hover'>GF</td>";
echo "<td class='hover'>GA</td>";
echo "<td class='hover'>+ / -</td>";
echo "</tr>";
$i = 0;
foreach ($result as $row) {
$i++;
$plusMinus = ($row['gf'] - $row['ga']);
echo "<tr>";
echo "<td>";
echo $i;
echo "</td><td class='hover2'>";
echo stripslashes($row['name']);
echo "</td><td>";
echo stripslashes($row['wins']);
echo "</td><td>";
echo stripslashes($row['losses']);
echo "</td><td>";
echo stripslashes($row['otl']);
echo "</td><td>";
echo stripslashes($row['pts']);
echo "</td><td>";
echo stripslashes($row['gf']);
echo "</td><td>";
echo stripslashes($row['ga']);
echo "</td><td>";
echo $plusMinus;
echo "</td>";
echo "</tr>";
}
echo "</table>";
So echo stripslashes($row['name']); is the team name I want to click on. Can this be done with an onclick event to prompt a query and a self post?

In order to do what you want, we can use jQuery and Ajax.
First is to download jQuery here.
Then create a link element for each team name that has class and data-artid tag:
echo ''.stripslashes($row['name']).'';
Then create the script:
<script src="jquery-1.9.1.min.js"></script> <!-- REPLACE NECESSARY JQUERY FILE DEPENDING ON THE VERSION YOU HAVE DOWNLOADED -->
<script type="text/javascript">
$(document).ready(function(){ /* PREPARE THE SCRIPT */
$(".teamname").click(function(){ /* WHEN A TEAM IS CLICKED */
var elem = $(this); /* STORE THE CLICKED TEAM */
var teamid = elem.attr("data-artid"); /* GET THE ID OF THE CLICKED TEAM NAME */
$.ajax({ /* PREPARE THE AJAX */
type: "POST", /* METHOD TO BE USED TO PROCESS THE PASSED DATA */
url: "action.php", /* THE PAGE WHERE THE DATA WILL BE PROCESSED */
data: {"teamid": teamid}, /* THE DATA WE WILL PASS */
success: function(result){
$("#content").html(result); /* WE WILL SHOW THE RETURNED DATA TO YOUR CONTENT DIV */
} /* END OF SUCCESS */
}); /* END OF AJAX */
});
});
</script>
And for your action.php, which will process the passed on data using Ajax:
<?php
/* INCLUDE YOUR DB CONNECTION HERE */
if(!empty($_POST["teamid"])){
$tr = '
<table class="table sortable">
<tr class="TableHeaders">
<td class="hover">Team</td>
<td class="hover">Wins</td>
<td class="hover">Losses</td>
<td class="hover">OTL</td>
<td class="hover">Points</td>
<td class="hover">GF</td>
<td class="hover">GA</td>
</tr>
';
$result = $db->query("SELECT name, wins, losses, otl, pts, gf, ga FROM standings2014_2015 WHERE teamid = '".$_POST["teamid"]."'");
foreach ($result as $row) {
$tr .= '
<tr>
<td>'.$row["name"].'</td>
<td>'.$row["wins"].'</td>
<td>'.$row["losses"].'</td>
<td>'.$row["otl"].'</td>
<td>'.$row["pts"].'</td>
<td>'.$row["gf"].'</td>
<td>'.$row["ga"].'</td>
</tr>
';
} /* END OF LOOP */
$tr .= '</table>';
echo $tr; /* RETURN THIS TO AJAX */
} /* END OF NOT EMPTY teamid */
?>

You can assign an ID to each one of the teams in your database and then use that ID to pull the information in one php file. In that file you can just get the ID perform the query search and display the information in a different page.
In the index.php where you display all the teams you can add a link to the team.php.
echo "<a href=\"team.php?Id=".$team['Id']."\">";
team.php
if (isset($_GET['Id']) && is_numeric($_GET['Id']))
{
// Perform database query
$teamID = mysql_escape_string($_GET['Id']);
// Assign the query to a variable
$query = "SELECT name, wins, losses, otl, pts, gf, ga FROM standings2014_2015 WHERE Id=".$teamID.";";
$result = $conn->query($query);
// If the user exists
if ($result)
{
while ($team = $result->fetch_assoc())
{
echo $team["name"];
echo $team["wins"];
....
// Display the information in the table
}
}

I suggest this code:
For standings.php modify this:
echo stripslashes($row['name']);
by:
echo "<a href=\"standings.php?name=".stripslashes($row['name'])."\">";
Then standings.php should view like this:
if (isset($_GET['name']) && !is_empty($_GET['name']))
{
$kname = mysql_escape_string($_GET['name']);
$query = "SELECT name, wins, losses, otl, pts, gf, ga FROM standings2014_2015 WHERE name=".$kname.";";
$result = $db->query($query);
if ($result)
{ echo "<table class='table sortable'>";
foreach ($result as $row)
{
$tr .= '
<tr>
<td>'.$name.'</td>
<td>'.$wins.'</td>
<td>'.$losses.'</td>
<td>'.$otl.'</td>
<td>'.$pts.'</td>
<td>'.$gf.'</td>
<td>'.$ga.'</td>
</tr>
';
echo $tr;
}
echo "</table>";
}
}else{
//YOUR ACTUAL CODE
}

Hidden table row not displaying correct information

I've having some issue with the Javascript. I have a table that shows the basic information of the customer when an employee conduct a search base on the customer name. When the employee clicks on "View Sales History" the hidden table row of the particular customer's sales history will appear.
I've have no problem displaying the sales history of all the customer's returned from the search when I change the css display to "table-row". However it would only display the first customer's sales history whenever I hide the table row and include the javascript to display the hidden row.
This is what I've tried doing so far, hopefully someone can help me out here.
while($row = mysql_fetch_assoc($result)) {
$id = $row["id"];
$cfname = $row["f_name"];
$clname = $row["l_name"];
$cemail = $row["email"];
$ccompany = $row["company_name"];
$year = $row["year"];
$product = $row["product"];
$employee = $row["employee"];
$status = $row["status"];
echo '<tr>
<td>'.$cfname.' '.$clname.'</td>
<td>'.$cemail.'</td>
<td>'.$ccompany.'</td>
<td> <h4 id="vsalesHistory" onclick="vsalesHistory()">View Sales History</h4></td>
</tr>';
echo '<thead id="salesHistoryHead">
<tr>
<th>Date of Sales</th>
<th>Type of Product</th>
<th>Previous Sales Manager</th>
<th>Job Status</th>
</tr>
</thead>';
echo '<tr id="salesHistory">
<td>'.$year.'</td>
<td>'.$product.'</td>
<td>'.$employee.'</td>
<td>'.$status.'</td>
</tr>';
}
echo '</table>';
and this is my JS script
function vsalesHistory(){
var e = document.getElementById('salesHistoryHead');
var f = document.getElementById('salesHistory');
if(e.style.display == 'table-row'){
e.style.display = 'none';
}else{
e.style.display = 'table-row';
}
if(f.style.display == 'table-row'){
f.style.display = 'none';
}else{
f.style.display = 'table-row';
}
}

You are creating multiple rows with the same ID, which is not a good idea. Instead, use the row ID to create unique iDs, like:
echo '<thead id="salesHistoryHead' . $id . '">
<tr>
<th>Date of Sales</th>
<th>Type of Product</th>
<th>Previous Sales Manager</th>
<th>Job Status</th>
</tr>
</thead>';
echo '<tr id="salesHistory' . $id . '">
<td>'.$year.'</td>
<td>'.$product.'</td>
<td>'.$employee.'</td>
<td>'.$status.'</td>
</tr>';
Then pass the ID with the button action, e.g.
<td> <h4 id="vsalesHistory" onclick="vsalesHistory(' . $id . ')">View Sales History</h4></td>
If $id is a string, you would need to quote it in the call to vsalesHistory.
Now you can use the ID in your Javascript to pick the single right set of information.
For example:
function vsalesHistory(id){
var e = document.getElementById('salesHistoryHead'+id);
var f = document.getElementById('salesHistory'+id);
...

Add items to shopping cart

I am new to php so please bear my lack of knowledge.
I am developing a simple shopping cart. I have the screen divided in three framset. The left one is a imagemap where the user can click the desired item. The topRight is a php page that retrieve and displays in a table the details of the item clicked in theleftFrame. The last cell of this table has a textfield and a button to submit the order.
The goal of bottomRight frame is to display the shopping cart, showing the user how many products are already chosen.
My problem is that so far I can display only the current order submitted. In other words I display only the details of the last item "ordered" from the topRigt frame.
How can I keep on adding a second item, instead of replacing it?
Here is the code for topLeft
<html>
<head>
<title>Top Right</title>
<style type="text/css">
<!--
#import url("style.css");
-->
</style>
</head>
<body bgcolor = "#E0E6F8">
<h2>ITEMS</h2>
<?php
session_start();
// get the id from the left frame
$id = $_GET['var'];
// variable to connect to db
$user_name = "name";
$password = "password";
$server = "server";
$link = new mysqli($server,$user_name,$password,'poti');
if(!$link)
die("Could not connect to databse");
$result = $link->query("SELECT * FROM products WHERE product_id = '$id';");
while($row = $result->fetch_array())
{
$id = $row['product_id'];
$name = $row['product_name'];
$unit_price = $row['unit_price'];
$unit_quantity = $row['unit_quantity'];
$in_stock = $row['in_stock'];
$arrayName = array('id' => $id, 'name' => $name);
// store values in session
$_SESSION['cart'] = $arrayName;
// display details in a table (code needs to be refactored)
if(!empty($row)){
print "";
print "<form method='post' name='add' id='add' action='' target=''>";
print "<table id='hor-minimalist-a' border = '0' width = '100%'>";
print "<thead>
<tr>
<th scope='col'>ID</th>
<th scope='col'>Name</th>
<th scope='col'>Price</th>
<th scope='col'>QTY</th>
<th scope='col'>In Stock</th>
<th scope='col'>Order</th>
</tr>
</thead>";
print "<tr>\n";
print "<td>";
print($id);
print "</td>";
print "<td>";
print($name);
print "</td>";
print "<td>";
print($unit_price);
print "</td>";
print "<td>";
print($unit_quantity);
print "</td>";
print "<td>";
print($in_stock);
print "</td>";
print "<td>
<input type='text' name='qty_ordered' size='4'><input type='submit' name='submit' value='Submit' onclick='checkQty()'>
</td>";
print "</tr>";
}
print"</table>";
print "</form>";
}
?>
<script type="text/javascript">
function checkQty()
{
if(document.add.qty_ordered.value > 0 && document.add.qty_ordered.value <= 20)
{
document.add.action = "bottomRight.php";
document.add.target = "BottomRight";
document.add.submit();
}
else
{
//document.add.action = "topRight.php";
//document.add.target = "TopRight";
alert("Quantity must be between 1 and 20, please enter a value between 1 to 20");
//document.add.submit();
}
}
</script>
</body>
</html>
and for bottomRight:
<html>
<head>
<title>Bottom Right</title>
<style type="text/css">
<!--
#import url("style.css");
-->
</style>
</head>
<body>
<h2>Shopping Cart</h2>
<?php
session_start();
// doing this I keep on displaying only the last item "ordered"
if (isset($_POST['submit'])===true) {
if(isset($_SESSION['cart'])===true) {
$array = array($_SESSION['cart']);
print_r($array);
// not working
/*foreach($array as $a)
{
echo "<table><tr>";
echo "<td width='150px'><span style='color:white'>" . $a['id'] ."</span></td>";
echo "</tr></table>";}*/
}
}
?>
</body>
</html>

Check out the video tutorial given by Adam Khoury on youtube. He has used mysql_* (I know its deprecated) functions but you can use your own code and get your problem solved out. The video is just for your reference.
Here's the youtube playlist link: https://www.youtube.com/playlist?list=PL442E340A42191003
Here's the specific video link to solve your query: https://www.youtube.com/watch?v=WXqbQy9fOp8
Hope this helps you.

Display data in tabular manner in PHP form

I want to do something like this..
I have a update form in PHP, which contains around 15 fields,
I want to show some data in tabular manner while you open the page for update..
Senario:
If you want to update a record of a person on day to day basis, I have the feature with me to search out that person form database, and when you click on update data..
it should show in a manner that,
field1.....----------
field2.....----------
field3.....----------
and now,
for field4,5,6,7
if these fields contain the data then show in a table manner with fields 4,5,6,7 as coloums and no of rows depending upon the number of entries (should be non editable)(assume the case of multiple input)
then form will continue.
field4.....--------
field5.....--------
field6.....--------
field7.....--------
typically these field(4,5,6,7) gets their value update frequently and I have to maintain the previous inputs also.
help me out with some solution, as I am unable to figure out how to do this?
before that i was using this.. here i was having a form field which can generate 5 options, and will populate the fields with data if u have entered before, now i want to change the display as I don't want user to play with the old data, so I want to show old data into a table and enter new data via a simple text field,
as their is no point to keep these multiple input form field as user is updating only one value at a time.
<script>
function Submitted_Date(value,object)
{
value = document.getElementById("subdate_num").value;
if (value > -1) {
var input= new Array(value);
var p;
//alert("Enter The fields You Know ");
var ele = document.getElementById("subdate");
if(ele.hasChildNodes())
{
var len = ele.childNodes.length;
while(ele.childNodes.length - value > 1)
{
ele.removeChild(ele.lastChild);
}
}
for (var i=len-1;i<value;i++)
{
p= i+1;
input[i] = document.createElement('div');
input[i].innerHTML = 'Submitted_Date' + p + ': <input type="text" value="" name="subdate' + p + '" id="subdate' + p +'" size = 25 onclick="javascript: showCalendar("Submitted_Date'+ p +'")"/>';
document.getElementById("subdate").appendChild(input[i]);
var subdate = 'subdate' + p;
}
}
document.getElementById("subdate1").focus();
}
</script>
<tr>
<td> Submitted Date :
<select name="subdate_num" id="subdate_num" onChange="return Submitted_Date(this.value,this.form)">
<?php
for ($i=0;$i<=5;$i++)
{
if ($i==0) { $temp = "<option value=$i> - </option>"; echo $temp; }
else { $temp = "<option value=$i>$i</option>";
echo $temp; }
}
?>
</select></td>
</tr>
</table>
<table>

I think this is what you want, this will show the information in a table with as many (or few) columns as you want
$query = "SELECT * FROM announcements ORDER BY announceid";
$result = mysql_query($query);
echo "<table border='1'>
<tr>
<th>Announcement ID</th>
<th>Announcement Name</th>
<th>Announcement Category</th>
<th>Approved?</th>
<th></th>
</tr>";
if ($result && mysql_num_rows($result) > 0) {
$x = 0;
while ($row = mysql_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['announceid'] . "</td>";
echo "<td>" . $row['title'] . "</td>";
echo "<td>" . $row['category_name'] . "</td>";
echo "<td>" . $row['status'] . "</td>";
echo '<td>Edit</td>';
echo "</tr>";
$x ++;
};
echo "</table>";
Let me know if that is what you are looking for, or if there is any other way I can help. Thanks!