mysql - PHP and Ajax Uploading -
this script inserts data table, uploads image
want url image upload inserted column image
another problem i'm having when put upload portion of form inside other form, refreshes page , says file not selected anymore.
ideally have 1 submit button, , load bar still work same way, giving dialog box saying file uploaded , after closing submit form database.
index.php
<?php session_start(); if(isset($_session['username'])) { mysql_connect ('localhost', 'root', '') ; mysql_select_db ('admin'); } else { header("location: index.php"); } if (isset($_post['submit'])) { $month = htmlspecialchars(strip_tags($_post['month'])); $date = htmlspecialchars(strip_tags($_post['date'])); $year = htmlspecialchars(strip_tags($_post['year'])); $time = htmlspecialchars(strip_tags($_post['time'])); $title = htmlspecialchars(strip_tags($_post['title'])); $entry = $_post['entry']; $image = htmlspecialchars(strip_tags($_post['mypost'])); $timestamp = strtotime($month . " " . $date . " " . $year . " " . $time); $entry = nl2br($entry); if (!get_magic_quotes_gpc()) { $title = addslashes($title); $entry = addslashes($entry); } $sql = "insert posts (timestamp,title,entry,image) values ('$timestamp','$title','$entry','$image')"; $result = mysql_query($sql) or print("can't insert table.<br />" . $sql . "<br />" . mysql_error()); mysql_close(); header("location: index.php"); } $current_month = date("f"); $current_date = date("d"); $current_year = date("y"); $current_time = date("h:i"); $sess_val = time(); //create unique identifier upload session value of hidden input $sess_name = ini_get("session.upload_progress.name"); //this constant name of hidden input ?> <!doctype html> <html> <head> <title>geeky gents</title> <link rel="stylesheet" href="style.css" type="text/css" /> <link rel="icon" href="images/favicon.ico" /> <script> //simply fetch progress of current upload via ajax function checkprogress() { var xmlhttp; if(window.xmlhttprequest) {// code ie7+, firefox, chrome, opera, safari xmlhttp=new xmlhttprequest(); } else {// code ie6, ie5 xmlhttp=new activexobject("microsoft.xmlhttp"); } xmlhttp.onreadystatechange=function() { if(xmlhttp.readystate==4 && xmlhttp.status==200) { //call function update progress bar visually updateprogressbar(eval("("+xmlhttp.responsetext+")")); //don't - it's unsafe } } //send request uploader.php progress parameter present xmlhttp.open("get", "uploader.php?progress=<?php echo $sess_val; ?>", true); xmlhttp.send(); } //this function converts json object of progress visual progress bar function updateprogressbar(response) { if(response['bytes_processed']==undefined) //this upload finished { document.getelementbyid("progress-inner").style.width = "600px"; alert("done!"); //we not make request progress since it's done } else { //calculate new pixel width of progress bar var new_width = math.round(response['bytes_processed'] / response['content_length'] * 600); document.getelementbyid("progress-inner").style.width = new_width+"px"; checkprogress(); //make request progress } } //this function called upon upload - begins progress checking function beginupload() { var t = settimeout("checkprogress()", 2000); //wait bit leave enough time initial upload sent } </script> </head> <body> <div class="links"> <a href="index.php">home</a> <a href="about.html">about</a> <a href="products.html">products</a> <a href="join.html">join us</a> </div> <div class="body"> <form method="post" action="<?php echo $_server['php_self']; ?>"> <p> <input type="hidden" value="<?php echo $current_month; ?>" name="month" id="month" /> <input type="hidden" name="date" id="date" size="2" value="<?php echo $current_date; ?>" /> <input type="hidden" value="<?php echo $current_year; ?>" name="year" id="year" /> <input type="hidden" name="time" id="time" size="5" value="<?php echo $current_time; ?>" /></p> <p><label for="title">*title:</label><input type="text" name="title" name="title" size="40" /></p> <input type="text" name="uploaded_file" name="uploaded_file" value="<?php strip_tags($_post['myfile']); ?>" size="70" /> <p>*content:</p> <p><textarea cols="80" rows="20" name="entry" id="entry"></textarea></p> <p> <input type="submit" name="submit" id="submit" value="submit"> <input type="button" value="cancel" onclick="window.location.href='index.php'"> </p> </form> <br /><br /> <p>image uploader: (h x w)(150 x 750)</p> <form action="uploader.php" method="post" enctype="multipart/form-data" target="submit-catch"> <input type="hidden" name="<?php echo $sess_name ?>" value="<?php echo $sess_val; ?>" /> <input type="file" name="myfile" /> <input type="submit" value="upload" onclick="beginupload();" /> </form> <div id="progress-outer"> <div id="progress-inner"></div> </div> <iframe name="submit-catch" style="display:none;"></iframe> </div> <div class="footer"> <a href="http://www.youtube.com/user/geekygents/" target="_blank"><img src="images/icon/yt.png" /></a> <a href="http://www.facebook.com/geekygents/" target="_blank"><img src="images/icon/fb.png" /></a> <a href="https://twitter.com/geekygents/" target="_blank"><img src="images/icon/twitter.png" /></a> </div> </body> </html> uploader.php
<?php session_start(); //we need able access session if(isset($_request['progress']) && isset($_session['username'])) //getting progress on upload { //get key of particular upload - based on passed parameter $key = ini_get("session.upload_progress.prefix").$_request["progress"]; if(isset($_session[$key])) echo json_encode($_session[$key]); //make easy our javascript handle progress data else //the session doesn't exist, means upload has finished or has not yet started echo json_encode($key); } else //initial upload request { define("upload_dir", "uploads/"); if (!empty($_files["myfile"])) { $myfile = $_files["myfile"]; if ($myfile["error"] !== upload_err_ok) { echo "<p>an error occurred.</p>"; exit; } // ensure safe filename $name = preg_replace("/[^a-z0-9._-]/i", "_", $myfile["name"]); // don't overwrite existing file $i = 0; $parts = pathinfo($name); while (file_exists(upload_dir . $name)) { $i++; $name = $parts["filename"] . "-" . $i . "." . $parts["extension"]; } $filetype = exif_imagetype($_files["myfile"]["tmp_name"]); $allowed = array(imagetype_gif, imagetype_jpeg, imagetype_png); if (!in_array($filetype, $allowed)) { echo "<p>wrong file type, please use gif jpeg or png</p>"; } else { // preserve file temporary directory $success = move_uploaded_file($myfile["tmp_name"], upload_dir . $name); if (!$success) { echo "<p>unable save file.</p>"; exit; } // set proper permissions on new file chmod(upload_dir . $name, 0644); } } } ?> if find else security holes please let me know them well, i'm learning.
it looks miss set upload target form, can please give id "file_upload_form" form , use below code.
function init() { document.getelementbyid('file_upload_form').onsubmit=function() { document.getelementbyid('file_upload_form').target = 'upload_target'; //'upload_target' name of iframe } } window.onload=init; 
Comments
Post a Comment