1**1. index.php**
2<body>
3 <span id="msg" style="color:red"></span><br/>
4 <input type="file" id="photo"><br/>
5 <script type="text/javascript" src="jquery-3.2.1.min.js"></script>
6 <script type="text/javascript">
7 $(document).ready(function(){
8 $(document).on('change','#photo',function(){
9 var property = document.getElementById('photo').files[0];
10 var image_name = property.name;
11 var image_extension = image_name.split('.').pop().toLowerCase();
12
13 if(jQuery.inArray(image_extension,['gif','jpg','jpeg','']) == -1){
14 alert("Invalid image file");
15 }
16
17 var form_data = new FormData();
18 form_data.append("file",property);
19 $.ajax({
20 url:'upload.php',
21 method:'POST',
22 data:form_data,
23 contentType:false,
24 cache:false,
25 processData:false,
26 beforeSend:function(){
27 $('#msg').html('Loading......');
28 },
29 success:function(data){
30 console.log(data);
31 $('#msg').html(data);
32 }
33 });
34 });
35 });
36 </script>
37</body>
38
39**2.upload.php**
40<?php
41if($_FILES['file']['name'] != ''){
42 $test = explode('.', $_FILES['file']['name']);
43 $extension = end($test);
44 $name = rand(100,999).'.'.$extension;
45
46 $location = 'uploads/'.$name;
47 move_uploaded_file($_FILES['file']['tmp_name'], $location);
48
49 echo '<img src="'.$location.'" height="100" width="100" />';
50}
51
1$('#upload').on('click', function() {
2 var file_data = $('#sortpicture').prop('files')[0];
3 var form_data = new FormData();
4 form_data.append('file', file_data);
5 alert(form_data);
6 $.ajax({
7 url: 'upload.php', // point to server-side PHP script
8 dataType: 'text', // what to expect back from the PHP script, if anything
9 cache: false,
10 contentType: false,
11 processData: false,
12 data: form_data,
13 type: 'post',
14 success: function(php_script_response){
15 alert(php_script_response); // display response from the PHP script, if any
16 }
17 });
18});
19
1var formData = new FormData($("#YOUR_FORM_ID")[0]);
2$.ajax({
3 url: "upload.php",
4 type: "POST",
5 data : formData,
6 processData: false,
7 contentType: false,
8 beforeSend: function() {
9
10 },
11 success: function(data){
12
13
14
15
16 },
17 error: function(xhr, ajaxOptions, thrownError) {
18 console.log(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
19 }
20});
21
1async function saveFile()
2{
3 let formData = new FormData();
4 formData.append("file", sortpicture.files[0]);
5 await fetch('/uploads', {method: "POST", body: formData});
6 alert('works');
7}
1<?php
2
3 if ( 0 < $_FILES['file']['error'] ) {
4 echo 'Error: ' . $_FILES['file']['error'] . '<br>';
5 }
6 else {
7 move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . $_FILES['file']['name']);
8 }
9
10?>
11
1<?
2$data = array();
3 //check with your logic
4 if (isset($_FILES)) {
5 $error = false;
6 $files = array();
7
8 $uploaddir = $target_dir;
9 foreach ($_FILES as $file) {
10 if (move_uploaded_file($file['tmp_name'], $uploaddir . basename( $file['name']))) {
11 $files[] = $uploaddir . $file['name'];
12 } else {
13 $error = true;
14 }
15 }
16 $data = ($error) ? array('error' => 'There was an error uploading your files') : array('files' => $files);
17 } else {
18 $data = array('success' => 'NO FILES ARE SENT','formData' => $_REQUEST);
19 }
20
21 echo json_encode($data);
22?>
23
1move_uploaded_file(
2
3 // this is where the file is temporarily stored on the server when uploaded
4 // do not change this
5 $_FILES['file']['tmp_name'],
6
7 // this is where you want to put the file and what you want to name it
8 // in this case we are putting in a directory called "uploads"
9 // and giving it the original filename
10 'uploads/' . $_FILES['file']['name']
11);
12