incorrect run php by button click - javascript

I have php function which update all records in data table and need it run by click button in html.
My php function look like this:
<?php
try {
$sql = 'SELECT id_data, date_record, value1, value2, value3 FROM data ';
$s = $pdo->prepare($sql);
$s->execute();
} catch (PDOException $e) {
$error = 'Error with select data' . $e->getMessage();
include 'error.html.php';
exit();
}
while ($row = $s->fetch()) {
$dane[] = array(
'id_data' => $row['id_data'],
'date_record' => $row['date_record'],
'value1' => $row['value1'],
'value2' => $row['value2'],
'value3' => $row['value3']
);
}
if (isset($_GET['edytion'])) {
foreach ($data as $data2) {
try {
$sql = 'UPDATE data SET date_record = :date_record, value1 = :value1, value2 = :value2, value3 = :value3 WHERE id_data= :id_data';
$s = $pdo->prepare($sql);
$s->bindValue(':date_record', $_POST['date_record']);
$s->bindValue(':value1', $_POST['value1']);
$s->bindValue(':value2', $_POST['value2']);
$s->bindValue(':value3', $_POST['value3']);
$s->bindValue(':id_data', $_POST['id_data']);
$s->execute();
} catch (PDOException $e) {
$error = 'Edit data error ' . $e->getMessage();
include 'error.html.php';
exit();
}
}
Header("Location: theme3.php");
}
?>
And my form in html where i try run this look:
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<tr>
<th>Date</th>
<th>Value 1</th>
<th>Value 2</th>
<th>Value 3</th>
</tr>
</thead>
<?php if (isset($data)): ?>
<?php foreach ($data as $data1): $a = 0 ?>
<form action="?edytion" method="post" id='ed'>
<tr class="bg-primary">
<input type="hidden" name="id_data" id="id_data" value="<?php echo $data1['id_data']; ?>">
<td><input type="date" name="date_record" id="date_record" value="<?php echo $data1['date_record']; ?>"> </td>
<td><input type="text" name="value1" id="value1" value="<?php echo $data1['value1']; ?>"> </td>
<td><input type="text" name="value2" id="value2" value="<?php echo $data1['value2']; ?>"> </td>
<td><input type="text" name="value3" id="value3" value="<?php echo $data1['value3']; ?>"> </td>
<!-- <input type="hidden" ondblclick="default" id="id_buttona" value="Edit"/> -->
</tr>
</form>
<?php $a++;
endforeach; ?>
<?php endif; ?>
</tbody>
</table>
<input type="submit" id="id_buttona" onclick="document.getElementById('ed').submit();" value="Edit"/>
</div>
Ultimately when i try update data it update only first record in table, rest of them is invariable.
Anybody know what is wrong and have idea how correct it? I will be grateful for help!

You create too many forms with the same id. Surround the table with the <form> and do foreach on <tr> only.
Something like this
<div class="table-responsive">
<form action="?edytion" method="post" id='ed'>
<table class="table table-bordered">
<thead>
<tr>
<th>Date</th>
<th>Value 1</th>
<th>Value 2</th>
<th>Value 3</th>
</tr>
</thead>
<?php if (isset($data)): ?>
<?php $a = 0; foreach ($data as $data1): ?>
<tr class="bg-primary">
<input type="hidden" name="id_data<?php echo $a; ?>" id="id_data" value="<?php echo $data1['id_data']; ?>" />
<td><input type="date" name="date_record<?php echo $a; ?>" value="<?php echo $data1['date_record']; ?>"> </td>
<td><input type="text" name="value1<?php echo $a; ?>" value="<?php echo $data1['value1']; ?>"> </td>
<td><input type="text" name="value2<?php echo $a; ?>" value="<?php echo $data1['value2']; ?>"> </td>
<td><input type="text" name="value3<?php echo $a; ?>" value="<?php echo $data1['value3']; ?>"> </td>
</tr>
<?php $a++;
endforeach; ?>
<?php endif; ?>
</tbody>
</table>
<input name="row_count" value="<?php echo isset($a) ? $a : 0; ?>" type="hidden"/>
</form>
<input type="submit" id="id_buttona" onclick="document.getElementById('ed').submit();" value="Edit"/>
</div>
The way you created each form for each row will not work well because: (1) all your forms have the same javascript id, when you do getElementById only the first form is affected, (2) when you submit that one form the page reloads and all the changes to other rows are lost.
One solution is to make only 1 form and have different name to all fields. Forms fields are sent by name and value so you need different names for all fields and you don't really need ids.
You can add row count somewhere in the form and then change php to something like this:
$row_count = $_POST['row_count'];
for($i = 0; i < $row_count; i++) {
try {
$sql = 'UPDATE data SET
date_record = :date_record,
value1 = :value1,
value2 = :value2,
value3 = :value3
WHERE id_data= :id_data';
$s = $pdo->prepare($sql);
$s->bindValue(':date_record', $_POST['date_record' . $i]);
$s->bindValue(':value1', $_POST['value1' . $i]);
$s->bindValue(':value2', $_POST['value2' . $i]);
$s->bindValue(':value3', $_POST['value3' . $i]);
$s->bindValue(':id_data', $_POST['id_data' . $i]);
$s->execute();
}
catch (PDOException $e) {
$error = 'Edit data error ' . $e->getMessage();
include 'error.html.php';
exit();
}
}

