-1

I want to upload one file on server with Ajax function and using formdata object . I was show all value of input file when click button upload .

name: "Lich hoc.txt"

size: 1950

type: "text/plain"

But my trouble is i can't read object in my php code , var_dump is nothing . I used framework Codeigniter . Please help me ! Thanks

HTML CODE

<form enctype="multipart/form-data" name="" id=""  method="post" action="">
    <input id="file" type="file" name="file" />
    <button class="button" id="btnDangKi"> Đăng Kí </button>
</form>

JS CODE

        $(document).ready(function(){
            $('#btnDangKi').click(function(){
                UpLoadFile();
            });

        });

       function UpLoadFile(){
            var file_upload = document.getElementById("file").files[0];
            var fd = new FormData();
            fd.append("file",file_upload);
            console.log(file_upload);
            $.ajax({
                url:'<?php echo base_url('QuanLyXe_Ajax/upload'); ?>',
                data: fd,
                processData: false,
                contentType: false,
                type: 'POST',
                enctype: 'multipart/form-data',
                mimeType: 'multipart/form-data',
                success: function(data){
                    alert(data);
                }
            });
        }

PHP CODE

    public function UpLoad(){
    $config['upload_path'] = './assets/uploads/';
    $config['allowed_types'] = 'gif|jpg|png|txt';

    $this->load->library('upload', $config);

    if ($this->upload->do_upload("file"))
    {
        echo "Thanh cong upload ";
    }else
    {
        echo $this->upload->display_errors();
    }

    echo var_dump($_POST);
}
Community
  • 1
  • 1
user3883921
  • 51
  • 1
  • 2
  • 7
  • where did you call `UpLoadFile()` method ? – Noman Mar 13 '16 at 11:23
  • see this similar question . answer might help you easily http://stackoverflow.com/questions/10899384/uploading-both-data-and-files-in-one-form-using-ajax – Noman Mar 13 '16 at 11:26
  • @Noman I have just did it but its not working for me :( – user3883921 Mar 13 '16 at 11:29
  • first change your `$.ajax` parameters according to the answer and your form tag `
    ` also check your ajax request in network console.
    – Noman Mar 13 '16 at 11:33

1 Answers1

2

STYLE CODE :)

<style>
#upload_button{

padding:5px 10px;
border:1px solid gray;
border-radius:10px;
cursor:hand;
cursor:pointer;
float:left;
margin-top:5px;
}

#upload_form{

float:left;
margin-right:10px;
width:300px;
padding:10px;

}
    </style>

jQUERY CODE

<script>

  $(document).ready(function(){
            $('#upload_button').click(function(){
                UpLoadFile();
            });

        });

       function UpLoadFile(){
       var formData = new FormData($("#form_file")[0]);
        $.ajax({
            url: "yukle.php",
            type: "POST",
            data: formData,
            async: false,
            success: function (cevap) {
            $("#sonuc").append(cevap);
            },
            cache: false,
            contentType: false,
            processData: false
        });

        e.preventDefault();
        }

</script>

HTML CODE

<div id="upload_form">
<form enctype="multipart/form-data" name="form_file" id="form_file"  method="post" action="">
<input id="file" type="file" name="file" />
</form>
</div>

<div id="upload_button"> Upload</div>

PHP CODE

public function UpLoad($file){

if (
$file["type"]=="image/jpeg" or 
$file["type"]=="image/png" or 
$file["type"]=="image/gif"){
$dosya_adi=$file["name"];
$uzanti=substr($dosya_adi,-4,4);
$yeni_ad= './assets/uploads/'.$dosya_adi.$uzanti;
if (move_uploaded_file($file["tmp_name"],$yeni_ad)){
echo 'Files uploaded';
}else{
echo 'Upload Error';
}
}else{
echo 'Error';
}

}

UpLoad($_POST['file']);