I am trying to insert/submit the form data to XML but it is not saving anything into the XML file.. currently only sending the Latitude line to get it to work.
I've been working off the GitHub Geocomplete form scripts and attempting to add a send data to XML script but i can't see what is missing?
INDEX.PHP
<!DOCTYPE html>
<html>
<head>
<title>$.geocomplete()</title>
<meta charset="UTF-8">
<style type="text/css" media="screen">
form { width: 300px; float: left; }
fieldset { width: 320px; margin-top: 20px}
fieldset strong { display: block; margin: 0.5em 0 0em; }
fieldset input { width: 95%; }
ul span { color: #999; }
</style>
</head>
<body>
<?php
$xmldoc = new DOMDocument();
$xmldoc->load('sample.xml', LIBXML_NOBLANKS);
$latitude = $xmldoc->firstChild->firstChild;
if($latitude!=null){
while($latitude!=null){
echo $latitude->textContent.'<br/>';
$latitude = $latitude->nextSibling;
}
}
?>
<div class="map_canvas"></div>
<form name='input' action='insert.php' method='post'>
<input id="geocomplete" type="text" placeholder="Type in an address" value="Empire State Bldg" />
<input id="find" type="button" value="find" />
<fieldset>
<h3>Address-Details</h3>
<label>Latitude</label>
<input name="latitude" type="text" value="">
<label>Longitude</label>
<input name="lng" type="text" value="">
<label>Formatted Address</label>
<input name="formatted_address" type="text" value="">
<label>Locality</label>
<input name="locality" type="text" value="">
</fieldset>
<input type='submit' value='send'/>
</form>
<script src="http://maps.googleapis.com/maps/api/js?key=API KEY sensor=false&libraries=places"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="findlocation/jquery.geocomplete.js"></script>
<script>
$(function(){
$("#geocomplete").geocomplete({
map: ".map_canvas",
details: "form",
types: ["geocode", "establishment"],
});
$("#find").click(function(){
$("#geocomplete").trigger("geocode");
});
});
</script>
</body>
</html>
INSERT.PHP
<?php
header('Location:index.php');
$xmldoc = new DOMDocument();
$xmldoc->load('sample.xml');
$newAct = $_POST['latitude'];
$root = $xmldoc->firstChild;
$newElement = $xmldoc->createElement('latitude');
$root->appendChild($newElement);
$newText = $xmldoc->createTextNode($newAct);
$newElement->appendChild($newText);
$xmldoc->save('sample.xml');
?>
SAMPLE.XML
<list>
<latitude></latitude>
<list>
There are a few problems with the code you had, so I'll post the code and comments in the code should help.
<!DOCTYPE html>
<html>
<head>
<title>$.geocomplete()</title>
<meta charset="UTF-8">
<style type="text/css" media="screen">
form {
width: 300px;
float: left;
}
fieldset {
width: 320px;
margin-top: 20px
}
fieldset strong {
display: block;
margin: 0.5em 0 0em;
}
fieldset input {
width: 95%;
}
ul span {
color: #999;
}
</style>
</head>
<body>
<?php
$xmldoc = new DOMDocument ();
$xmldoc->load ( 'sample.xml', LIBXML_NOBLANKS );
// Fetch the latitude - using getElementsByTagName is a quick way of getting the
// data for a known element
$latitude = $xmldoc->getElementsByTagName ( 'latitude' ) [0]->nodeValue;
?>
<div class="map_canvas"></div>
<form name='input' action='insert.php' method='post'>
<input id="geocomplete" type="text" placeholder="Type in an address"
value="Empire State Bldg" /> <input id="find" type="button"
value="find" />
<fieldset>
<h3>Address-Details</h3>
<label>Latitude</label>
<input name="latitude" type="text"
value="<?php echo $latitude; ?>">
<label>Longitude</label>
<input
name="lng" type="text" value="">
<label>Formatted Address</label>
<input
name="formatted_address" type="text" value="">
<label>Locality</label>
<input name="locality" type="text" value="">
</fieldset>
<input type='submit' value='send' />
</form>
<script
src="http://maps.googleapis.com/maps/api/js?key=API KEY sensor=false&libraries=places"></script>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="findlocation/jquery.geocomplete.js"></script>
<script>
$(function(){
$("#geocomplete").geocomplete({
map: ".map_canvas",
details: "form",
types: ["geocode", "establishment"],
});
$("#find").click(function(){
$("#geocomplete").trigger("geocode");
});
});
</script>
</body>
</html>
insert.php
As your XML already contained the latitude element, there was no need to create a new one.
<?php
if ( isset($_POST['latitude']) ){
$xmldoc = new DOMDocument();
$xmldoc->load('sample.xml');
// Fetch node to update (use [0] sd getElementsByTagName returns
// an array of matching nodes)
$latitude = $xmldoc->getElementsByTagName('latitude')[0];
// Set node value
$latitude->nodeValue = $_POST['latitude'];
$xmldoc->save('sample.xml');
}
// Now the data is processed, redirect to main page
header('Location:index.php');
sample.xml
(Note that your close list element was and not
<list>
<latitude></latitude>
</list>
Related
I'm creating a simple multi chat web application.i already created this system before that works well but later i made some changes in source code due to this
when i enter inputs it will store the same data more than once in the database at the same time the duplicates data are incremented themselves.please anyone help me to solve this problem
this is my index page
<?php include 'db.php';?>
<!DOCTYPE html>
<html>
<head>
<style>
#wraper{
height:550px;
width:100%;
}
#stage{
height:450px;
width:100%;
background-color:black;
color:white;
overflow:auto;
}
#pen
{
height:100px;
width:100%;
background-color:red;
}
</style>
<title>forum</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
</head>
<body>
<div id="wraper">
<div id="stage">message goes here</div>
<div id="pen">
<br>
<form id="image_form" method="post" enctype="multipart/form-data">
<input type="hidden" name="action" id="action" value="insert" />
<input type="hidden" name="image_id" id="image_id" />
<input type="hidden" name="user_id" id="user_id" value="<?php session_start(); echo $_SESSION['si']; ?>" />
<input type="text"
cols="40"
rows="5"
style="width:200px; height:50px;"
name="description"
id="description"
placeholder="say some thing"
autocomplete="off" required />
<input type="hidden" name="clock" id="clock" value="<?php echo date('Y-m-d H:i:s'); ?>" readonly="readonly" />
<input type="submit" name="insert" id="insert" value="Insert" class="btn btn-info" />
</form>
</div></div>
</body>
</html>
<script>
$(document).ready(function display_msg(){
var action = "fetch";
$.ajax({
url:"forum_action.php",
method:"POST",
data:{action:action},
success:function(data)
{
$('#stage').html(data);
var objDiv = document.getElementById("stage");
objDiv.scrollTop = objDiv.scrollHeight;
}
});
$('#image_form').submit(function(event){
event.preventDefault();
$.ajax({
url:"forum_action.php",
method:"POST",
data:new FormData(this),
contentType:false,
processData:false,
success:function(data)
{
//alert(data);
$('#image_form')[0].reset();
display_msg();
}
})
});
});
</script>
this is my action page
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
#container
{
height:70px;
width:50%;
color:white;
}
.usr_id
{
background-color:blue;
height:20px;
width:40%;
position:relative;
float:left;
border-radius: 15px 0 0 0;
}
.msg
{
background-color:green;
height:30px;
width:100%;
position:relative;
float:left;
border-radius:0 0 15px 15px;
}
.clock
{
background-color:purple;
height:20px;
width:60%;
position:relative;
float:left;
border-radius:0 15px 0 0;
text-align: right;
}
</style>
</head>
<body>
<?php
//action.php
if(isset($_POST["action"]))
{
$connect = mysqli_connect("localhost", "root", "", "flash");
//INSERTING MESSSA
if($_POST["action"] == "insert")
{
$name=$_POST['user_id'];
$des= $_POST['description'];
$clock=$_POST['clock'];
$query = "INSERT INTO forum(user_id,description,clock) VALUES ('$name','$des','$clock')";
if(mysqli_query($connect, $query))
{
echo 'Data Inserted into Database';
}
}
// FETCHING MESSAGES
if($_POST["action"] == "fetch")
{
$query = "SELECT * FROM forum ORDER BY id";
$result = mysqli_query($connect, $query);
$output = '
<div>
';
while($row = mysqli_fetch_array($result))
{
$output .= '
<div id="container">
<div class="usr_id">'.$row["user_id"].'</div>
<div class="clock">'.$row["clock"].'</div>
<div class="msg">'.$row["description"].'</div>
</div><br>
';
}
$output .= '</div>';
echo $output;
}
}
?>
</body>
</html>
You're facing this problem because, and without your knowledge, you just created recursive function, which is display_msg function. To avoid that behaviour, you should put the form submit event handler outside the document.ready event handler.
// implementation of the display_msg function
function display_msg(){
var action = "fetch";
$.ajax({
url:"forum_action.php",
method:"POST",
data:{action:action},
success:function(data)
{
$('#stage').html(data);
var objDiv = document.getElementById("stage");
objDiv.scrollTop = objDiv.scrollHeight;
}
}
// execute display_msg function when the document is loaded
$(document).ready(display_msg);
// attach submit event listener to #image_form
$('#image_form').submit(function(event){
event.preventDefault();
$.ajax({
url:"forum_action.php",
method:"POST",
data:new FormData(this),
contentType:false,
processData:false,
success:function(data)
{
//alert(data);
$('#image_form')[0].reset();
display_msg();
}
})
});
And now it should no longer insert the same data again and again, and you should insert that script before the body closing tag to ensure that all the elements in the page are loaded and accessible.
Ps: You're mixing pure JavaScript and jQuery and that's not a wise
choice, you should either use only one of them.
Hope I pushed you further.
I am using a map to obtain the co ordinates of the location, and get it on my text box named "add". When I try to insert the data obtained from the text box into the table it shows error.
This is my code below:
<html>
<head>
<link href="modal.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form action="" method="POST">
<table>
<tr><td>
</br>GIS Stamp</td>
<td><br><input type="text" name="add" id="add" size="31" value="" disabled="disabled"/><a href="#login_form" id="login_pop">
Select From MAP</a>
<div class="popup">
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var geocoder = new google.maps.Geocoder();
function geocodePosition(pos) {
geocoder.geocode({
latLng: pos
}, function(responses) {
if (responses && responses.length > 0) {
updateMarkerAddress(responses[0].formatted_address);
} else {
updateMarkerAddress('Cannot determine address at this location.');
}
});
}
function updateMarkerStatus(str) {
document.getElementById('markerStatus').innerHTML = str;
}
function updateMarkerPosition(latLng) {
document.getElementById('info').innerHTML = [
latLng.lat(),
latLng.lng()
].join(', ');
add.value=[
latLng.lat(),
latLng.lng()
].join(', ');
}
function updateMarkerAddress(str) {
document.getElementById('address').innerHTML = str;
}
function initialize() {
var latLng = new google.maps.LatLng(12.941320125683307, 74.86030859375);
var map = new google.maps.Map(document.getElementById('mapCanvas'), {
zoom: 8,
center: latLng,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
position: latLng,
title: 'Point A',
map: map,
draggable: true
});
// Update current position info.
updateMarkerPosition(latLng);
geocodePosition(latLng);
// Add dragging event listeners.
google.maps.event.addListener(marker, 'dragstart', function() {
updateMarkerAddress('Dragging...');
});
google.maps.event.addListener(marker, 'drag', function() {
updateMarkerStatus('Dragging...');
updateMarkerPosition(marker.getPosition());
});
google.maps.event.addListener(marker, 'dragend', function() {
updateMarkerStatus('Drag ended');
geocodePosition(marker.getPosition());
});
}
// Onload handler to fire off the app.
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<style>
#mapCanvas {
width: 500px;
height: 400px;
float: left;
}
#infoPanel {
display:none;
float: left;
margin-left: 10px;
}
#infoPanel div {
margin-bottom: 5px;
}
</style>
<div id="mapCanvas"></div>
<div id="infoPanel">
<b>Marker status:</b>
<div id="markerStatus"><i>Click and drag the marker.</i></div>
<b>Current position:</b>
<div id="info"></div>
<b>Closest matching address:</b>
<div id="address"></div>
</div>
</body>
</html>
<a class="close" href="#close"></a>
</div><br></td>
</tr>
<!-- panel with buttons -->
<tr><td>
<input type="submit" name="submit" value="Insert"></td></tr></table>
</body>
</form>
</html>
<?php
if(isset($_POST['submit']))
{
$add=$_POST['add'];
$c=mysql_connect("localhost","root","");
mysql_select_db("hudadb");
$ins=mysql_query("INSERT INTO `death`
(GIS)
VALUES ('$add')",$c) or die(mysql_error());
}
?>
The error I'm getting is:
Notice: Undefined index: add in D:\XAMPP\htdocs\hudaf\mainproj\s\s.php
Elements with Disabled attribute are not submitted or you can say their values are not posted.
Replace this line of code
<input type="text" name="add" id="add" size="31" value="" disabled="disabled"/>
with
<input type="text" name="add" id="add" size="31" value="" readonly/>
NOTE: Remember disabled field is not submitted with form submit, you need to use readonly for that.
I am trying to put on דוגמנות website that Simple PHP Upload Progress Bar script
APC is already installed on your server and I have tweaked my php.ini as described on the instructions.
apc.rfc1867 = on
Now the problem is that I am getting a %NaN instead of the real number from the upload process.
I know that this script IS working on some other servers so I am going to assume that there is no bug on the script and it's just something related to the php.ini or to the APC.
This is my upload.php file:
<?php
//get unique id
$up_id = uniqid();
//process the forms and upload the files
if ($_POST) {
//specify folder for file upload
$folder = "tmp/";
//specify redirect URL
$redirect = "upload.php?success";
//upload the file
move_uploaded_file($_FILES["file"]["tmp_name"], "$folder" . $_FILES["file"]["name"]);
//do whatever else needs to be done (insert information into database, etc...)
//redirect user
header('Location: '.$redirect); die;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Upload your file</title>
<!--Progress Bar and iframe Styling-->
<link href="style_progress.css" rel="stylesheet" type="text/css" />
<!--Get jQuery-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.js" type="text/javascript"></script>
<!--display bar only if file is chosen-->
<script>
$(document).ready(function() {
//show the progress bar only if a file field was clicked
var show_bar = 0;
$('input[type="file"]').click(function(){
show_bar = 1;
});
//show iframe on form submit
$("#form1").submit(function(){
if (show_bar === 1) {
$('#upload_frame').show();
function set () {
$('#upload_frame').attr('src','upload_frame.php?up_id=<?php echo $up_id; ?>');
}
setTimeout(set);
}
});
});
</script>
</head>
<body>
<h1>Upload your file </h1>
<div>
<?php if (isset($_GET['success'])) { ?>
<span class="notice">Your file has been uploaded.</span>
<?php } ?>
<form action="" method="post" enctype="multipart/form-data" name="form1" id="form1">
Name<br />
<input name="name" type="text" id="name"/>
<br />
<br />
Your email address <br />
<input name="email" type="text" id="email" size="35" />
<br />
<br />
Choose a file to upload
<br />
<!--APC hidden field-->
<input type="hidden" name="APC_UPLOAD_PROGRESS" id="progress_key" value="<?=$up_id?>"/>
<input name="file" type="file" id="file" size="30"/>
<!--Include the iframe-->
<br />
<iframe id="upload_frame" name="upload_frame" frameborder="0" border="0" src="" scrolling="no" scrollbar="no" > </iframe>
<br />
<input name="Submit" type="submit" id="submit" value="Submit" />
</form>
</div>
</body>
</html>
this is my upload_frame.php
<?php
$url = basename($_SERVER['SCRIPT_FILENAME']);
//Get file upload progress information.
if(isset($_GET['progress_key'])) {
$status = apc_fetch('upload_'.$_GET['progress_key']);
echo $status['current']/$status['total']*100;
die;
}
//
?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.js" type="text/javascript"></script>
<link href="style_progress.css" rel="stylesheet" type="text/css" />
<script>
$(document).ready(function() {
//
setInterval(function()
{
$.get("<?php echo $url; ?>?progress_key=<?php echo $_GET['up_id']; ?>&randval="+ Math.random(), {
//get request to the current URL (upload_frame.php) which calls the code at the top of the page. It checks the file's progress based on the file id "progress_key=" and returns the value with the function below:
},
function(data) //return information back from jQuery's get request
{
$('#progress_container').fadeIn(100); //fade in progress bar
$('#progress_bar').width(data +"%"); //set width of progress bar based on the $status value (set at the top of this page)
$('#progress_completed').html(parseInt(data) +"%"); //display the % completed within the progress bar
}
)},500); //Interval is set at 500 milliseconds (the progress bar will refresh every .5 seconds)
});
</script>
<body style="margin:0px">
<!--Progress bar divs-->
<div id="progress_container">
<div id="progress_bar">
<div id="progress_completed"></div>
</div>
</div>
<!---->
</body>
and this is my style_progress.css
/*iframe*/
#upload_frame {
border:0px;
height:40px;
width:400px;
display:none;
}
#progress_container {
width: 300px;
height: 30px;
border: 1px solid #CCCCCC;
background-color:#EBEBEB;
display: block;
margin:5px 0px -15px 0px;
}
#progress_bar {
position: relative;
height: 30px;
background-color: #F3631C;
width: 0%;
z-index:10;
}
#progress_completed {
font-size:16px;
z-index:40;
line-height:30px;
padding-left:4px;
color:#FFFFFF;
}
Let me know if there is a quick fix for that.
Where did you call apc_store()? I'm pretty sure this needs to be done before you can fetch the value using apc_fetch().
header.tpl(within /templetes)
---------------------------------------------
<HTML>
<HEAD>
<TITLE>{$title}</TITLE>
{literal}
<style type="text/css">
body{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#333333;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<style type="text/css">
* { font-family: Verdana; font-size: 96%; }
label { width: 10em; float: left; }
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; }
p { clear: both; }
.submit { margin-left: 12em; }
em { font-weight: bold; padding-right: 1em; vertical-align: top; }
</style>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
$("#commentForm").validate();
});
function ajaxFunction(){
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
}catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
}catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
}catch (e){
// Something went wrong
//alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data
// sent from the server and will update
// div section in the same page.
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.value = ajaxRequest.responseText;
}
}
// Now get the value from user and pass it to
// server script.
var cname = document.getElementById('cname').value;
var lname = document.getElementById('lname').value;
var date = document.getElementById('date').value;
var queryString = "?cname=" + cname ;
queryString += "&lname=" + lname + "&date=" + date;
ajaxRequest.onreadystatechange=stateChanged;
ajaxRequest.open("POST","demo/process.php?cname="+cname+"&lname="+lname+"&date="+date,true);
ajaxRequest.send(null);
}
</script>
{/literal}
</HEAD>
<BODY >
index.tpl like following
{include file="header.tpl" title= $title }
<h1>Login Form</h1>
<form class="cmxform" id="commentForm" >
<fieldset>
<p>
<label for="cname"> First Name</label>
<em>*</em><input id="cname" name="cname" size="25" class="required" minlength="2" />
</p>
<p>
<label for="lname">Last Name</label>
<em>*</em><input id="lname" name="lname" size="25" class="required" />
</p>
<p>
<label for="Date">Date</label>
<em>*</em><input id="date" name="date" size="25" class="required" value="" />
</p>
<p>
<input class="submit" type="submit" value="Submit" class="button" onclick='ajaxFunction()' />
</p>
</fieldset>
</form>
now i want to get the cname,lname,date in process.php. unfortuantely i am not getting it i tried lot
when i sumit in index.php i am not getting any values please guide me..........
Have you tried grabbing the values with $smarty->get_template_vars() (Smarty2) or $smarty->getTemplateVars() (Smarty3)?
Ok so here it is.
I have a index.php page. What it does is either make the html page or run a while loop.
It will only run the loop after you fill in some info and press a submit button on the html page. Now on the html page at the bottom i have it say "__ actions have been completed" with the blank being a variable that has 1 added to it each time the loop is run.
Now what i want to happen is that number to update everytime the loop is run. I have also been told to us ajax/jquery to do this but i have been unable to figure it out.
So what can i put in the while loop to have the variable update?
<?php
$number = $_POST['number'];
if(isset($number)){}
else{
$number = 0;
}
if(isset($_POST['Submit'])){
$MN = $_POST['MN'];
$count = $_POST['count'];
$provider = $_POST['provider'];
for ($i = 0; $i < $count; $i++) {
$m = rand(10e16, 10e20);
$n = base_convert(¤m, 10, 36);
$subject = $m;
$body = $n;
$number = $number + 1;
}
}
echo <<<END
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<body>
<form action="$PHP_SELF" method="post">
<center> <p>
<label><b><big><big><big><big><big><big><big>Page</big></big></big></big></big></big></big></b></label>
</p>
<p>
<p>
<label><strong><u>MN</u></label>
</p>
<input name="MN" type="text" value=""/>
</p>
<p>
<p>
<label><strong><u>Number to Send</u></label>
</p>
<input name="count" type="text" value = "1"/>
<input name = "number" type = "hidden" value = "$number"/>
</p>
<p>
<p>
<label><strong><u>Provider</u></label>
</p>
<select name="provider">
<option value="">Choose One...</option>
</select>
</p>
<p>
<input name = "Submit" type = "submit" value = "Send"></a>
</p>
<p>You have done {$number} actions</p>
</center>
</body></html>
</style>
</head>
<style type="text/css">
<!--
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
color: #FF0000;
background-color: #000000;
}
.style7 {color: #FF0000}
END;
?>
What you could do, is use a session variable to record the number of times the user has completed the action.
if (!$_SESSION["times"]) $_SESSION["times"] = 0;
else $_SESSION["times"]++
Then in the HTML, output that variable.
i have modified your code so it can use jquery ajax to submit the form
the response is a json string , we parse it with jquery to get an javascript object
this your form code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
color: #FF0000;
background-color: #000000;
}
.style7 {color: #FF0000}
</style>
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
$(function(){
$("#Submit").click(function(){
$.ajax({
url:"process.php",
type:"get",
data:$("form").serialize(),
success:function(response){
var obj = jQuery.parseJSON( response );
var success = obj.success;
var actionsNumber = obj.number;
$("#result").html('You have done '+actionsNumber+' actions');
}
})
})
})
</script>
</head>
<body>
<form action="" method="post">
<center> <p>
<label><b><big><big><big><big><big><big><big>Page</big></big></big></big></big></big></big></b></label>
</p>
<p>
<p>
<label><strong><u>MN</u></label>
</p>
<input name="MN" type="text" value=""/>
</p>
<p>
<p>
<label><strong><u>Number to Send</u></label>
</p>
<input name="count" type="text" value = "1"/>
<input name = "number" type = "hidden" value = "$number"/>
</p>
<p>
<p>
<label><strong><u>Provider</u></label>
</p>
<select name="provider">
<option value="">Choose One...</option>
</select>
</p>
<p>
<input id="Submit" type = "button" value = "Send">
</p>
<p id="result"></p>
</center>
</body></html>
and the code of process.php :
<?php session_start();
// process your form data as you do
//:::::::::
//
if(!isset($_SESSION['number'])){
$_SESSION['number'] = 0;
}
$number = $_SESSION['number']++;
// output json response
echo'{"success":"true","number":"'.$number.'"}';
?>
we store the number in the session and increment it every action ( call of process.php)
and update the paragraph id="result" with the response.number
hope that help
What you want to do isn't possible (well, not in the way you think).
If I had to do this as an absolute requirement (even though it stinks of poor design) I would do it like so:
Wherever your number is in the original output file, wrap it in a div or span and give it a unique id.
I would then use a session variable for your loop counter.
Finally, I would use jQuery with the timers plugin to fire off at 1 or 2 second intervals. Within the timer, you should call a .php file in the background that simply returns the value of the session variable.
Here's a bit of code to demonstrate:
(Edited to clarify based on comments below)
Here is a working example:
<?php
// main_page.php
session_start();
$_SESSION['loop_count'] = 0;
?>
<html>
<head>
<title>Background Updating Example</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="PATH_TO_YOUR_SCRIPTS/timers.jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
url: 'exec_loop.php',
success: function(data) {
$('#status_message').html("Loop started...");
}
});
$(document).everyTime(1000, function() {
$.ajax({
url: 'get_counter.php',
success: function(data) {
$('#counter_text').html(data);
}
});
});
});
</script>
</head>
<body>
The loop has executed <span id='counter_text'>0</span> times.
</body>
</html>
Then in the get_counter.php file, just do something like this:
<?php
// get_counter.php
session_start();
echo $_SESSION['loop_count'];
?>
Now for the loop file
<?php
// exec_loop.php
session_start();
for ($i = 0; $i < 50000000; $i++) {
$_SESSION['loop_count']++;
}
?>
Save these three files, and you'll get the result you desire.