It is all html file
<!DOCTYPE HTML PUBLIC>
<html>
<head>
<title>Tematyka2</title>
<link rel="stylesheet" href="style.css" type="text/css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"/>
</head>
<body>
<div id="container">
<div id="heading"></div>
<table border="0" width="766" cellpadding="0" cellspacing="0" align="center">
<tr>
<td class="t1"><p>Example title</p></td><td class="t2"> <b class="linkW" style="padding-left: 60%">Logout</b></td>
</tr>
<tr>
<td class="top1"><div class="inscription">Your Page</div></td>
<td class="top2" valign="top"></td>
</tr>
</table>
<table align="center" cellpadding="0">
<tr>
<td valign="top">
<table cellpadding="0" cellspacing="0">
<tr><td class="topm">Main menu</td></tr>
<tr><td class="tlom">
:: Main page <br>
</td></tr>
<tr><td class="dolm"></td></tr
</table>
<table cellpadding="0" cellspacing="0">
<tr><td class="topm">Them</td></tr>
<tr><td class="tlom">
:: Them 1 <br>
:: <b>Them 2</b> <br>
:: Them 3 <br>
</td></tr>
<tr><td class="dolm"></td></tr
</table>
<table cellpadding="0" cellspacing="0">
<tr><td class="topm">Charts</td></tr>
<tr><td class="tlom">
:: Chart1 <br>
:: Chart2 <br>
</td></tr>
<tr><td class="dolm"></td></tr>
</table>
<br>
</td>
<td width="1"></td>
<td valign="top">
<table cellpadding="0" cellspacing="0">
<tr><td class="topn"></td></tr>
<tr><td class="tlon">
<div class="span7 center">
<h2>
EDYTION
</h2>
</div>
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<tr>
<th>Date</th>
<th>Value 1</th>
<th>Value 2</th>
<th>Value 3</th>
</tr>
</thead>
<?php if(isset($data)): ?>
<?php foreach($data as $data1): $a=0?>
<form action="?edytion" method="post" id='ed'>
<tr class="bg-primary">
<input type="hidden" name="id_data" id="id_data" value="<?php echo $data1['id_data']; ?>">
<td><input type="date" name="date_record" id="date_record" value="<?php echo $data1['date_record']; ?>"> </td>
<td><input type="text" name="value1" id="value1" value="<?php echo $data1['value1']; ?>"> </td>
<td><input type="text" name="value2" id="value2" value="<?php echo $data1['value2']; ?>"> </td>
<td><input type="text" name="value3" id="value3" value="<?php echo $data1['value3']; ?>"> </td>
<!-- <input type="hidden" ondblclick="default" id="id_buttona" value="Edit"/> -->
</tr>
</form>
<?php $a++; endforeach; ?>
<?php endif; ?>
</tbody>
</table>
<input type="submit" id="id_buttona" onclick="document.getElementById('ed').submit();" value="Edit"/>
</div>
</td></tr>
<!-- <tr><td class="doln"></td></tr> -->
</table>
</td>
</tr>
</table>
<table align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="foot1"> My page</td>
<td class="foot2"><img src="images/dol2.jpg" alt="anything"></td>
</tr>
</table>
And Php part:
<?php
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
include $_SERVER['DOCUMENT_ROOT'] . '/connection_to_database.php';
include $_SERVER['DOCUMENT_ROOT']. '/check_login.php'; try {
$sql = 'SELECT id_data, date_record, value1, value2, value3 FROM data ';
$s = $pdo->prepare($sql);
$s->execute();
} catch (PDOException $e) {
$error = 'Error with select data' . $e->getMessage();
include 'error.html.php';
exit();
}
while ($row = $s->fetch()) {
$dane[] = array(
'id_data' => $row['id_data'],
'date_record' => $row['date_record'],
'value1' => $row['value1'],
'value2' => $row['value2'],
'value3' => $row['value3']
);
}
if (isset($_GET['edytion'])) {
foreach ($data as $data2) {
try {
$sql = 'UPDATE data SET
date_record = :date_record,
value1 = :value1,
value2 = :value2,
value3 = :value3
WHERE id_data= :id_data';
$s = $pdo->prepare($sql);
$s->bindValue(':date_record', $_POST['date_record']);
$s->bindValue(':value1', $_POST['value1']);
$s->bindValue(':value2', $_POST['value2']);
$s->bindValue(':value3', $_POST['value3']);
$s->bindValue(':id_data', $_POST['id_data']);
$s->execute();
}
catch (PDOException $e) {
$error = 'Edit data error ' . $e->getMessage();
include 'error.html.php';
exit();
}
}
Header("Location: theme3.php");
}
?>
And that's all about update data. Php and html are in one file, I know it's look unprofessionally and i shoudln't do it in this way.

