通过Ajax上传图像

时间:2016-02-21 06:46:41

标签: javascript php ajax

我有一个弹出窗口中的数据。这是可由用户编辑的。除图像外,所有数据均已编辑。它给了我一个错误     “第35行的c / xamp / htdocs / website / file.php中的未定义索引文件”

my ajax call is :
function updat(id){
$.ajax({
        url:'file.php?upd='+id,
        success:function(response){

var img = $("#file").val();
var marlas = $("#marlas").val();
var bath= $("#bath").val();
var bed = $("#bed").val();
var house_no = $("#house_no").val();
var address = $("#address").val();
var price = $("#price").val();
var ids = $("#ids").val();
var dataString = 'files='+ img + '&marlas1='+ marlas + '&bath1='+ bath + '&bed1=' + bed + '&house_no1=' + house_no + '&address1=' + address +  '&price1=' + price +'&ids1=' + ids;

$.ajax({
type: "POST",
url: "file.php",
data: dataString,
success: function(result){
document.getElementById("update");
alert(result);

window.location.reload();
}
});
}
});
}

my file code is :

if(isset($_POST['ids1'])){
$ids= $_POST['ids1'];
$file= $_POST['files'];
 $target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["files"]["name"]);
print_r($target_file); exit();
  $file=$_FILES["files"]["name"];
 $fsize=$_FILES["files"]["size"];
   $ftype=$_FILES["files"]["type"];
    $tmp_name=$_FILES["files"]["tmp_name"];
    $imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);
    if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
&& $imageFileType != "gif" ) {
}
    move_uploaded_file($_FILES["files"]["tmp_name"], $target_file);
$marlas= $_POST['marlas1'];
$bath= $_POST['bath1'];
$bed= $_POST['bed1'];
$house_no= $_POST['house_no1'];
$address= $_POST['address1'];
$price= $_POST['price1'];
$q= mysql_query("update property  set img='$file', marlas='$marlas', bath='$bath', bed='$bed', house_no= '$house_no', address='$address', price='$price' where id='$ids'"); 
if(!$q){echo 'error'.mysql_error(); } 
    else echo "property updated";   
}

1 个答案:

答案 0 :(得分:0)

您可以创建一个函数来处理文件上传并重复使用它。下面是说明相同的代码。此函数还有一个回调,在上传成功时调用。

 var Url = "YourApplicationUrlToPostTheFile"; //file.php
    AjaxFileUpload($('input[type="file"]')[0], Url, function (response) {
        alert('File Uploaded, And the response is ' + response);
       // do something after the image is uploaded successfully;
    });

用于上传文件的Ajax函数。

 function AjaxFileUpload($element, Url, callback) {

    var formdata = new FormData();
    var totalFiles = $element.files.length;   

    if (totalFiles > 0) {
        for (var i = 0; i < totalFiles; i++) {
            var file = $element.files[i];

            formdata.append("FileUpload", file);
        }

        $.ajax({
            type: "POST",
            url: Url,               
            data: formdata,
            contentType: false,
            processData: false,
            success: function (result) {
                callback(result);
            },
            error: function (error) {
                console.log("File Upload Failure");
            }
        });       
    }    
}

如果您有任何问题,请告诉我。