Pass button value as variable of an upload file - javascript

I am quite new to javascript and i need some guidance. I have a table that displays some data, the source code of the table is this.
function user_clients_table_storagefolder() {
$con = mysql_connect("localhost","root",'');
if(!$con){
die("Cannot Connect" . mysql_error());
}
mysql_select_db("client_app",$con);
$get_user_clients = "SELECT `ID`,`Name`,`SurName`,`storagefolder` FROM `clients` ";
$clients = mysql_query($get_user_clients,$con);
echo "<table class=table table-condensed>
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>SurName</th>
<th>Recipient</th>
</tr>
</thead>";
while($record = mysql_fetch_array($clients)){
echo "<action=pushnotification.php method=post>";
echo "<tr>";
echo "<td>".$record['ID']." </td>";
echo "<td>".$record['Name']." </td>";
echo "<td>".$record['SurName']." </td>";
echo "<td>"."<button type=button id=contact class=btn btn-primary value=".$record['Name'].">Primary</button></td>";
echo "</tr>";
}
echo "</table>";
mysql_close();
//function that is used to display the table of all the clients and fetch back the storagefolder of each user
}
Every table row has a button in the last column that has a different value. When i click any of the buttons a pop up form is displayed asking to upload a file. The source code of the form is the following:
<div id="contactForm">
<p><h4><font color="white"><i>First Choose the clients and then the file which will be uploaded in order to proced</i></font></h4></2>
<p> </p>
<input type="file" class="upload" name="onstorage" id="upload_file" size="50" name="icon" onchange="loadFile(this);" >
<hr>
<div id="myProgress">
<div id="myBar"></div>
</div>
</div>
The code that launches the pop up is the following:
<script>
$(function() {
// contact form animations
$('#contact').click(function() {
$('#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>
Each time i choose a different file to upload the function loadfile() is called that is sending the input value that i have upload.My question is, how can i also pass the value of the button that has been pressed in the same function?
Can someone please help me?
Thanks in Regards

Related

How to save files selected by a list of checkboxes

I have a list of 3 files with its associated checkboxes. The user select 2 checkboxes and click on save button. A save to folder dialog opens for the user to save the files.
This is my code:
if(!empty($listeDocTypeClientProjet))
{
$iGroups = 0;
while($iGroups < count($listeDocTypeClientProjet))
{
?>
<tr>
<td style='text-align: left;'>
<input type="checkbox" name="docTypeSelect[]" class="files" id="docTypeSelect_<?php echo $listeDocTypeClientProjet[$iGroups]->DOC_TYPE_ID ?>" value="<?php echo $listeDocTypeClientProjet[$iGroups]->DOC_TYPE_ID ?>"> <?php echo $listeDocTypeClientProjet[$iGroups]->DOC_TYPE_NOM ?>
</td>
</tr>
<?php
$iGroups++;
}
}
I dont know how to proceed with the save button. Can anyone pls point me in the right direction.
Here is what ive done so far:
function SaveDocType(client_projet_id, client_id)
{
var fileIds = $('.files:checked').each(function() {
window.open('test3.php?file=' + $(this).next('label').text());
});
}

PHP and Javascript issue. Function return always the last value

I searched this website and couldn't find an answer.
I have a php page that display a dropdown list with 2 choices. When on change, a Javascript execute a function that opens a php page to update my database, sending the ID and another parameter with the URL. The problem is the ID value is always the same (the last of the list). Can you help me please, I am very new in PHP and Javascript. Thank you in advance. Here is the PHP code and the javascript:
<?php
$AvailabilityCondition = "1=1";
if ((isset($_POST["availabilityChoice"])) && ($_POST["availabilityChoice"] !== "All")){
$AvailabilityCondition = "rented = "."'".$_POST["availabilityChoice"]."'";
}
$rentalquery = "SELECT * FROM rentals WHERE $AvailabilityCondition ORDER BY region_name, rental_name";
if ($rentalresult = $link->query($rentalquery)) {
/* fetch associative array */
while ($rowrentals = $rentalresult->fetch_assoc()) {
$NumberOfResults = $rentalresult->num_rows;
?>
<!-- ************************* This display a table with a short rental description (Region name - Rental name)
****************************** with and EDIT link, a DELETE link and an AVAILABILITY selector. ******************* -->
<div align="center">
<table >
<tr >
<td width="300" >
<?php echo ($rowrentals["region_name"]).' - '.($rowrentals["rental_name"]).'<br/>'; ?>
</td>
<td width="50">
EDIT
</td>
<td width="100" align="right">
<!-- *********** This form display the actual availability state. On change, it updates the database **************** -->
<form name="updateAvailability" method=POST" class="form-horizontal" >
<select onChange="showSelected(this.value)" id ="availabilityChoice" name="availabilityChoice" style="width: auto">
<option value="No" <?php if (($rowrentals["rented"]) == "No") echo 'selected="selected"' ?>>Available</option>
<option value="Yes" <?php if (($rowrentals["rented"]) == "Yes") echo 'selected="selected"' ?>>Rented</option>
</select> <?php echo ($rowrentals["id"]) ?>
</form>
<script type="text/javascript">
function showSelected(val){
document.getElementById ('availabilityChoice').innerHTML = val;
window.location.replace("status-update.php?rented=" + val + "&id=<?php echo ($rowrentals["id"]) ?>");
}
</script>
<!-- **************************************************************************************************************** -->
</td>
<td>
!!! DELETE !!!
</td>
</tr>
</table>
</div>
<?php
}}
/* free result set */
$rentalresult->free();
/* close connection */
$link->close();
?>
<br/><br/>
<div align="center">
<b>Back to Managers Main Menu</b>
</div>
</body> ​
I just posted more of my PHP page. So you can see the query and the WHILE, where $rowrentals["id"] is coming from.
Here is also a screen capture of how the page looks like: screen capture
I echoed the $rowrentals["id"] under each availability dropdown.
But whatever row I chose to change the availability, it always pass Id=9, the last one. That is what confuses me.
Before the screen capture, all five rows where "Available". Then I selected "Rented" on the first row. The page updated and since Id always =9, you can see the last row "Rented".
The Javascript is working to retrieve the value of the selected item. Because it opens this page perfectly: status-update.php?rented=Yes&Id=9
But again, Id is always 9...
Try with this:
<script type="text/javascript">
function showSelected(val){
document.getElementById ('availabilityChoice').innerHTML = val;
window.location.replace("status-update.php?rented=" + val + "&id=<?php echo ($rowrentals['id']) ?>");
}
If showSelected javascript function inside a foreach/while loop you need to extract it from loop and send id+value at the same time to showSelected function.
Thank you everybody. I found my answer. I added a counter, so this create a different function name for each database Id.
Here is the code:
$rentalquery = "SELECT * FROM rentals WHERE $AvailabilityCondition ORDER BY region_name, rental_name";
$counter =0;
if ($rentalresult = $link->query($rentalquery)) {
/* fetch associative array */
while ($rowrentals = $rentalresult->fetch_assoc()) {
$NumberOfResults = $rentalresult->num_rows;
$counter = $counter+1;
?>
<!-- ************************* This display a table with a short rental description (Region name - Rental name)
****************************** with and EDIT link, a DELETE link and an AVAILABILITY selector. ******************* -->
<div align="center">
<table >
<tr >
<td width="300" >
<?php echo ($rowrentals["region_name"]).' - '.($rowrentals["rental_name"]).'<br/>'; ?>
</td>
<td width="50">
EDIT
</td>
<td width="100" align="right">
<!-- *********** This form display the actual availability state. On change, it updates the database **************** -->
<form name="updateAvailability<?php echo $counter ?>" method=POST" class="form-horizontal" >
<select onChange="showSelected<?php echo $counter ;?>(this.value)" id ="availabilityChoice<?php echo $counter ?>" name="availabilityChoice<?php echo $counter ?>" style="width: auto">
<option value="No" <?php if (($rowrentals["rented"]) == "No") echo 'selected="selected"' ?>>Available</option>
<option value="Yes" <?php if (($rowrentals["rented"]) == "Yes") echo 'selected="selected"' ?>>Rented</option>
</select>
</form>
<script type="text/javascript">
function showSelected<?php echo $counter ;?>(val){
document.getElementById ('availabilityChoice<?php echo $counter ;?>').innerHTML = val;
window.location.replace("status-update.php?rented=" + val + "&id=<?php echo ($rowrentals["id"]) ?>");
}
</script> ​

HTML Table getting data from mysql database using php. I can't seem to be figuring out how to print that data using my js code to put it into a form

(my final 2 images don't have a hyperlink cause i can only post a max of 2, i have added 2 spaces that you can take out to look at my screenshots)
I am working on a website for a company, I am almost finished but I am stuck on the last tiny bit which I have researched hard. I have made a html table that gets information from a mysql database as seen below.
HTML Table fetching data from mysql database
I have made a js code that once i click on a row in the table it prints the data into the print page as seen below.
This is the print page with some notes to clarify my picture
Here is my javascript code for the print function .
<script>
function printContent(el){
var restorepage = document.body.innerHTML;
var printcontent = document.getElementById(el).innerHTML;
document.body.innerHTML = printcontent;
printcontent {transform: scale(1.5);}
window.print();
document.body.innerHTML = restorepage;
}
</script>
This is the button corrosponding with my print function:
<div>
<button class="submit" name="submit" id="submit" onclick="printContent('div1')">Print</button>
</div>
This is my javascript code that takes the Table data and puts it into my print page
<div id="printoverzicht">
<?php
$sql = "SELECT * FROM palletlabel WHERE $kwekersnummer = kwekersnummer";
$query = mysqli_query($conn, $sql);
if (!$query) {
die ('SQL Error: ' . mysqli_error($conn));
}
mysqli_close($conn);
?>
<br><br><br><h1>Eerdere Print Opdrachten</h1>
<table class="data-table" id="table">
<caption class="title">Klik op de gewenste printopdracht om te printen</caption>
<thead>
<tr>
<th>palletnummer</th>
<th>kwekersnummer</th>
<th>plukdatum</th>
<th>aanleverdatum</th>
<th>aantal</th>
<th>excelartikel</th>
</tr>
</thead>
<tbody>
<?php
while ($row = mysqli_fetch_array($query))
{
echo '<tr>
<td>'.$row['palletnummer'].'</td>
<td>'.$row['kwekersnummer'].'</td>
<td>'.$row['plukdatum'].'</td>
<td>'.$row['aanleverdatum'].'</td>
<td>'.$row['aantal'].'</td>
<td>'.$row['excelartikel'].'</td>
</tr>';
}
?>
</tbody>
</table>
<script>
var table = document.getElementById('table');
for(var i = 1; i < table.rows.length; i++)
{
table.rows[i].onclick = function()
{
//rIndex = this.rowIndex;
document.getElementById("palletnummer1").value =
this.cells[0].innerHTML;
document.getElementById("plukdatum1").value =
this.cells[2].innerHTML;
document.getElementById("aanleverdatum1").value =
this.cells[3].innerHTML;
document.getElementById("aantal1").value =
this.cells[4].innerHTML;
document.getElementById("artikel1").value =
this.cells[5].innerHTML;
};
}
</script>
</div>
This is the print page - form , where the information needs to get put in. This is labeled as div1 so that its being called by the button.
<div id="div1" class="Palletlabel">
<hr color="#BDBDBD" width="600">
<div id="inner"><b>Kweker</b></div>
<hr color="#BDBDBD" width="600">
<div class = "palletkweker">
<div class = "palletkwekerlinks">
<br><b>Bedrijfsnaam: </b><br><?php echo $bedrijfsnaam;?>
<br><b>Straat+nr: </b><br><?php echo $straat;?> <?php echo
$huisnummer;?>
<br><b>Plaats: </b><br><?php echo $plaats;?>
<br><b>Postcode: </b><br><?php echo $postcode;?>
<br><b>Aanmaakdatum - (backup print): </b><?php echo
date('m/d/Y'); ?>
</div>
<div class = "palletkwekerrechts">
<br><b>Milieukenmerk: </b><br><?php echo $ggn;?>
<br><b>Fair produce: </b><br><?php echo $fairproduce;?>
<br><b>GGN: </b><br><?php echo $milieukeurmerk;?>
<br><b>SKAL: </b><br><?php echo $skal;?>
<br><b>Overig: </b><br><?php echo $overigkeurmerk;?>
</div>
</div>
<hr color="#BDBDBD" width="600">
<div id="inner"><b>Champignons</b></div>
<hr color="#BDBDBD" width="600">
<div class = "champignons">
<div class = "champignonslinks">
<p></p><br><br>
<p><b>Palletnummer:</b></p>
<p><textarea disabled name="textarea" id="palletnummer1"
name="palletnummer1"><?php echo $_GET['Palletnummer'];?>
</textarea></p>
<p><b>Plukdatum:</b></p>
<p><textarea disabled name="textarea" id="plukdatum1"
name="plukdatum1"><?php echo $_GET['Plukdatum'];?> </textarea>
</p>
<p><b>Aantal:</b></p>
<p><textarea disabled name="textarea" id="aantal1"><?php echo
$_GET['Aantal'];?></textarea></p>
<p><b>Gewicht:</b></p>
<p><textarea disabled name="textarea" id="gewicht1"></textarea>
</p>
</div>
<div class = "champignonsrechts">
<p></p><br><br>
<p><b>Aanleverdatum:</b></p>
<p><textarea disabled name="textarea" id="aanleverdatum1"><?
php
echo $_GET['Aanleverdatum'];?></textarea></p>
<p><b>Excel Artikel / L.V.O:</b></p>
<p><textarea disabled name="textarea" id="artikel1"><?php
echo
$_GET['Artikel'];?></textarea></p>
<p><b>Vlucht:</b></p>
<p><textarea disabled name="textarea" id="vlucht1"><?php echo
$_GET['Vlucht'];?></textarea></p>
<p><b>Vluchtdag:</b></p>
<p><textarea disabled name="textarea" id="vluchtdag1"><?php
echo
$_GET['Vluchtdag'];?></textarea></p>
</div>
</div>
<div class = "palletbottum">
<hr color="#BDBDBD" width="600">
<div id="inner"><b>Afleveradres</b></div>
<hr color="#BDBDBD" width="600">
<div class ="pallettop">
<p>Limax BV<br> Venrayseweg 126b <br> Horst <br> 5960AJ </p>
</div>
</div>
</div>
This print function has worked for my first page aswell, but it is not pushing the javascript info through that the function is pushing in like shown in these 2 pictures.
As you can see in this picture the data gets pushed into the print page
https: //i.stack.imgur.com/ pOSBM.png
This is what I see when I click print
As you can see here the data that went into the print page did not come through in the print screen https: //i.stack.imgur.com/ waCJp.png
As seen in the last image the data that I managed to get into the print page does not come through in the print screen which is what I am stuck with. I have been googling, going through forums etc to find out what this caused but I can not seem to be figuring it out.
I need to make it able that once you click the print button it also comes out with the info i got into the print page because having the info in the print page but it not printing it has no value for me. I need the companies their suppliers to be able to print the data we need.
I hope someone would be able to help me with the data i provided, if you need extra data please ask so.
I have put alot of time into this post so I hope I won't get put on hold again or be turned down negative.
Tom.
--EDIT - SOLUTION --
<script>
function printContent(el){
var restorepage = $('body').html();
var printcontent = $('#' + el).clone();
var enteredtext = $('#text').val();
$('body').empty().html(printcontent);
window.print();
$('body').html(restorepage);
$('#text').html(enteredtext);
}
</script>

while loop set only first value in input field in php

I want to add users present in a given table. I am iterating whole table and sending each value to javascript file.
<?php
$sql = "select * from user where user_id not in (select second_user_id from friends where first_user_id = '$user_id'\n"
. " union\n"
. " select first_user_id from friends where second_user_id = '$user_id') limit 20";
$result_not_friends=mysqli_query($dbc,$sql)
or die("error in fetching");
// print_r($row_not_friends);
?>
<table class="table table-hover table-bordered">
<h1>Users</h1>
<tbody>
<?php
while ( $row_not_friends = mysqli_fetch_array($result_not_friends))
{
if ( $row_not_friends['user_id'] != $user_id )
{
?>
<tr>
<td>
<?php echo $row_not_friends['user_name']; ?>
</td>
<!-- here I am sending request and processing it via ajax -->
<td><i class="fa fa-user-plus send_request"></i></td>
<input type="hidden" class="send_second" value="<?php echo $row_not_friends['user_id']; ?>">
<input type="hidden" class="send_first" value="<?php echo $user_id; ?>">
</tr>
<?php
}
}
?>
</tbody>
</table>
Now I am accessing each value in a javascript file as follow:
// Here a request is send
$('.send_request').on('click',
function (e) {
e.preventDefault();
var first = $('.send_first').val();
var second = $('.send_second').val();
alert('firt id is ' + first);
alert('second id is ' + second);
$.ajax(
{
url:'send_process.php',
type:'POST',
dataType:"json",
data: { first: first, second: second },
success:function(data)
{
if(data.send_success)
{
window.location.href = "friend.php";
}
else
{
alert("something went wrong");
window.location.href = "friend.php";
}
},
error : function() { console.log(arguments); }
}
);
});
But here var second = $('.send_second').val(); gives only top-most element value of $row_not_friends['user_id'] . When I am echoing the value, it gives correct result.
Please help me.
Because you are selecting ALL the elements in the page and the default behavior of val() is it returns the first item. It has no clue you want the nth item.
First thing is you need to fix your HTML it is invalid. You can not have an input as a sibling of a tr element. You need to move it inside of a TD.
<!-- here I am sending request and processing it via ajax -->
<td><i class="fa fa-user-plus send_request"></i> <!-- removed the closing td from here -->
<input type="hidden" class="send_second" value="<?php echo $row_not_friends['user_id']; ?>">
<input type="hidden" class="send_first" value="<?php echo $user_id; ?>"></td> <!-- moved the closing td to here -->
</tr>
You need to find the elements in the same row as the button you clicked. Since the hidden inputs are npw siblings of the button you can use the siblings() method.
var btn = $(this);
var first = btn.siblings('.send_first').val();
var second = btn.siblings('.send_second').val();

Search MYSQL and display results inside the same html table using php and javascript

I have a drop down if the value selected in drop down its shows the data in html table regarding the value selected in dropdown, i have search box now search is working fine it displays result without refreshing the page ,problem is now its showing the drop down html table and searched value result on the same page ,but i want to display the searched result on the same html table,see my code below,can anyone guide me to do this thanks.
<html>
<select name="client" id="client" style="margin:-8px 0 0 1px;background-color:#E8E8E8;width:104px;position: absolute;">
<option value="">Select Client</option>
<?php
i am connection to mysql
$sql=mysql_query("xxxxxxxxxx");
$clientid=$_GET['clientid'];
while($row=mysql_fetch_assoc($sql))
{
if(strlen($_GET['clientid'])>0 && $_GET['clientid']==$row['clientid'])
{
print' <option id="client" name="client" value="'.$row['clientid'].'">'.$row['clientid'].' </option>';
}
else{
print' <option id="client" name="client" value="'.$row['clientid'].'">'.$row['clientid'].' </option>';
}
}
?>
</select>
<form id="lets_search" action="" style="width:0px;margin:-27px 0 0;text-align:left;">
<input type="text" name="region" id="region">
<input type="text" name="country" id="country">
<input type="submit" value="search" name="search" id="search">
</form>
<div id="content"></div>
<table id="CPH_GridView1" >
<thead class="fixedHeader">
<tr>
<th style=" width:103px">Region </th>
<th style=" width:102px" >Country </th>
<tbody id="fbody" class="fbody" style="width:1660px" >
<div id="content">
<?php
$client_id = $_POST['title'];
if($client_id!=""){
$sql_selectsupplier = "xxxxxxxxxxx";
echo ' <td style="width:103px" class=" '.$rows["net_id"].'">'.$rows["clientid"].'</td>
<td style="width:102px" id="CPH_GridView1_clientid" class=" '.$rows["net_id"].'">'.$rows["region"].'</td>';
</div>
</tbody>
</table>
</html>
//javascript on the same page
<script type="text/javascript">
$(function() {
$("#lets_search").bind('submit',function() {
var valueregion = $('#region').val();
var valuecountry = $('#country').val();
$.post('clientnetworkpricelist/testdb_query.php',{valueregion:valueregion,valuecountry:valuecountry}, function(data){
$("#content").html(data);
});
return false;
});
});
</script>
testdb_query.php
<?php
$dbHost = 'localhost'; // usually localhost
$dbUsername = 'xxxxxx';
$dbPassword = 'xxxxxxxxxxxx';
$dbDatabase = 'xxxxxxxxxxxxxx';
$db = mysql_connect($dbHost, $dbUsername, $dbPassword) or die ("Unable to connect to Database Server.");
mysql_select_db ($dbDatabase, $db) or die ("Could not select database.");
$region=$_POST['valueregion'];
$country=$_POST['valuecountry'];
$clientid=$_POST['clientid'];
if (strlen($region) > 0 && $region!="" ){
$sql_search.= " AND s.region = '".$region."' ";
}
if (strlen($country) > 0 && $country!="" ){
$sql_search.= " AND s.country = '".$country."' ";
}
$query = mysql_query("SELECT * FROM supplierprice s,$clientid c WHERE s.supp_price_id = c.net_id $sql_search");
echo '<table>';
while ($data = mysql_fetch_array($query)) {
echo '
<tr>
<td style="font-size:18px;">'.$data["region"].'</td>
<td style="font-size:18px;">'.$data["country"].'</td>
</tr>';
}
echo '</table>';
?>
for best practice separate your php code from html - get all the data from the db in an array before rendering the html, and afetr that just use foreach in the html to parse each row.
put the DB login and connection in a differnet file and inlcude it with require_once() at top of the page
display errors for better understandig of your script
ini_set('display_errors',1);
ini_set('display_startup_errors',1);
error_reporting(-1);
comment "i am connection to mysql" this line since it will bring an error in this format
After connecting to the DB initialize
$sql_search = ""; // otehrwise it will bring a notice when calling "$sql_search.="
and check the http_request so that it won't bring any errors when first accessing the page without the $_POST data
if ( $_SERVER['REQUEST_METHOD'] === 'POST')
{
//code for displaying the new table with the post data
}
Ok, I see two issues with your HTML code. One is that you are using two html elements with same ID ("content"), which is not the purpose of ID. Second, placing div inside the tbody is not valid HTML.
From your explanation I got that you are trying to show the result of both the actions in a single table.
So, remove first div
<div id="content"></div>
from code and update code inside $.post to something like this
$("#CPH_GridView1").append(data);
Also, remove the div inside tbody as well.

Categories