Related

How to calculate the rest of the inputs

I have a table and I am calculating the difference of hours but only first row of the table calculates me. and I have a method where created a new table is if the date is different
$(document).ready(function() {
getHrs();
});
function getHrs()
{
hstart=$('#horaInicio').val();
hend=$('#horaTermino').val();
hr1 = (hstart).split(":");
hr2 = (hend).split(":");
hrstart=(hr1[0]);
minstart=(hr1[1]);
hrend=(hr2[0]);
minend=(hr2[1]);
totalstart=parseInt((hrstart*60)) + parseInt(minstart);
totalend=parseInt(hrend*60) + parseInt(minend);
rsthr=(totalstart - totalend);
total=(rsthr / 60).toFixed(2);
$('#resultado').val(total);
}
here my table, I create a table for each different day.
<?php if ($seguimientos): ?>
<?php $fechas = array();
foreach ($seguimientos as $seguimiento) {
$fechas[$seguimiento-> fecha][] = $seguimiento;
}
?>
<?php foreach ($fechas as $fecha): ?>
<table class="table table-hover">
<thead>
<tr>
<th>Fecha</th>
<th>Orden</th>
</tr>
</thead>
<?php foreach ($fecha as $seguimiento): ?>
<tr>
<td>
<?php echo $seguimiento-> fecha; ?>
</td>
<td>
<?php echo $seguimiento-> horaInicio; ?>
<input type="hidden" id="horaInicio" value=" echo $seguimiento-> horaInicio;">
</td>
<td>
<?php echo $seguimiento-> horaFin; ?>
<input type="hidden" id="horaInicio" value=" echo $seguimiento-> horaFin;">
</td>
<td>
<input type="text" id="resultado" value="" readonly>
</td>
</tr>
<?php endforeach; ?>
</table>
<?php endforeach; ?>
<?php endif; ?>
could be the problem the ID must be unique
Yes, that is the problem, try not to use id's but rather data attributes, or classes.
like this: <input type="hidden" data-start="horaInicio" value=" echo $seguimiento-> horaInicio;">
Then your selector becomes: hstart=$('[data-start]').val(); And the same for the other input.

Using AJAX to Send Data on Button Click

