I am using AJAX to call a PHP file that pulls a summary of calls from a MySQL database. The AJAX routine then inserts the returned table with an HTML form for each row in the table into the original webpage. Each row has a submit button to open the actual record and display all info so it can be edited. When I code this just in HTML without the AJAX update it works perfectly but I need to refresh the webpage to update the data. I want the data refreshed every 5 seconds automatically without needing to refresh the entire page. When I move the code to the AJAX routine the table pulls in perfectly with the data and the submit buttons for each row but the submit buttons don't do anything.
Code calling AJAX routine in main HTML page
const interval = setInterval(function() {
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {
document.getElementById("unitstatus").innerHTML = this.responseText;
}
xhttp.open("GET", "updatestatus.php");
xhttp.send();
}, 5000);
Code Displaying Response in main HTML page
<div id='unitstatus' name='unitstatus'></div>
PHP File called by AJAX
<?php
session_start();
$event = $_SESSION['event'];
set_include_path('./includes/');
include 'conn.inc';
$conn = new mysqli($servername, $username, $password, $dbname);
$sql="SELECT * from sags WHERE Complete='N' AND event='$event' ORDER BY bib";
?>
<!DOCTYPE html >
<head>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
</head>
<body>
<table width='100%' border='1'>
<tr>
<td width='100%' height='45px' colspan='8' class='w3-center'>
<button class='w3-button w3-blue w3-text-white w3-medium w3-padding-8' name='addnew' id='addnew' onclick='gotonewcall()'>ADD NEW REQUEST</button>
</td>
</tr>
<tr>
<td width='6%' class='w3-padding-small w3-small'><b>ID</b></td>
<td width='14%' class='w3-padding-small w3-small'><b>NAME</b></td>
<td width='6%' class='w3-padding-small w3-small'><b>BIB</b></td>
<td width='12%' class='w3-padding-small w3-small'><b>CELL PHONE</b></td>
<td width='24%' class='w3-padding-small w3-small'><b>CALL</b></td>
<td width='18%' class='w3-padding-small w3-small'><b>LAST UPDATE</b></td>
<td width='15%' class='w3-padding-small w3-small'><b>STATUS</b></td>
<td width='5%'></td>
</tr>
<?php
if(mysqli_query ($conn, $sql)){
$result = mysqli_query ($conn, $sql);
while($row=mysqli_fetch_array($result)){
if ($row['status']=="ONLOCATION"){
$status = "ON LOCATION";
} else {
$status = $row['status'];
}
?>
<form action="editrequest.php" method="post">"
<tr>
<td width='6%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['id'] ?><input type='text' name='id' id='id' style='width:100%' class='w3-light-gray' value=<?php echo $row['id'] ?> hidden></b></td>
<td width='14%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['fName'] ?></b></td>
<td width='6%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['bib'] ?></b></td>
<td width='12%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['cellphone'] ?></b></td>
<td width='24%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['sagrequest'] ?></b></td>
<td width='18%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['statstime'] ?></b></td>
<?php
if ($status == "ON LOCATION"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-white w3-red'>";
echo "<b>" . $status . "</b>";
echo "</td>";
} elseif ($status == "ENROUTE"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-black w3-yellow'>";
echo "<b>" . $status . "</b>";
echo "</td>";
} elseif ($status == "NEW"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-black w3-white'>";
echo "<b>" . $status . "</b>";
echo "</td>";
} elseif ($status == "RECEIVED"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-black w3-gray'>";
echo "<b>" . $status . "</b>";
echo "</td>";
} elseif ($status == "TRANSPORTING"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-white w3-purple'>";
echo "<b>" . $status . "</b>";
echo "</td>";
}
?>
<td width='5%' class='W3-center w3-tiny'>
<input type="submit" value="OPEN" name="editentry" id="editentry" class="w3-button w3-blue w3-center" style="width:100%; height:100%">
</td>
</tr>
</form>
<?php
}
} else {
echo "<tr><td colspan='8' class='w3-center'><h3><b>NO ACTIVE CALLS</b></h3></td></tr>";
}
?>
</table>
<?php
mysqli_close();
?>
I will do something like this, working example here.
PHP file
<?php
session_start();
$event = $_SESSION['event'];
set_include_path('./includes/');
include 'conn.inc';
$conn = new mysqli($servername, $username, $password, $dbname);
$sql="SELECT * from sags WHERE Complete='N' AND event='$event' ORDER BY bib";
if(mysqli_query ($conn, $sql)){
$result = mysqli_query ($conn, $sql);
while($row=mysqli_fetch_array($result)){
if ($row['status']=="ONLOCATION"){
$status = "ON LOCATION";
} else {
$status = $row['status'];
}
?>
<tr>
<td width='6%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['id'] ?>
</b></td>
<td width='14%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['fName'] ?></b></td>
<td width='6%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['bib'] ?></b></td>
<td width='12%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['cellphone'] ?></b></td>
<td width='24%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['sagrequest'] ?></b></td>
<td width='18%' class='w3-padding-small w3-small w3-text-black'><b><?php echo $row['statstime'] ?></b></td>
<?php
if ($status == "ON LOCATION"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-white w3-red'>";
echo "<b>" . $status . "</b>";
echo "</td>";
} elseif ($status == "ENROUTE"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-black w3-yellow'>";
echo "<b>" . $status . "</b>";
echo "</td>";
} elseif ($status == "NEW"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-black w3-white'>";
echo "<b>" . $status . "</b>";
echo "</td>";
} elseif ($status == "RECEIVED"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-black w3-gray'>";
echo "<b>" . $status . "</b>";
echo "</td>";
} elseif ($status == "TRANSPORTING"){
echo "<td width='15%' class='w3-padding-small w3-small w3-text-white w3-purple'>";
echo "<b>" . $status . "</b>";
echo "</td>";
}
?>
<td width='5%' class='W3-center w3-tiny'>
<form action="editrequest.php" method="post">
<input type='text' name='id' id='id' style='width:100%' class='w3-light-gray' value=<?php echo $row['id'] ?> hidden>
<input type="submit" value="OPEN" name="editentry" id="editentry" class="w3-button w3-blue w3-center" style="width:100%; height:100%">
</form>
</td>
</tr>
<?php
}
} else {
echo "<tr><td colspan='8' class='w3-center'><h3><b>NO ACTIVE CALLS</b></h3></td></tr>";
}
?>
JavaScript
const interval = setInterval(function() {
$("#tableForm").load("updatestatus.php");//Load since just updating data
//You can use $.get() as well
//Or use $.post() if you have some data to send to php file.
//and append response with .html()
}, 5000);
HTML
<!DOCTYPE html >
<head>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
</head>
<body>
<table width='100%' border='1'>
<tr>
<td width='100%' height='45px' colspan='8' class='w3-center'>
<button class='w3-button w3-blue w3-text-white w3-medium w3-padding-8' name='addnew' id='addnew' onclick='gotonewcall()'>ADD NEW REQUEST</button>
</td>
</tr>
<tr>
<td width='6%' class='w3-padding-small w3-small'><b>ID</b></td>
<td width='14%' class='w3-padding-small w3-small'><b>NAME</b></td>
<td width='6%' class='w3-padding-small w3-small'><b>BIB</b></td>
<td width='12%' class='w3-padding-small w3-small'><b>CELL PHONE</b></td>
<td width='24%' class='w3-padding-small w3-small'><b>CALL</b></td>
<td width='18%' class='w3-padding-small w3-small'><b>LAST UPDATE</b></td>
<td width='15%' class='w3-padding-small w3-small'><b>STATUS</b></td>
<td width='5%'></td>
</tr>
<div id="tableForm"><!-- I will load form here from php --></div>
</table>
Edit:-
Explanation
In the inspect element I saw <form .....> ... but no </form>, I tried lot things to make it a clear defined form but failed. There is some part of your code which is breaking the input element so I declared it separately since the form has only 1 input.
Suggestion
Echo out only the needed code from ajax requested file.
Avoid using <b> why? idk but better use font-weight:bold
Use $.ajax() $.post() $.get() more easy way to AJAX requests.
Because you are adding new elements to the DOM, you'll need register event handlers for each new added button.
However there is another method you can use is to register event listener on the table itself only once and capture events originated from buttons:
const templ = document.getElementById("templ").content;
const result = document.getElementById("result");
//event listener on parent
document.getElementById("table2").addEventListener("click", buttonClicked2);
function add(parent, addEvent)
{
parent = document.getElementById(parent);
const row = templ.cloneNode(true);
row.querySelector("td").textContent = "row " + (parent.children.length+1);
//event listener on button
if (addEvent)
row.querySelector("button").addEventListener("click", buttonClicked);
parent.tBodies[0].appendChild(row);
}
function buttonClicked(e) {
result.textContent = "table=" + e.target.parentNode.offsetParent.id + " row=" + e.target.parentNode.parentNode.rowIndex;
}
function buttonClicked2(e) {
result.textContent = e.target.tagName; //this will show which element clicked unless button was clicked
if (e.target.tagName != "BUTTON")
return;
result.textContent = "table=" + e.target.parentNode.offsetParent.id + " row=" + e.target.parentNode.parentNode.rowIndex;
}
.flex {
grid-gap: 1em;
display: flex;
}
Clicked button at <span id="result"></span>
<div class="flex">
<div>Events from button
<button onclick="add('table1', true)">Insert</button>
<table id="table1">
<thead><tr><th>col1</th><th>col2</th></tr></thead>
<tbody></tbody>
</table>
</div>
<div>Events from table
<button onclick="add('table2', false)">Insert</button>
<table id="table2">
<thead><tr><th>col1</th><th>col2</th></tr></thead>
<tbody></tbody>
</table>
</div>
<template id="templ"><tr><td></td><td><button>click me</button></td></tr></template>
</div>
Related
I've been having issues trying to call a php script via javascript when the user changes a value in the "Assigned To Group" selection. Which is ultimately supposed to change the option list of, a not yet created, "Assign to User" selection.
I keep getting an error saying that it doesn't recognize the function's name. When I tried running a simple value change and alert to verify it could get the values, it recognized it and it updated accordingly. When I added the Ajax command is when it started not recognizing it. I'm sure I'm probably just using incorrectly, somehow, sense I've never used ajax before. But from the samples I've seen, it seems fairly straight forward.
Error: Uncaught ReferenceError: onChangeAssignedGroup is not defined at HTMLSelectElement.onchange
<?php
include('classes/class.User.php');
include('classes/class.Role.php');
include('classes/class.User_Role.php');
include('constants.php');
session_start();
?>
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
function onChangeAssignedGroup() {
var new_assigned_to_role_id = document.getElementById("option_list_assigned_to_role_id").value;
document.getElementById("assignedGroupId").innerHTML = "You selected: " + new_assigned_to_role_id;
alert(new_assigned_to_role_id);
$.ajax({
method: "POST",
url: "ticket_details.php",
data:{
ticket_id:$_POST['ticket_id'];
creator_user_id:$_POST['creator_user_id'];
creator_user_name:$_POST['creator_user_name'];
status:$_POST['status'];
priority:$_POST['priority'];
title:$_POST['title'];
assigned_to_role_id:new_assigned_to_role_id;
assigned_to_role_name:"";
assigned_to_user_id:$_POST['assigned_to_user_id'];
assigned_to_user_name:$_POST['assigned_to_user_name'];
},
success: function () {
alert('form was submitted');
}
});
}
</script>
</head>
<body>
<p>Return to Tickets</p>
<?php
if(isset($_POST['submit']) or isset($_POST['submit_new_comment']) or isset($_POST['submit_update_ticket'])){
$ticket_id = $_POST['ticket_id'];
$creator_user_id = $_POST['creator_user_id'];
$creator_user_name = $_POST['creator_user_name'];
$status = $_POST['status'];
$priority = $_POST['priority'];
$title = $_POST['title'];
$assigned_to_role_id = $_POST['assigned_to_role_id'];
$assigned_to_role_name = $_POST['assigned_to_role_name'];
$assigned_to_user_id = $_POST['assigned_to_user_id'];
$assigned_to_user_name = $_POST['assigned_to_user_name'];
//connect to database
include("database_connection.php");
//handle update to ticket
if(isset($_POST['submit_update_ticket'])){
$update = $mysqli->query("UPDATE `ticket` SET `status` = '$status', `priority` = '$priority',
`assigned_to_role_id` = '$assigned_to_role_id', `assigned_to_role_name` = '$assigned_to_role_name',
`assigned_to_user_id` = '$assigned_to_user_id', `assigned_to_user_name` = '$assigned_to_user_name'
WHERE `ticket`.`id` = $ticket_id");
if(!$update){
echo"<p>".$mysqli->error."</p>";
}
}
//handle new comment
if(isset($_POST['submit_new_comment'])){
$new_comment = $_POST['new_comment'];
$current_id = $_SESSION['user']->getId();
$current_username = $_SESSION['user']->getUsername();
//sanitize data
$new_comment = $mysqli->real_escape_string($new_comment);
unset($_POST['submit_new_comment']);
//insert new comment into database.
$insert = $mysqli->query("INSERT INTO ticket_comment (ticket_id, user_id, user_name, text) VALUES ('$ticket_id', '$current_id', '$current_username', '$new_comment')");
if(!$insert){
echo"<p>".$mysqli->error."</p>";
}
}
//include arrays for converting values returned
include("value_maps.php");
echo "<p id='assignedGroupId'></p>";
echo "<p>role id:".$assigned_to_role_id."</p>";
echo "<p>role name:".$assigned_to_role_name."</p>";
if(in_array($assigned_to_role_id,$_SESSION['user']->getRoles())){
echo "<p>you have this role.</p>";
} else {
echo "<p>you don't have this role.</p>";
}
print_r($_SESSION['user']->getRoles());
echo"
<form action='' method='post'>
<input type='hidden' name='ticket_id' value='$ticket_id'>
<input type='hidden' name='creator_user_id' value='$creator_user_id'>
<input type='hidden' name='creator_user_name' value='$creator_user_name'>
<input type='hidden' name='title' value='$title'>
<input type='hidden' name='assigned_to_role_id' value='$assigned_to_role_id'>
<input type='hidden' name='assigned_to_role_name' value='$assigned_to_role_name'>
<input type='hidden' name='assigned_to_user_id' value='$assigned_to_user_id'>
<input type='hidden' name='assigned_to_user_name' value='$assigned_to_user_name'>
<table border='0' align='center' cellpadding='5'>
<tr>
<th>Ticket ID</th>
<th>Title</th>
<th>Status</th>
<th>Priority</th>
<th>Assigned To Group</th>
<th>Assigned To User</th>
</tr>
<tr>
<td>$ticket_id</td>
<td>$title</td>";
if(in_array($assigned_to_role_id,$_SESSION['user']->getRoles()) or in_array(ROLE_ID_ADMIN,$_SESSION['user']->getRoles())){
echo "<td><select name='status'>";
$status_index = 0;
foreach($status_array as $status_choice){
if($status == $status_index){
echo "<option value='". $status_index."' selected>". $status_choice ."</option>";
} else {
echo "<option value='". $status_index."'>". $status_choice ."</option>";
}
$status_index++;
}
echo "</select></th>";
echo "<td><select name='priority'>";
$priority_index = 0;
foreach($priority_array as $priority_choice){
if($priority == $priority_index){
echo "<option value='". $priority_index."' selected>". $priority_choice ."</option>";
} else {
echo "<option value='". $priority_index."'>". $priority_choice ."</option>";
}
$priority_index++;
}
echo "</select></th>";
} else {
echo "<td>".$status_array[$status]."</th>";
echo "<td>".$priority_array[$priority]."</th>";
}
if(in_array(ROLE_ID_ADMIN,$_SESSION['user']->getRoles())){
echo "<td><select id='option_list_assigned_to_role_id' name='assigned_to_role' onchange='onChangeAssignedGroup()'>";
foreach($_SESSION['roles'] as $assigned_to_role_choice){
if($assigned_to_role_id == $assigned_to_role_choice->getId()){
echo "<option value='". $assigned_to_role_choice->getId()."' selected>". $assigned_to_role_choice->getName() ."</option>";
} else {
echo "<option value='". $assigned_to_role_choice->getId()."'>". $assigned_to_role_choice->getName() ."</option>";
}
}
echo "</select></td>";
} else {
echo "<td>$assigned_to_role_name</td>";
echo "<td>$assigned_to_user_name</td>";
}
echo"
</tr>
<tr>
<td colspan='5'></td>
<td><input type='submit' name='submit_update_ticket' value='Update Ticket Details' required></td>
</tr>
</table>
</form>
";
//get back ticket details
$results = $mysqli->query("SELECT `id`,`ticket_id`,`user_id`,`user_name`,`text`,`create_date`,`modify_date` FROM `ticket_comment` WHERE `ticket_id` = ".$ticket_id." ORDER BY `create_date`");
//if insert was successful
if($results){
//header('location:registration_email_sent.php');
if ($results->num_rows > 0){
echo "
<table border='0' align='center' cellpadding='5'>
<tr>
<th>Username</th>
<th>Comment</th>
</tr>
";
while($row = $results->fetch_row()){
echo"
<tr>
<td>".$row[3].": </td>
<td>".$row[4]."</td>
</tr>";
}
} else {
echo "<p>No comments found. </p>";
}
}
$mysqli->close();
echo"
<form method='post' action=''>
<input type='hidden' name='ticket_id' value='$ticket_id'>
<input type='hidden' name='creator_user_id' value='$creator_user_id'>
<input type='hidden' name='creator_user_name' value='$creator_user_name'>
<input type='hidden' name='status' value='$status'>
<input type='hidden' name='priority' value='$priority'>
<input type='hidden' name='title' value='$title'>
<input type='hidden' name='assigned_to_role_id' value='$assigned_to_role_id'>
<input type='hidden' name='assigned_to_role_name' value='$assigned_to_role_name'>
<input type='hidden' name='assigned_to_user_id' value='$assigned_to_user_id'>
<input type='hidden' name='assigned_to_user_name' value='$assigned_to_user_name'>
<table border='0' align='center' cellpadding='5'>
<tr>
<th>New Comment</th>
<th><input type='submit' name='submit_new_comment' value='Post New Comment'></th>
</tr>
<tr>
<td colspan='2'><textarea name='new_comment' rows='10' cols='30' placeholder='New Comment Here' required></textarea></td>
</tr>
</table>
</form>
";
}
?>
</body>
</html>
In the data object in your ajax request, you need to replace the semicolons with commas.
You should also always use prepared statements to interact with the database.
Following this link here about sending data into MySQL using AJAX, I have this output:
What I want, is to see the row with the curent rows shown in the div and not at the bottom. And how to refresh the sum, and not wait to refresh the page ?
Here is the final AJAX code:
function addFunction()
{
var selectW = $('#insert_new').val();
var selectW = $('#selectW').val();
var select_at = $('#select_at').val();
var pay = $('#pay').val();
var facture = $('#facture').val();
var select_opt = $('#select_opt').val();
if(pay!="")
{
$.ajax({
data: {'selectW': selectW, 'select_at': select_at, 'pay': pay, 'facture': facture, 'select_opt': select_opt},
type: "post",
url: "insert_buy.php",
success: function(response){
if(response=="success")
{
$('#incident_table').append('<tr><td height="30" align="center">' + selectW + '</td><td align="center">' + select_at + '</td> <td align="center" dir="ltr">' + pay + '</td> <td align="center">' + facture + '</td> <td align="center"><form action="delete.php" method="post"><input type="hidden" name="rowid" value="" /><input class="imgClass_dell" type="submit" onclick="return confirm(\'هل أنت متأكد؟\')" name="delete_sales" value="" /></form></td></tr>');
alert(data);
$('#selectW').val('');
$('#select_at').val('');
$('#pay').val('');
$('#facture').val('');
$('#select_opt').val('');
}
else
{
alert("No Data added");
}
},
error: function(){
//alert('error; ' + eval(error));
}
});
}
else
{
alert("All Fields Are Required!!");
}
}
And here is where PHP calculate the sum:
</tr>
</form>
<?php
$sum = 0;
$selectAll = "SELECT * FROM sales WHERE date_now = :date ORDER BY date_now DESC, time_now DESC";
$stmtAll=$conn->prepare($selectAll);
$stmtAll->bindValue(':date', date("y-m-d"));
$execAll=$stmtAll->execute();
$result=$stmtAll->fetchAll();
?>
<?php foreach($result as $rows){
$sum = $sum + $rows['pay'];
//var_Dump($rows) ?>
<tr>
<td height="30" align="center"><?php echo $rows['type'] ?></td>
<td align="center"><?php echo $rows['provider'] ?></td>
<td align="center" dir="ltr"><?php echo (number_format($rows['pay'], 0, ',', ' ')). ' L.L'?></td>
<td align="center"><?php echo $rows['facture'] ?></td>
<td align="center"><form action='delete.php' method="post">
<input type="hidden" name="rowid" value="<?php echo $rows['id'] ?>" />
<input class="imgClass_dell" type="submit" onclick="return confirm('هل أنت متأكد؟')" name="delete_sales" value="" />
</form></td>
</tr>
<?php } ?>
<tr>
<th colspan="4" align="center" bgcolor="#666666">المجموع</th>
<td dir="ltr" bgcolor="#666666" align="center"><?php
echo ($sum = number_format($sum, 0, ',', ' ')). ' L.L';
?></td>
</tr>
</table>
</div>
</div>
I hope I can get some help.
you can try with this
You'll need a getTable.php page that displays your table, and nothing else: no headers, footers, etc.
PHP (getTable.php) - this can be any server side code (asp, html, etc..)
<?php
echo '<table><tr><td>TEST</td></tr></table>';
?>
Then, in your JS, you can easily refresh the table by using the load() method:
HTML
<div id="tableHolder"></div>
js
<script type="text/javascript">
$(document).ready(function(){
refreshTable();
});
function refreshTable(){
$('#tableHolder').load('getTable.php', function(){
setTimeout(refreshTable, 5000);
});
}
</script>
try and good luck i prefer work with jqgrid
When i click first row it shows the output.
When i click second, it is also showing, but the first row is not hided.
It's still displaying.
It should happen for all the rows, not only the first two.
JavaScript code:
$('#table_struct tr').click(function() {
var $this = $(this);
var offset = $this.offset();
var height = $this.height();
var order_id = $this.data('order_id');
$('.menu').remove();
$.get('getuser.php?order_id=' + order_id, function(table) {
$('#showmenu').append(table);
$('.menu').css({
right: offset.right,
top: offset.top+height
});
});
});
index.php
include "db.php";
$query = "select * from orders_list";
$result = mysql_query($query);
$num_rows = mysql_num_rows($result);
if($num_rows >= 1)
{
echo "<div id='showmenu' class='scroll'>";
echo "<table id='table_struct' cellspacing='0' cellpadding='1' border='1' width='400' height='30'>
<tr class='tr_class' bgcolor='white'>
<td align='center' style='font-weight:bold'> Select </td>
<td align='center' style='font-weight:bold'> order_id </td>
<td align='center' style='font-weight:bold'> customer_name </td>
<td align='center' style='font-weight:bold'> no_of_pack </td>
<td align='center' style='font-weight:bold'> price </td>
<td align='center' style='font-weight:bold'> Weight </td>
<td align='center' style='font-weight:bold'> payment mode </td>
</tr>";
while($row = mysql_fetch_array($result))
{
$order_id = $row['order_id'];
$_SESSION['order_id'] = $order_id;
echo "<tr height='20' data-order_id='".$row['order_id']."'>
<td align='center'><input type='checkbox' class='case' name='case' value='1'></td>
<td align='center'>".$row['order_id']."</td>
<td align='center'>".$row['customer_name']."</td>
<td align='center'>".$row['number_of_pack']."</td>
<td align='center'>".$row['price']."</td>
<td align='center'>".$row['weight']."</td>
<td align='center'>".$row['payment']."</td>";
echo "</tr>";
}
echo "</table>";
echo "</div>";
}
if(!mysql_close($con))
{
echo "failed to close";
}
getuser.php
include "db.php";
$order_id = intval($_GET['order_id']);
$query = "select * from orders_details where order_id=$order_id";
$result = mysql_query($query);
$num_rows = mysql_num_rows($result);
if($num_rows >= 1)
{
echo "<div class='menu' class='scroll'>";
echo "<table id='table_struct' cellspacing='0' cellpadding='1' border='1' width='650' height='30'>
<tr class='tr_class' bgcolor='white'>
<td align='center' style='font-weight:bold'> Product </td>
<td align='center' style='font-weight:bold'> Quantity </td>
<td align='center' style='font-weight:bold'> Sku </td>
<td align='center' style='font-weight:bold'> Price </td>
<td align='center' style='font-weight:bold'> Total </td>
</tr>";
while($row = mysql_fetch_array($result))
{
echo "<tr height='30'>
<td align='center'>".$row['product']."</td>
<td align='center'>".$row['quantity']."</td>
<td align='center'>".$row['sku']."</td>
<td align='center'>".$row['price']."</td>
<td align='center'>".$row['total']."</td>";
echo "</tr>";
}
echo "</table>";
echo "</div>";
}
JQuery has a previous selector...maybe you can use that?
Code taken from jquery documentation page: $( "li.third-item" ).prev().css( "background-color", "red" );
Basically you could do: $('something').click(function() { $(this).prev().hide(); }) or $(this).parent().prev().hide();
I'm not completely sure how PHP works, but if the table you are making is being made dynamicaly (after your javascript has run) then your jquery selector isn't working..
$('#table_struct tr').click(function()
Use jquery to select the table's container and apply like this instead!
$('#tableContainer').on('click', 'tr', function(){/*things*/})
By binding the click-event on a "container"s any given child, you know that even if things are added to the container after the pageLoad, the elements will be clickable as the event is bound to the parent, not the element itself.
I want to submit a form after some interval periodically.
I have tried as follows.
<script language="JavaScript">
function fncAutoSubmitForm()
{
//alert('test alert');
alert("B : "+document.getElementById('myform').id);
document.getElementById('myform').submit();
alert("A : "+document.getElementById('myform').id);
setTimeout("fncAutoSubmitForm();",5000);}
</script>
displayPage.php code as follows
<body onload="fncAutoSubmitForm();">
<form id="myform" name="myform" action="code.php" method="post">
some controls
</form>
</body>
here, "displayPage.php" submits the page to "code.php"
"code.php" performs required action and redirects to "displayPage.php"
It works fine when I dont use autosubmit. i.e. fncAutoSubmitForm() function
but when I use fncAutoSubmitForm() "displayPage.php" disappears
here is the actual code
<form action="code.php" method="post" id="myform" name="myform" onload='setGenLeadId();'>
<tr><td colspan="2"><?php if($row1['lead_call_type']=="C"){echo"<font color=red>CALLBACK Lead</font>";}?></td>
<td align = "right"><strong>Lead Id :</strong> </td>
<!--<td><b><font color="red"></font>Reference Number</b></td>-->
<td align="left"><?php echo "" . $row1['lead_id'] ."";?></td>
</tr>
<tr>
<td align="right" ><b>Name :</b></td>
<td align="left"><input name="custname" id="custname" class="textbox" style="width: 100%;height: 25%;" maxlength="140" type="text" value="<?php echo htmlspecialchars($row1['lead_fname'])?>"></td>
<td align="right"><b>Phone :</b></td>
<td align="left"><input name="phone" id="phone" style="width: 100%;height: 25%;" maxlength="10" type="text" value = "<?php echo "" . $row1['lead_phone1'] ."";?>" ></td>
</tr>
<tr>
<td align="right"><b>City :</b></td>
<td align="left">
<input name="city" id="city" class="textbox" style="width: 100%;height: 25%;" maxlength="140" type="text" value="<?php echo "" . $row1['lead_city'] ."";?>">
</td>
<td align="right"><b>State :</b></td>
<td align="left" >
<input name="state" id="state" class="textbox" style="width: 100%;height: 25%;" maxlength="140" type="text" value="<?php echo "" . $row1['lead_state'] ."";?>">
</td>
</tr>
<tr>
<td align="right"><b>Email-ID :</b></td>
<td align="left" ><input name="email" id="email" style="width: 100%;height: 25%;" class="textbox" type="text" value = "<?php echo "" . $row1['lead_email'] ."";?>"></td>
<td align="right"><b>Source </b></td>
<td ><input type="text" name="source" id = "source" style ="width:100%;resize: none;" maxlength="900" value="<?php echo "". $row1['lead_source'] ."";?>"></td>
</tr>
<tr>
<td align="right"><b>Address : </b></td>
<td>
<textarea type="text" name="address" id = "address" style ="width:100%;resize: none;" maxlength="900" ><?php echo "". $row1['lead_address1'] ."";?></textarea>
</td>
<td align="right"><b>Zip Code :</b></td>
<td align="left"><input name="zip" id="zip" class="textbox" style="width: 100%;height: 25%;" maxlength="140" type="text" value="<?php echo htmlspecialchars($row1['lead_zip'])?>"></td>
<!--<td align="right"><b>Phone :</b></td>
<td align="left"><input name="phone" id="phone" style="width: 100%;height: 25%;" maxlength="10" type="text" value = "<?php //echo "" . $row1['lead_phone1'] ."";?>" ></td>-->
</tr>
<tr>
<td align="right"><b>Rounds :</b></td>
<td>
<?php
$query = mysql_query("SELECT param_field_value,param_field_itemdata FROM cti_service_parameters where param_service_id=$service_id and param_field_name='rounds'");
$k=0;
echo "<select style='width: 100%;' id='rounds' name ='rounds'>";
echo "<option value=".$row1['lead_rounds']." selected>".$row1['lead_rounds']."</option>";
while($row = mysql_fetch_array($query))
{
$value[$k] = $row['param_field_value'];
$item[$k] = $row['param_field_itemdata'];
if($field_val == $item[$k])
echo "<option value='$value[$k]' selected>$value[$k]</option>";
else
echo "<option value='$value[$k]'>$value[$k]</option>";
$k = $k + 1;
}
echo "</select>";
?>
</td>
<td align="right"><b>Preparing For IIT-JEE :</b></td>
<td align="left">
<?php
$query = mysql_query("SELECT param_field_value,param_field_itemdata FROM cti_service_parameters where param_service_id=$service_id and param_field_name='IIT-JEE'");
$k=0;
echo "<select style='width: 100%;' id='PrepIIT' name ='PrepIIT'>";
echo "<option value=".$row1['lead_prep_iit']." selected>".$row1['lead_prep_iit']."</option>";
while($row = mysql_fetch_array($query))
{
$value[$k] = $row['param_field_value'];
$item[$k] = $row['param_field_itemdata'];
if($field_val == $item[$k])
echo "<option value='$value[$k]' selected>$value[$k]</option>";
else
echo "<option value='$value[$k]'>$value[$k]</option>";
$k = $k + 1;
}
echo "</select>";
?>
</td>
</tr>
<tr>
<td align="right"><b>Which Standard :</b></td>
<td align="left" >
<?php
$query = mysql_query("SELECT param_field_value,param_field_itemdata FROM cti_service_parameters where param_service_id=$service_id and param_field_name='standered'");
$k=0;
echo "<select style='width: 100%;' id='standared' name ='standared'>";
echo "<option value=".$row1['lead_standared']." selected>".$row1['lead_standared']."</option>";
while($row = mysql_fetch_array($query))
{
$value[$k] = $row['param_field_value'];
$item[$k] = $row['param_field_itemdata'];
if($field_val == $item[$k])
echo "<option value='$value[$k]' selected>$value[$k]</option>";
else
echo "<option value='$value[$k]'>$value[$k]</option>";
$k = $k + 1;
}
echo "</select>";
?>
</td>
<td align="right"><b>Promo DVD :</b></td>
<td align="left">
<?php
$query = mysql_query("SELECT param_field_value,param_field_itemdata FROM cti_service_parameters where param_service_id=$service_id and param_field_name='PromoDVD'");
$k=0;
echo "<select style='width: 100%;' id='dvd' name ='dvd'>";
echo "<option value=".$row1['lead_dvd']." selected>".$row1['lead_dvd']."</option>";
while($row = mysql_fetch_array($query))
{
$value[$k] = $row['param_field_value'];
$item[$k] = $row['param_field_itemdata'];
if($field_val == $item[$k])
echo "<option value='$value[$k]' selected>$value[$k]</option>";
else
echo "<option value='$value[$k]'>$value[$k]</option>";
$k = $k + 1;
}
echo "</select>";
?>
</td>
</tr>
<tr>
<td align="right"><b>Percentage in 10th :</b></td>
<td align="left" ><input name="tenth" id="tenth" maxlength="5" style="width: 100%;height: 25%;" class="textbox" type="text" value = "<?php echo "" . $row1['lead_tenth'] ."";?>"></td>
<td align="right"><b>Percentage in 12th :</b></td>
<td align="left" ><input name="twelth" id="twelth" maxlength="5" style="width: 100%;height: 25%;" class="textbox" type="text" value = "<?php echo "" . $row1['lead_twelth'] ."";?>"> </td>
<!--<td align="right"><b>Time of Call</b></td>
<td align="left" ><input name="calltime" id="calltime" style="width: 100%;height: 25%;" class="textbox" type="text" value = "<?php// echo "" . $row1['lead_import_batch_start_date'] ."";?>" readonly> </td> -->
</tr>
<tr>
<td align="right"><b>JEE appearing year :</b></td>
<td align="left" >
<?php
$query = mysql_query("SELECT param_field_value,param_field_itemdata FROM cti_service_parameters where param_service_id=$service_id and param_field_name='JeeYear'");
$k=0;
echo "<select style='width: 100%;' id='jeeyear' name ='jeeyear'>";
echo "<option value=".$row1['lead_jee_year']." selected>".$row1['lead_jee_year']."</option>";
while($row = mysql_fetch_array($query))
{
$value[$k] = $row['param_field_value'];
$item[$k] = $row['param_field_itemdata'];
if($field_val == $item[$k])
echo "<option value='$value[$k]' selected>$value[$k]</option>";
else
echo "<option value='$value[$k]'>$value[$k]</option>";
$k = $k + 1;
}
echo "</select>";
?>
</td>
<td align="right"><b>Joined any classes :</b></td>
<td align="left">
<?php
$query = mysql_query("SELECT param_field_value,param_field_itemdata FROM cti_service_parameters where param_service_id=$service_id and param_field_name='JoinedClasses'");
$k=0;
echo "<select style='width: 100%;' id='classes' name ='classes'>";
echo "<option value=".$row1['lead_classes']." selected>".$row1['lead_classes']."</option>";
while($row = mysql_fetch_array($query))
{
$value[$k] = $row['param_field_value'];
$item[$k] = $row['param_field_itemdata'];
if($field_val == $item[$k])
echo "<option value='$value[$k]' selected>$value[$k]</option>";
else
echo "<option value='$value[$k]'>$value[$k]</option>";
$k = $k + 1;
}
echo "</select>";
?>
</td>
</tr>
<tr>
<td align="right"><b>Remarks :</b></td>
<td colspan="3"><textarea type="text" name="remarks" id = "remarks" style ="width:100%;resize: none;" maxlength="900" ><?php echo "". $row1['lead_remarks'] ."";?></textarea> </td>
</tr>
<tr>
<td colspan=4 class="tableHeading">
<!--<b><font color="red">Note : Fields with * are Mandatory</font></b>-->
</td>
</tr>
<!--<input type="hidden" id="clinicFlag" name="clinicFlag" value="<?php// echo $_GET["clinicFlag"]?>">-->
<tr>
<tr>
<td colspan=4 style="padding:0px">
<div align="center">
<input title="Save [Alt+S]" accessKey="S" class="crmbutton small save" type="button" name="save" value=" Save " style="width:100px;height:30px" >
</td>
</div>
</tr>
</table>
</div>
and Code.php code is as follows
<?php
//session_start();
//echo $_SESSION['user'];
include("connection.php");
$lead = $_POST['lead'];
$callnumber = $_POST['callnumber'];
$service = $_POST['service'];
$lead_fname = $_POST['custname'];
$lead_phone1 = $_POST['phone'];
$lead_city = $_POST['city'];
$lead_email = $_POST['email'];
$lead_state = $_POST['state'];
$lead_address1 = $_POST['address'];
$lead_zip = $_POST['zip'];
$lead_rounds = $_POST['rounds'];
$lead_IIT = $_POST['PrepIIT'];
$lead_standared = $_POST['standared'];
$lead_dvd = $_POST['dvd'];
$lead_tenth = $_POST['tenth'];
$lead_twelth = $_POST['twelth'];
$lead_jee_year = $_POST['jeeyear'];
$lead_classes = $_POST['classes'];
$lead_remarks = $_POST['remarks'];
$lead_source = $_POST['source'];
if($GLOBALS['database_type'] == "MySql")
{
$con=mysql_connect($GLOBALS['database_ip'],$GLOBALS['database_username'],$GLOBALS['database_password']);
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db($GLOBALS['database_name'],$con);
$sql1 = mysql_query("SELECT service_outbound_lead_dsn_string,
service_outbound_lead_db_user,
service_outbound_lead_db_password,
service_leadstructure_master_tablename,
service_outbound_lead_db_name
FROM cti_services WHERE service_id = $service");
while($row = mysql_fetch_array($sql1))
{
$lead_dsn = $row['service_outbound_lead_dsn_string'];
$lead_user = $row['service_outbound_lead_db_user'];
$lead_pwd = $row['service_outbound_lead_db_password'];
$lead_table = $row['service_leadstructure_master_tablename'];
$lead_db = $row['service_outbound_lead_db_name'];
}
if($_POST['save'])
{
//input_app_datetime = '$lead_appointment',
//input_app_reschedule = '$lead_reschedule',
mysql_select_db($GLOBALS['database_name'],$con);
$sqlquery = ("UPDATE $lead_db.$lead_table set lead_fname = '$lead_fname', lead_phone1 = '$lead_phone1', lead_email = '$lead_email', lead_remarks = '$lead_remarks', lead_address1 = '$lead_address1', lead_state = '$lead_state', lead_city = '$lead_city', lead_zip = '$lead_zip', lead_rounds ='$lead_rounds', lead_prep_iit ='$lead_IIT', lead_standared ='$lead_standared', lead_dvd ='$lead_dvd', lead_tenth ='$lead_tenth', lead_twelth ='$lead_twelth', lead_jee_year ='$lead_jee_year', lead_classes ='$lead_classes', lead_source ='$lead_source' WHERE lead_id=$lead");
$dbSql = mysql_query($sqlquery) or die("Error : " . mysql_error());
$sql="update cti_call_master set crm_remarks='$lead_remarks' where call_number=$callnumber";
$dbSql1 = mysql_query($sql);
//$flag = "saved";
$message = "Lead Id-".$lead." Data Saved .....";
//$message = $sqlquery;
//header("location:vision.php?LEADID=$lead&SERVICEID=$service&CALLNUMBER=$callnumber&MESSAGE=$message&FLAG=$flag&CLI=$lead_phone1&clinicFlag=$clinicFlag&alterno=$alter_no");
header("location:displayPage.php?LEADID=$lead&SERVICEID=$service&CALLNUMBER=$callnumber&MESSAGE=$message&FLAG=$flag&CLI=$lead_phone1");
}
}
?>
You can call the following function at 'onload' event. It will submit the form after 5 second to your code.php
function fncAutoSubmitForm() {
setTimeout(function(){
document.getElementById('myform').submit();
}, 5000);
}
Then your code.php will process the form action and redirect it back to displayPage.php.
Can you check if your form is not submitted at all to code.php or it is being submitted to code.php and due to some error it fails to redirect back to displayPage.php. In the later case you can turn ON the display error settings if it is not already ON. Use following in code.php to enable:
error_reporting(E_ALL);
ini_set('display_errors',1);
It it doesn't help then pls provide the code to get the actual scenario here.
As you call fncAutoSubmitForm() onload of displayPage.php, it immediately triggers document.getElementById('myform').submit();
So you are redirected to code.php, the action of your form.
If you want a delay you should not apply fncAutoSubmitForm() onload of the page.
but more something like:
setTimeout("fncAutoSubmitForm();",5000);}
function fncAutoSubmitForm(){
document.getElementById('myform').submit();
}
But you won't stay on displayPage.php it will redirect you to code.php. If you want to always display the same page you needs to change the action target in your form.
Use jQuery :)
$(document).ready(function(){
setInterval(function(){
submit();
}, 1000);
});
function submit(){
var data;
// extract data from your form and save it to data variable
$.ajax({
type: "POST",
url: "some.php",
data: data
});
}
I'm trying to pull data from database into selectboxes, but when the data is pulled it goes into one 'td' and not into separate td's. I'm trying to achieve result as shown below
but I keep getting this result
here is my code
<?php
$data_array = array();
$result2 = mysql_query("SELECT * FROM `firefightersonscene`
JOIN `firefighterinfo` ON `firefightersonscene`.`FireFighterInfo_fighterID` = `firefighterinfo`.`fighterID`
JOIN `stationlocation` ON `firefighterinfo`.`StationLocation_locationID`=`stationlocation`.`locationID`
WHERE `IncidenceOfFire_incidentID`='$getIncID' ORDER BY `firstName`");
if(mysql_num_rows($result2) > 0)
{
while($rows2 = mysql_fetch_object($result2))
{
$data_array[] = $rows2;
}
}
?>
<form action="core_viewfireoccurrence.php?incidentID=<?php echo $rows->incidentID; ?>" method="post" class="view_occurrence_form">
<table id="myTable">
<thead>
<tr>
</tr>
</thead>
<tbody>
<tr>
<td class="count">1</td>
<td>
<?php
foreach($data_array as $rows2):
$fighterID = $rows2->FireFighterInfo_fighterID;
$results = mysql_query("SELECT `fighterID`, `firstName`, `middleName`, `lastName`, `stationlocation`.`exactlocation`
FROM `firefighterinfo`
JOIN `stationlocation` ON `firefighterinfo`.`StationLocation_locationID`=`stationlocation`.`locationID` ORDER BY `firstName`");
echo '<select name="fireman[]" required><option value=""></option>';
while($row = mysql_fetch_array($results))
{
if($row['fighterID'] == $fighterID)
echo '<option selected>'. $row['firstName']." ".$row['middleName']." ".$row['lastName'].", ".$row['exactlocation'].'</option>';
else
echo '<option>'. $row['firstName']." ".$row['middleName']." ".$row['lastName'].", ".$row['exactlocation'].'</option>';
}// end while
echo '</select><br>';
endforeach;
?>
</td>
<td>
<input type="button" value="X" class="removeVar"/>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>
<input type="button" id="addVar" value="Add Item"/>
</tr>
</tfoot>
</table>
</form>
JS CODE
<script type="text/javascript">
$('form').on('click', '.removeVar', function(){
$(this).closest('tr').remove();
$('.count').each(function(i){
$(this).text(i + 1);
});
});
//add a new node
$('#addVar').on('click', function(){
var varCount = $('#myTable tr').length - 1;
$node = ['<tr>',
'<td class="count">'+varCount+'</td>',
'<td><select name="fireman[]" class="ctlGroup" required>',
'<option value=""></option>',
'<?php require("php/fireman_list.php"); ?>',
'</select></td>',
'<td><input type="button" value="X" class="removeVar"/>',
'</td></tr>'].join('\n');
$('#myTable > tbody:last').append($node);
});
</script>
You need to put your whole table row in the loop. You will also need to add a variable to count the row number for you.
<?php
$row =1;
foreach($data_array as $rows2):
?>
<tr>
<td class="count"><?php echo $row; ?></td>
<td>
<?php
$fighterID = $rows2->FireFighterInfo_fighterID;
$results = mysql_query("SELECT `fighterID`, `firstName`, `middleName`, `lastName`, `stationlocation`.`exactlocation`
FROM `firefighterinfo`
JOIN `stationlocation` ON `firefighterinfo`.`StationLocation_locationID`=`stationlocation`.`locationID` ORDER BY `firstName`");
echo '<select name="fireman[]" required><option value=""></option>';
while($row = mysql_fetch_array($results))
{
if($row['fighterID'] == $fighterID)
echo '<option selected>'. $row['firstName']." ".$row['middleName']." ".$row['lastName'].", ".$row['exactlocation'].'</option>';
else
echo '<option>'. $row['firstName']." ".$row['middleName']." ".$row['lastName'].", ".$row['exactlocation'].'</option>';
}// end while
echo '</select><br>';
?>
</td>
<td>
<input type="button" value="X" class="removeVar"/>
</td>
</tr>
<?php
$row++;
endforeach;
?>