I am trying to implement a very basic AJAX upload progress bar using the PECL uploadprogress extension. I have found this sample code which works across all browsers: http://svn.php.net/viewvc/pecl/uploadprogress/trunk/examples/. It uses iframes to write the updates to. I would like to get the updates and do some jquery to build a progress bar. Here is my code (I know I did not write in code to account for when the upload ends) client.php:
<?php
$id = md5(microtime() . rand());
?>
<!DOCTYPE html>
<html>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
function getProgress(){
$.get("progress.php", {"ID":'<?php echo $id ?>'}, function(data){
console.log(data);
});
window.setTimeout(getProgress(), 5000);
}
</script>
<body>
<form onsubmit="getProgress()" target="_self" enctype="multipart/form-data" method="post">
<input type="hidden" name="UPLOAD_IDENTIFIER" value="<?php echo $id;?>" />
<label>Select File:</label>
<input type="file" name="file" />
<br/>
<label>Select File:</label>
<input type="file" name="file2" />
<br/>
<label>Upload File:</label>
<input id="submitButton" type="submit" value="Upload File" />
</form>
</body>
</html>
And progress.php:
<?php
if (function_exists("uploadprogress_get_info")) {
$info = uploadprogress_get_info($_GET['ID']);
} else {
$info = false;
}
$progress = ($info['bytes_uploaded']/$info['bytes_total'])*100;
echo $progress;
I error out and all that prints is 0's. Any ideas?
Try replacing
$progress = ($info['bytes_uploaded']/$info['bytes_total'])*100;
with
$progress = ($info['bytes_uploaded']*100)/$info['bytes_total'];
Both $info['bytes_uploaded'] and $info['bytes_total'] are integers, so division is not a float but is rounded down to a integer.
Related
I'm working on a web application in php that allows users to upload files with a specified structure (file type could be cvs or excel sheets) and the app will extract data from the files and insert them into a database.
I can't get my app to upload files and I've been trying for 2 days, I checked the php.ini for max upload size ,max post size , file uploads on, temp directory set to /tmp which is accessible by all users.
I also checked the syntax of php and html and made sure I was using the right encoding type, I also checked the permissions of the upload directory but the _FILES variable is always empty, note : my web server is hosted on amazon ec2 running Ubuntu 14.04 LTS.
here's one of the codes I tried and it's output:
<?php
echo $_FILES['file']['error'];
print_r($_FILES);
echo $name = $_FILES['file']['name'];
?>
<html>
<header>
<title> Test Page</title>
</header>
<body>
<form action="Test.php" method="POST" enctype="multipart/formdata">
<input type="file" name="file" id="file" /><br><br>
<input type="submit" value="submit" />
</form>
</body>
<html>
and the outputted echo is only Array ( ) whether I upload a file or not.
anyone faced something like this before ?
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
session_start();
$file_tmp= $_FILES['image']['tmp_name'];
header("Test.php");
}
?>
<html>
<header>
<title> helllllllo </title>
</header>
<body>
<form action="form-validation" method="POST" enctype="multipart/form-data" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" >
<div class="form-row form-input-name-row">
<label>
<span>Profile Image</span>
<input type="file" name="image" id="file" onchange="readURL(this);" data-val="true" style="margin-bottom:10px;" />
<div class="form-row form-input-name-row">
<img id="blah" src="#" alt="your image" style="width: 100px; display: none; margin-bottom:10px;" />
</div>
</div>
<input type="submit" value="submit" />
</form>
<script>
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah').show().attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</body>
</html>
i have a simple website which is written by php and mysql code. i have a detect button on my my sql table query page and given below code is writen for this function but my problem is i need a popup window when the detect link is clicked. i have tired to set a code in my created code but i am not able .kindly please help me solve this problem.
<?php $sezione="home_admin"; if(isset($_POST['messaggio']))
$messaggio=$_POST['messaggio'];
include("control_admin..php");
$canc_id=$_GET['canc_id'];
$idcorsocanc=$_POST['idcorsocanc'];
$action=$_REQUEST['action'];?>
<?php
/*echo "permessi".$permessi;
echo "<br>id".$id_nome;*/
if($action=='canc'){?>
<h1>are you sure want to delect the course?</h1>
<form action="<?=$_SERVER['PHP_SELF']?>" method="post" name="canc1" style="float: left; margin-left:25px;">
<input type="hidden" name="idcorsocanc" value="<?=$canc_id?>">
<input type="hidden" name="action" value="">
<input type="submit" name="ok" value="Si,cancella" class="puls_invia">
</form>
<form action="<?=$_SERVER['PHP_SELF']?>" method="post" name="canc2" style="float: left; margin-left:25px;">
<input type="hidden" name="action" value="">
<input type="submit" name="ok" value="NO" class="puls_invia">
</form>
<?php
}
ok i want to update my question cause i follow one answer and here the code is-
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$('#ok').click(function(){
if(confirm('Are you sure ?')){
$('#form').submit();
}else{
return false;
}
});
});
</script>
</head>
<body>
<?php
if(isset($_POST['action'])){
if($_POST['action'] == 'deleted'){
//the form has been sent, do something
}
}else{
?>
<form action="<?=$_SERVER['PHP_SELF']?>" method="post" id="form">
<input type="button" id="ok" name="ok" value="Delete">
<input type="hidden" id="action" name="action" value="deleted">
</form>
<? } ?>
</body>
</html>
but till now my problem is i alreday have link name delect and if i click that link i saw another delete button cause now i use the following code which i just update then if i click there i saw the pop up window but if i click ok that course is not delete cause i guess something is missing.
my actual need is i alreday have delect link and i need something that if i click on that i saw one opoup window.just this is my need.
You need a client-side script to manage this. I'd recommend something in jQuery.
<script type="text/javascript">
$(document).ready(function(){
$(".myButton").click(triggerPopup);
})
function triggerPopup(){
//do popup stuff
}
</script>
an example in more details can be found by googling. something like this http://istockphp.com/jquery/creating-popup-div-with-jquery/
You should do this in javascript. Especially with jquery library
This should look like this :
<?php
include("control_admin.php");
$sezione = "home_admin";
$canc_id = $_GET['canc_id']; //i'm gessing this is the ID to delete ?
?>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$('#ok').click(function(){
if(confirm('Are you sure ?')){
$('#form').submit();
}else{
return false;
}
});
});
</script>
</head>
<body>
<?
if(isset($_POST['action'])){
if($_POST['action'] == 'deleted'){
$id = $_POST['id'];
$sql = "delete from table_name where column_id = ".$id;
mysql_query($sql);
echo $canc_id . ' has been deleted!';
}
}else{
?>
<form action="<?=$_SERVER['PHP_SELF']?>" method="post" id="form">
<input type="button" id="ok" name="ok" value="Delete">
<input type="hidden" id="action" name="action" value="deleted">
<input type="hidden" id="id" name="id" value="<?=$canc_id?>">
</form>
<? } ?>
</body>
</html>
I'm doing php that is textbox a value empty it will open a alertbox (I'm using javascript in here )
this is my code
<?php
include('config.php');
if(isset($_POST['submit'])){
$username=$_POST['username'];
?>
<script>
function validate(){
if(document.forms[0].username.value==""){
window.alert("You must enter both values");
return false;
}
}
</script>
<?php
}
?>
<html>
<div><p>Member Profile</p>
<form action="testing.php" method="POST" onsubmit="return validate();">
Username<br>
<input class="user" type="text" name="username" id="username" /><br>
<input type="submit" name="submit" value="register" />
</form>
</div>
</html>
The problem is i have to click 2 times before the alert show
please help me to solve this problem
It's because the script is inside the php if(isset){} block, one click submits the form, which generates the script and then it works the second time.. try this setup instead:
<?php
include ('config.php');
if (isset($_POST['submit']))
{
$username = $_POST['username'];
}
?>
<html>
<head>
<script>
function validate () {
if (document.forms[0].username.value == "") {
window.alert("You must enter both values");
return false;
}
}
</script>
</head>
<body>
<div>
<p>
Member Profile
</p>
<form action="testing.php" method="POST" onsubmit="return validate();">
Username
<br>
<input class="user" type="text" name="username" id="username" />
<br>
<input type="submit" name="submit" value="register" />
</form>
</div>
</body>
</html>
Edit:
I've moved the script tag inside the head tag. I'm not sure if there are any implications for having the script outside but just to be sure I've moved it.
2nd Edit: (OCD is kicking in)
I've added body tags, not sure if you copied and pasted this code but it looked weird to me :)
This tutorial http://www.blocsoft.com/blog/imageshack.asp shows a great way to upload to imageshack and get a image url back although its for ASP and I need it in PHP.
Any ideas if and how this could be done?
Thanks heaps.
I just rewrote the asp to php, no clue if it works haven't tested it, but if the asp does work then the php should also.
index.php
<html>
<head>
<title>AJAX image upload</title>
</head>
<body>
<form action="http://imageshack.us/redirect_api.php" target="AXframe" method="post" enctype="multipart/form-data">
<input type="file" name="media"/>
<input type="hidden" name="key" value="YOUR_DEVELOPER_KEY">
<input type="hidden" name="error_url" value="http://example.com/error.php">
<input type="hidden" name="success_url" value="http://example.com/success.php?one=%y&two=%u&three=%s&four=%b&five=%i">
<input type="submit"/>
</form>
<iframe style="visibility:hidden" id="AXframe" name="AXframe"></iframe>
<div id="link"></div>
<div id="yfrog"></div>
<div id="image"></div>
</body>
</html>
success.php
<?php
$str1 = $_GET["one"];
$str2 = $_GET["two"];
$str3 = $_GET["three"];
$str4 = $_GET["four"];
$str5 = $_GET["five"];
?>
<script type="text/javascript">
parent.document.getElementById('yfrog').innerHTML = '<?php echo($str1); ?>';
parent.document.getElementById('link').innerHTML = '<?php echo($str2); ?>';
parent.document.getElementById('image').innerHTML = '<img src="http://img<?php echo($str3); ?>.imageshack.us/img<?php echo($str3); ?>/<?php echo($str4); ?>/<?php echo($str5); ?>">';
</script>
error.php
<script type="text/javascript">
alert("There was an error uploading the file.");
</script>
I wonder whether someone could help me please.
I've been looking through this, and many other sites and tutorials to find out how to add a button to a form which opens a PHP file, in this case, a pop up form that allows a user to upload a file to a mySQL database.
In addition to the opening of the file, I'd like to carry over the 'id' field value from the main form to the pop 'File Upload' form.
From the research I've carried out there seems to be a number of ways to do this, but from a beginners perspective I'm not sure what is the best way to do this.
Could someone perhaps please advise on what is the best way to go about this.
Many thanks and kind regards
To pass values between pages:
Main form:
<form action="myuploadform.php" method="get">
ID: <input type="text" name="id">
<input type="submit" value="Open Form">
</form>
The value of the ID text box will be accessible as $_GET['id'] in myuploadform.php.
Using GET parameters is the simplest way of passing values. Another way to pass in this GET value would be in the URL:
.../myuploadform.php?id=35 where the ID then becomes 35.
Here's a sample from my site. All it does is allow the uploading of files to the server. It should serve as a tutorial.
<html>
<head>
<script type="text/javascript">
var form_object = null;
var button_object = null;
function submit_form(obj)
{
form_object = obj.parentNode;
form_object.submit();
form_object.disabled = true;
button_object = obj;
button_object.disabled = true;
}
function enable_form()
{
form_object.disabled = false;
button_object.disabled = false;
}
function Add_HTML(html)
{
if(navigator.appName == 'Microsoft Internet Explorer')
{
document.body.insertAdjacentHTML('beforeEnd', html);
}
//Firefox uses the Netscape engine (the Netscape version that really sucked)
if(navigator.appName == 'Netscape' && parseInt(navigator.appVersion) == 5)
{
var freaky_object = document.createRange();
freaky_object.setStartBefore(document.body);
html = freaky_object.createContextualFragment(html);
document.body.appendChild(html);
}
}
</script>
</head>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data" target="upload">
<label>File:</label> <input type="file" name="file" />
<br />
<label>File:</label> <input type="file" name="swntic" />
<br />
<input type="button" value="SUBMIT"
onclick="submit_form(this);" />
</form>
<iframe src="about:blank" style="display:none;" id="upload" name="upload"></iframe>
</body>
</html>
server side code:
<?
$confirmation = "";
while(list($name) = each($HTTP_POST_FILES)) {
?>
<? if(is_uploaded_file($HTTP_POST_FILES[$name]["tmp_name"])) { ?>
<?= $HTTP_POST_FILES[$name]["name"] ?>
<br />
<?= $HTTP_POST_FILES[$name]["type"] ?>
<br />
<?= $HTTP_POST_FILES[$name]["tmp_name"] ?>
<br />
<?= $HTTP_POST_FILES[$name]["error"] ?>
<br />
<?= $HTTP_POST_FILES[$name]["size"] ?>
<br /><br />
<? } ?>
<?
if(is_uploaded_file($HTTP_POST_FILES[$name]["tmp_name"]))
{
move_uploaded_file($HTTP_POST_FILES[$name]["tmp_name"], "./uploads/" . $HTTP_POST_FILES[$name]["name"]);
chmod("./uploads/" . $HTTP_POST_FILES[$name]["name"], 0644);
$confirmation .= "<a href=\"./uploads/" . $HTTP_POST_FILES[$name]["name"] . "\">" .
$HTTP_POST_FILES[$name]["tmp_name"] . "</a> " . $HTTP_POST_FILES[$name]["type"] . ", " . $HTTP_POST_FILES[$name]["size"] . " bytes<br />";
}
}
?>
<html>
<script>
var confirmation = '<?= $confirmation ?>';
</script>
<body onload="parent.enable_form(); parent.Add_HTML(confirmation);">
</body>
</html>
It's not perfect, but can be used as a learning tool.