I have a table with multiple columns (index.php). One column is a checkbox. Whenever the checkbox is checked, it displays another column where you can select a quantity.
I want to be able to hit a button called "Add to Order" and have it use AJAX to add any selected rows to the index-order.php page. After all selections have been made, I want to be able to click the "Checkout" button and have it take me to the index-order.php page where it should be displaying all of the added selections in a table.
I know how to navigate to the index-order.php page so my main question is how can I add the selected rows to the index-order.php page by using ajax when pressing the button?
Index.php code:
<form name="form1" action="index-order.php">
<section id="checkout-btn">
<button type="submit" id="checkout" name="order">Checkout</button>
</section>
</form>
<form name="form2" method="POST" action="index-order.php">
<section id="addToOrder">
<button type="submit" class="order" id="order" name="order" value="AddToOrder">Add to Order</button>
</section>
<br>
<table id="merchTable" cellspacing="5" class="sortable">
<thead>
<tr class="ui-widget-header">
<th class="sorttable_nosort"></th>
<th class="sorttable_nosort">Loc</th>
<th class="merchRow">Report Code</th>
<th class="merchRow">SKU</th>
<th class="merchRow">Special ID</th>
<th class="merchRow">Description</th>
<th class="merchRow">Quantity</th>
<th class="sorttable_nosort">Unit</th>
<th style="display: none;" class="num">Quantity #</th>
</tr>
</thead>
<tbody>
<?php foreach ($dbh->query($query) as $row) {?>
<tr>
<td class="ui-widget-content"><input type="checkbox" class="check" name="check"></td>
<td name="rows[0][0][loc]" class="loc ui-widget-content" id="loc-<?php echo intval ($row['Loc'])?>"><?php echo $row['Loc'];?></td>
<td name="rows[0][0][rp-code]" class="rp-code ui-widget-content" align="center" id="rp-code-<?php echo intval ($row['Rp-Code'])?>"><?php echo $row['Rp-Code'];?></td>
<td name="rows[0][0][sku]" class="sku ui-widget-content" id="sku-<?php echo intval ($row['SKU'])?>"><?php echo $row['SKU'];?></td>
<td name="rows[0][0][special-id]" class="special-id ui-widget-content" align="center" id="special-id-<?php echo intval ($row['Special-ID'])?>"><?php echo $row['Special-ID'];?></td>
<td name="rows[0][0][description]" class="description ui-widget-content" id="description-<?php echo intval ($row['Description'])?>"><?php echo $row['Description'];?></td>
<td name="rows[0][0][quantity]" class="quantity ui-widget-content" data-quantity="<?php echo $row['Quantity'] ?>" align="center" id="quantity-<?php echo intval ($row['Quantity'])?>"><?php echo $row['Quantity'];?></td>
<td name="rows[0][0][unit]" class="unit ui-widget-content" id="unit-<?php echo intval ($row['Unit'])?>"><?php echo $row['Unit'];?></td>
<td name="rows[0][0][quant]" style="display: none;" class="quantity_num ui-widget-content"><input type="textbox" style="width: 100px;" class="spinner" name="value" id="test"></td>
</tr>
<?php } ?>
</tbody>
</table>
</form>
<div id="log"></div>
Index-order.php:
<?php if(isset($_POST['rows'])): ?>
<table cellspacing="20">
<tr align="center">
<th>Loc</th>
<th>Report Code</th>
<th>SKU</th>
<th>Special ID</th>
<th>Description</th>
<th>Quantity</th>
<th>Unit</th>
<th>Quantity #</th>
</tr>
<?php
foreach($_POST['rows'][0] as $row):
?>
<tr align="center">
<td><?php echo $row['loc']; ?></td>
<td><?php echo $row['rp-code']; ?></td>
<td><?php echo $row['sku']; ?></td>
<td><?php echo $row['special-id']; ?></td>
<td><?php echo $row['description']; ?></td>
<td><?php echo $row['quantity']; ?></td>
<td><?php echo $row['unit']; ?></td>
<td><?php echo $row['quant']; ?></td>
</tr>
<?php
endforeach;
?>
</table>
<?php endif; ?>
JavaScript:
$(function () {
$("#order").click(function() {
//reset the logger
$('#log').empty();
$('#merchTable input:checkbox:checked').each(function() {
//for each checked checkbox, iterate through its parent's siblings
var array = $(this).parent().siblings().map(function() {
return $(this).text().trim();
}).get();
console.log(array);
//to print the value of array
$('#log').append(JSON.stringify(array))
var request = $.ajax({
type: 'post',
url: 'index-order.php',
data: array,
success: function(){
alert('success');
},
error: function(){
alert('failure');
}
});
})
});
});
To pass data from one page to another using php you will have to use a session.
So in your ajax call just save your data into the session like so:
add-to-cart.php
session_start();
if (!isset($_SESSION['shopping_cart'])) {
$_SESSION['shopping_cart'] = [];
} else {
$_SESSION['shopping_cart'][] = [
'id' => $_POST['item_id'],
'amount' => $_POST['amount']
];
}
If you then click your checkout button and navigate via a page reload to your index-order.php, you could then access the data via the same session index.
session_start();
if (isset($_SESSION['shopping_cart'])) {
// display your data
} else {
echo "Your shopping cart is empty.";
}

