在ajax中上传图像表单不起作用

时间:2012-10-09 12:15:41

标签: php image forms upload

您好我想将一些图片上传到我的服务器。当我没有将带有ajax.load的页面加载到另一个页面时,它可以工作。所以通过直接链接它可以正常工作。但我想点击一个链接,打开上传表格并上传图片(全部在一个窗口中)。这是因为页面在上传之前是刷新还是另一个问题?不知道怎么解决这个问题。

代码:

<?php
include('includes/connect.php');

if(isset($_POST['uploadImg'])){
$extension = end(explode(".", $_FILES["file"]["name"]));
$name = $_FILES["file"]["name"];

if (file_exists("upload/" . $_FILES["file"]["name"]))
      {
     mysql_query("INSERT INTO images (itemID,imgPath,imgName,imgExtension,imgAlt)               VALUES (".$_POST['itemNumber'].",'upload','".$name."','".$extension."','".$name."')")or die('kan niet uploaden'.mysql_error()); 
      }
    else
      {
      move_uploaded_file($_FILES["file"]["tmp_name"],
      "upload/" . $_FILES["file"]["name"]);
      echo "Uw afbeelding is toegevoegd aan item".$_POST['itemNumber'];
      echo "<a id='uploadNew' href='#'>Nog een item uploaden</a>";
      }                 


mysql_query("INSERT INTO images (itemID,imgPath,imgName,imgExtension,imgAlt)                VALUES (".$_POST['itemNumber'].",'upload','".$name."','".$extension."','".$name."')")or die('kan niet uploaden'.mysql_error());     
}

?>
<form method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file" />
Toevoegen aan: 
<select name="itemNumber">
<? 
            $result = mysql_query("SELECT * FROM items");
                while($row = mysql_fetch_array($result))
                  {
                      echo '<option name="itemVal" value="'.$row['itemID'].'">'.$row['itemTitle'].'</option>';
                      echo "<br />";
                  }
        ?>
</select>
<input type="submit" name="uploadImg" value="submit" />
</form>

2 个答案:

答案 0 :(得分:0)

问题来自于在加载AJAX之前将表单发送到父页面的事实。您发布的部分页面是通过第二个HTTP请求检索的,并且没有设置任何POST参数。

您最好的选择是在加载AJAX的父页面中添加php脚本。还要在表单元素中指定“target”属性,以便跟踪处理请求的服务器页面。

答案 1 :(得分:0)

ajax不能直接上传你的图片,你应该使用一些插件上传图片,

之前我已经使用此插件(ajax.form)来实现即时image upload

点击链接,在此链接中有一个简单示例,说明如何使用此插件并上传图片.. http://blog.webtech11.com/2012/03/18/ajax-based-instant-image-upload.html