Send Table Row Data via AJAX Based on Checkbox Checked

I have a table with multiple columns (index.php). One column is a checkbox. Whenever the checkbox is checked, it displays another column where you can select a quantity.
I want to then be able to hit a button called "Add to Order" and have it use AJAX to add any selected rows to the index-order.php page. After all selections have been made, I want to be able to click the "Checkout" button and have it take me to the index-order.php page where it should display all of the added selections in a table.
I know how to navigate to the index-order.php page so my main question is how can I add the selected rows to the page while using ajax and staying on the current page when doing so?
Index.php code:
<form name="form1" action="index-order.php">
<section id="checkout-btn">
<button type="submit" id="checkout" name="order">Checkout</button>
</section>
</form>
<form name="form2" method="POST" action="index-order.php">
<section id="addToOrder">
<button type="submit" class="order" id="order" name="order" value="AddToOrder">Add to Order</button>
</section>
<br>
<div id="my-div2" class="ui-widget">
<div class="ui-widget">
<table id="merchTable" cellspacing="5" class="sortable">
<thead>
<tr class="ui-widget-header">
<th class="sorttable_nosort"></th>
<th class="sorttable_nosort">Loc</th>
<th class="merchRow">Report Code</th>
<th class="merchRow">SKU</th>
<th class="merchRow">Special ID</th>
<th class="merchRow">Description</th>
<th class="merchRow">Quantity</th>
<th class="sorttable_nosort">Unit</th>
<th style="display: none;" class="num">Quantity #</th>
</tr>
</thead>
<tbody>
<?php foreach ($dbh->query($query) as $row) {?>
<tr>
<td class="ui-widget-content"><input type="checkbox" class="check" name="check"></td>
<td name="rows[0][0][loc]" class="loc ui-widget-content" id="loc-<?php echo intval ($row['Loc'])?>"><?php echo $row['Loc'];?></td>
<td name="rows[0][0][rp-code]" class="rp-code ui-widget-content" align="center" id="rp-code-<?php echo intval ($row['Rp-Code'])?>"><?php echo $row['Rp-Code'];?></td>
<td name="rows[0][0][sku]" class="sku ui-widget-content" id="sku-<?php echo intval ($row['SKU'])?>"><?php echo $row['SKU'];?></td>
<td name="rows[0][0][special-id]" class="special-id ui-widget-content" align="center" id="special-id-<?php echo intval ($row['Special-ID'])?>"><?php echo $row['Special-ID'];?></td>
<td name="rows[0][0][description]" class="description ui-widget-content" id="description-<?php echo intval ($row['Description'])?>"><?php echo $row['Description'];?></td>
<td name="rows[0][0][quantity]" class="quantity ui-widget-content" data-quantity="<?php echo $row['Quantity'] ?>" align="center" id="quantity-<?php echo intval ($row['Quantity'])?>"><?php echo $row['Quantity'];?></td>
<td name="rows[0][0][unit]" class="unit ui-widget-content" id="unit-<?php echo intval ($row['Unit'])?>"><?php echo $row['Unit'];?></td>
<td name="rows[0][0][quant]" style="display: none;" class="quantity_num ui-widget-content"><input type="textbox" style="width: 100px;" class="spinner" name="value" id="test"></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</form>
Index-order.php:
<?php if(isset($_POST['rows'])): ?>
<table cellspacing="20">
<tr align="center">
<th>Loc</th>
<th>Report Code</th>
<th>SKU</th>
<th>Special ID</th>
<th>Description</th>
<th>Quantity</th>
<th>Unit</th>
<th>Quantity #</th>
</tr>
<?php
foreach($_POST['rows'][0] as $row):
?>
<tr align="center">
<td><?php echo $row['loc']; ?></td>
<td><?php echo $row['rp-code']; ?></td>
<td><?php echo $row['sku']; ?></td>
<td><?php echo $row['special-id']; ?></td>
<td><?php echo $row['description']; ?></td>
<td><?php echo $row['quantity']; ?></td>
<td><?php echo $row['unit']; ?></td>
<td><?php echo $row['quant']; ?></td>
</tr>
<?php
endforeach;
?>
</table>
<?php endif; ?>
JavaScript (obviously needs some work. Posting what I have so far):
$(function () {
$('#form2').on('submit', function (e) {
if($('input.check').is(':checked')) {
$(this).closest('tr');
e.preventDefault();
var request = $.ajax({
type: 'post',
url: 'index-order.php',
data: $('#form2').serialize(),
success: function(){
alert('success');
},
error: function(){
alert('failure');
}
});
}
});
});
What you can do is get all the siblings of the current checked checkbox and based on that get all the columns and separate the data to finally send it via ajax.
You can do something like this:
$('#form2').on('submit', function (e) {
$checkbox = $(this).find('input.check:checked').parent('td'); //Finds the checked checkbox's column inside #form2
$otherColumns = $checkbox.nextAll(); //Gets all the siblings
});
The above code will get you all the other columns next to the checked checkbox inside your form. What you an do next is travel across $otherColumns and get each individual value using $otherColums.eq(n).html() where n is the number of the column you are trying to get.

Filter an echoed table using javascript

I need help with regards to filtering my echoed table using javascript. I'm just using a as a refresher of my form. Take a look on my code below.
Here's my code for the filtering
<div align="center">
<?php
// Connect to server and select database.
mysql_connect("localhost", "root", "") or die(mysql_error());
mysql_select_db("leavecalendar") or die(mysql_error());
$i=0;
$result = mysql_query("SELECT fullname FROM employee");
$storeArray = Array();
echo '<label>Filter By Name:</label><select name="fullname" style="width: 200px">';
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
echo "<option >".$row['fullname']."</option>";
}
?>
</select>
<!--Filter by Date -->
<label>Filter By Date:</label>
<input class="datepicker">
click
</div>
Here's my code for the echoed table
<div style="height:70%;">
<?php
$con=mysqli_connect("localhost","root","","leavecalendar");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$sql = mysqli_query($con,"SELECT * FROM timekeeping WHERE id='$row[fullname]'");
?>
<table width="10%" border="0" cellspacing="1" cellpadding="0" style="width: 897px;">
<tr>
<td>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#CCCCCC" class="form-table">
<tr>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Full Name</strong></td>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Clock In</strong></td>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Clock Out</strong></td>
<?php
while($row = mysqli_fetch_array($sql))
{
?>
<tr>
<td bgcolor="#FFFFFF"><?php echo $row['fullname']; ?></td>
<td bgcolor="#FFFFFF"><?php echo $row['actualstart']; ?></td>
<td bgcolor="#FFFFFF"><?php echo $row['actualend']; ?></td>
</tr>
<?php
}
?>
</table>
</td>
</tr>
</table>
</div>
All in all there 2 codes are under 1 form only. So below is the summary of the codes for your reference.
<form name="form1" method="post" action="deleteleave.php">
<div align="center">
<?php
// Connect to server and select database.
mysql_connect("localhost", "root", "") or die(mysql_error());
mysql_select_db("leavecalendar") or die(mysql_error());
$i=0;
$result = mysql_query("SELECT fullname FROM employee");
$storeArray = Array();
echo '<label>Filter By Name:</label><select name="fullname" style="width: 200px">';
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
echo "<option >".$row['fullname']."</option>";
}
?>
</select>
<!--Filter by Date -->
<label>Filter By Date:</label>
<input class="datepicker">
click
</div>
<div class="gridbody">
<div style="height:70%;">
<?php
$con=mysqli_connect("localhost","root","","leavecalendar");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$sql = mysqli_query($con,"SELECT * FROM timekeeping WHERE id='$row[fullname]'");
?>
<table width="10%" border="0" cellspacing="1" cellpadding="0" style="width: 897px;">
<tr>
<td>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#CCCCCC" class="form-table">
<tr>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Full Name</strong></td>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Clock In</strong></td>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Clock Out</strong></td>
<?php
while($row = mysqli_fetch_array($sql))
{
?>
<tr>
<td bgcolor="#FFFFFF"><?php echo $row['fullname']; ?></td>
<td bgcolor="#FFFFFF"><?php echo $row['actualstart']; ?></td>
<td bgcolor="#FFFFFF"><?php echo $row['actualend']; ?></td>
</tr>
<?php
}
?>
</table>
</td>
</tr>
</table>
</div>
</div>
<input name="endorse" type="submit" id="endorse" value="Endorse Selected Leave/s">
And here's my javascript for refreshing the page. Pratically, I dont want to refresh the whole page but instead I want to refresh the form only so as to display the echoed table filtere by the dropdown or the datepicker. Hope you get my point there.
Code for refreshing the page.
<script>
$(function() {
$("#refresh").click(function() {
$("#Container").load()
})
})
</script>
Thank you for all the answers you will give. Much appreciated.
Based on your code do something like this:
Make a file echoed_table.php and put in (your code):
<div style="height:70%;">
<?php
$con=mysqli_connect("localhost","root","","leavecalendar");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$sql = mysqli_query($con,"SELECT * FROM timekeeping WHERE id='$row[fullname]'");
?>
<table width="10%" border="0" cellspacing="1" cellpadding="0" style="width: 897px;">
<tr>
<td>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#CCCCCC" class="form-table">
<tr>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Full Name</strong></td>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Clock In</strong></td>
<td align="center" bgcolor="#FFFFFF" class="tdclass"><strong>Clock Out</strong></td>
<?php
while($row = mysqli_fetch_array($sql))
{
?>
<tr>
<td bgcolor="#FFFFFF"><?php echo $row['fullname']; ?></td>
<td bgcolor="#FFFFFF"><?php echo $row['actualstart']; ?></td>
<td bgcolor="#FFFFFF"><?php echo $row['actualend']; ?></td>
</tr>
<?php
}
?>
</table>
</td>
</tr>
</table>
</div>
Than in order to load/update the table make the ajax call (maybe including additional (filter) url-parameters):
$.ajax('echoed_table.php').success(function(data) {
$('.gridbody').innerHtml(data); // better use an id to identify the container div, instead of the class here
});

EDIT: add an identifier to a dynamically generated row

I'm pulling down two tables from the db. There's a Javascript function that adds a row from Table2 into the Table1. What i've been trying to do is get the data from Table1 on the confirm_trade.php page so I can put it into the db but can't figure out how to pull that row(item_id). I thought putting the table in a form would allow me to access them through the $_POST but that's not working. How to add an identifier to the jquery row so I can grab on the confirm page?
The appended rows coming from the jQuery function are the rows I need the item_id from.
function addto(obj)
{
var $row = $(obj).parents("tr");
var $table = $("#tradee");
var item_id = $row.find(".item-id").text();
var item_name = $row.find(".item-name").text();
var item_desc = $row.find(".item-desc").text();
var newTR = $("<tr><td>"+item_id+"</td><td>"+item_name+
"</td><td>"+item_desc+"</td></tr>");
$table.append(newTR);
}
Table2:
<div id='fixedDiv'>
<form action="confirm.php" method="post">
<table align="center" id="Table2">
<tr><td>Other Item</td></tr>
<?php while($rowi =$item->fetch_assoc())
{?>
<tr>
<td>
<?php echo $rowi['item_id']; ?>
</td>
<td>
<?php echo $rowi['item_name']; ?>
</td>
<td><?php echo $rowi['item_description'];?></td>
</tr>
<?php } ?>
<tr>
<td><input type="submit" name="submit" value="Continue"/></td>
</tr>
</table>
</form>
</div>
<br>
Table 1:
<table align="center" id="Table1">
<tr><th>item_id</th>
<th>Cat_id</th>
<th>Name</th>
<th>Description</th>
</tr>
<?php while($row =$item_results->fetch_assoc())
{?>
<tr></tr>
<tr>
<td class="item-id"> <?php echo $row['item_id']; ?> </td>
<td><?php echo $cat_id = $row['cat_id']; ?> </td>
<td class="item-name"><?php echo $item_id = $row['item_name'];?></td>
<td class="item-desc"><?php echo $item_descrip = $row['item_description'];?>
</td>
<td><input type="button" class="added" onclick="addto(this)"
value="Add" />
<td><input type="button" class="removed" onclick="remove()"
value="Remove" >
</td>
</tr>
<?php } ?>
</table>
Judging by your code, you can use <input type="hidden" name="some_hidden_data" value="field-value">. be sure that you also wrap your table with <form method="post"></form>
the hidden field will be then included as $_POST['hidden_field_name'];

Categories

Resources