file upload in php through ajax

Add Answer

Dev answered on October 22, 2020 Popularity 9/10 Helpfulness 3/10

answer file upload in php through ajax

related upload file using ajax

related file upload in php through ajax

related php file upload ajax

related file upload to ajax

related file upload in php through ajax

file upload in php through ajax

Comment

async function saveFile() 
{
    let formData = new FormData();           
    formData.append("file", sortpicture.files[0]);
    await fetch('/uploads', {method: "POST", body: formData});    
    alert('works');
}

Popularity 9/10 Helpfulness 3/10 Language php

Source: stackoverflow.com

Tags: ajax file-upload php

Link to this answer
Share Copy Link

Contributed on Oct 22 2020

Dev

0 Answers Avg Quality 2/10

Closely Related Answers

upload file using ajax

Comment

// add jquery
// <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
$(document).ready(function() {
  $("#form").on('submit', (function(e) {
    e.preventDefault();
    $.ajax({
      url: $(this).attr('action'),
      type: "POST",
      data: new FormData(this),
      contentType: false,
      cache: false,
      processData: false,
      success: function(response) {
        $("#form").trigger("reset"); // to reset form input fields
      },
      error: function(e) {
        console.log(e);
      }
    });
  }));
});

Popularity 10/10 Helpfulness 10/10 Language javascript

Source: Grepper

Tags: ajax

Link to this answer
Share Copy Link

Contributed on Jun 01 2022

Terrible Tern

0 Answers Avg Quality 2/10

file upload in php through ajax

Comment

$('#upload').on('click', function() {
    var file_data = $('#sortpicture').prop('files')[0];   
    var form_data = new FormData();                  
    form_data.append('file', file_data);
    alert(form_data);                             
    $.ajax({
        url: 'upload.php', // point to server-side PHP script 
        dataType: 'text',  // what to expect back from the PHP script, if anything
        cache: false,
        contentType: false,
        processData: false,
        data: form_data,                         
        type: 'post',
        success: function(php_script_response){
            alert(php_script_response); // display response from the PHP script, if any
        }
     });
});

Popularity 10/10 Helpfulness 7/10 Language php

Source: stackoverflow.com

Tags: ajax

Link to this answer
Share Copy Link

Contributed on Oct 22 2020

Dev

0 Answers Avg Quality 2/10

file upload in php through ajax

Comment

**1. index.php**
<body>
    <span id="msg" style="color:red"></span><br/>
    <input type="file" id="photo"><br/>
  <script type="text/javascript" src="jquery-3.2.1.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
      $(document).on('change','#photo',function(){
        var property = document.getElementById('photo').files[0];
        var image_name = property.name;
        var image_extension = image_name.split('.').pop().toLowerCase();

        if(jQuery.inArray(image_extension,['gif','jpg','jpeg','']) == -1){
          alert("Invalid image file");
        }

        var form_data = new FormData();
        form_data.append("file",property);
        $.ajax({
          url:'upload.php',
          method:'POST',
          data:form_data,
          contentType:false,
          cache:false,
          processData:false,
          beforeSend:function(){
            $('#msg').html('Loading......');
          },
          success:function(data){
            console.log(data);
            $('#msg').html(data);
          }
        });
      });
    });
  </script>
</body>

**2.upload.php**
<?php
if($_FILES['file']['name'] != ''){
    $test = explode('.', $_FILES['file']['name']);
    $extension = end($test);    
    $name = rand(100,999).'.'.$extension;

    $location = 'uploads/'.$name;
    move_uploaded_file($_FILES['file']['tmp_name'], $location);

    echo '<img src="'.$location.'" height="100" width="100" />';
}

Popularity 10/10 Helpfulness 6/10 Language php

Source: stackoverflow.com

Tags: ajax

Link to this answer
Share Copy Link

Contributed on Oct 22 2020

Dev

0 Answers Avg Quality 2/10

php file upload ajax

Comment

$('#ProblemUpload').submit(function(e){
         e.preventDefault();
            var file_data = $('#fileData').prop('files')[0];   //file input id
            var form_data = new FormData();                  
            form_data.append('file', file_data);
            form_data.append('action', 'upload_sheet');
            console.log(form_data);                             
            $.ajax({
                url: '/apis/auth.php', // <-- point to server-side PHP script 
                dataType: 'text',  // <-- what to expect back from the PHP script, if anything
                cache: false,
                contentType: false,
                processData: false,
                data: form_data,                         
                type: 'post',
                success: function(php_script_response){
                    console.log(php_script_response); // <-- display response from the PHP script, if any
                }
            });
     })

Popularity 8/10 Helpfulness 4/10 Language php

Source: Grepper

Tags: ajax file-upload

Link to this answer
Share Copy Link

Contributed on Mar 22 2022

Singh99

0 Answers Avg Quality 2/10

file upload to ajax

Comment

// HTML structure
<form id="myForm" enctype="multipart/form-data">
  <input type="file" name="myFile">
  <button type="submit">Upload</button>
</form>

<!-- JavaScript code -->
<script>
  document.getElementById('myForm').addEventListener('submit', function(event) {
    event.preventDefault(); // Prevent default form submission

    var formData = new FormData(this); // Create a new FormData object from the form
    var xhr = new XMLHttpRequest(); // Create a new XMLHttpRequest object

    xhr.open('POST', '/upload', true); // Specify the request type, URL, and set it as asynchronous

    xhr.onload = function() {
      if (xhr.status === 200) {
        console.log('File successfully uploaded!');
      } else {
        console.error('Error uploading file. Status:', xhr.status);
      }
    };

    xhr.onerror = function() {
      console.error('Request failed');
    };

    xhr.send(formData); // Send the form data as the request payload
  });
</script>

Popularity 8/10 Helpfulness 4/10 Language javascript

Source: Grepper

Link to this answer
Share Copy Link

Contributed on Sep 12 2023

YOU.com

0 Answers Avg Quality 2/10

file upload in php through ajax

Comment

var formData = new FormData($("#YOUR_FORM_ID")[0]);
$.ajax({
    url: "upload.php",
    type: "POST",
    data : formData,
    processData: false,
    contentType: false,
    beforeSend: function() {

    },
    success: function(data){




    },
    error: function(xhr, ajaxOptions, thrownError) {
       console.log(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
    }
});

Popularity 9/10 Helpfulness 4/10 Language php

Source: stackoverflow.com

Tags: ajax

Link to this answer
Share Copy Link

Contributed on Oct 22 2020

Dev

0 Answers Avg Quality 2/10

file upload in php through ajax

Comment

<?php

    if ( 0 < $_FILES['file']['error'] ) {
        echo 'Error: ' . $_FILES['file']['error'] . '<br>';
    }
    else {
        move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . $_FILES['file']['name']);
    }

?>

Popularity 9/10 Helpfulness 3/10 Language php

Source: stackoverflow.com

Tags: ajax

Link to this answer
Share Copy Link

Contributed on Oct 22 2020

Dev

0 Answers Avg Quality 2/10

file upload in php through ajax

Comment

<?
$data = array();
    //check with your logic
    if (isset($_FILES)) {
        $error = false;
        $files = array();

        $uploaddir = $target_dir;
        foreach ($_FILES as $file) {
            if (move_uploaded_file($file['tmp_name'], $uploaddir . basename( $file['name']))) {
                $files[] = $uploaddir . $file['name'];
            } else {
                $error = true;
            }
        }
        $data = ($error) ? array('error' => 'There was an error uploading your files') : array('files' => $files);
    } else {
        $data = array('success' => 'NO FILES ARE SENT','formData' => $_REQUEST);
    }

    echo json_encode($data);
?>

Popularity 9/10 Helpfulness 3/10 Language php

Source: stackoverflow.com

Tags: ajax

Link to this answer
Share Copy Link

Contributed on Oct 22 2020

Dev

0 Answers Avg Quality 2/10

file upload in php through ajax

Comment

move_uploaded_file(

    // this is where the file is temporarily stored on the server when uploaded
    // do not change this
    $_FILES['file']['tmp_name'],

    // this is where you want to put the file and what you want to name it
    // in this case we are putting in a directory called "uploads"
    // and giving it the original filename
    'uploads/' . $_FILES['file']['name']
);

Popularity 9/10 Helpfulness 2/10 Language php

Source: stackoverflow.com

Tags: ajax

Link to this answer
Share Copy Link

Contributed on Oct 22 2020

Dev

0 Answers Avg Quality 2/10

file upload in php through ajax

Contents

More Related Answers

file upload in php through ajax

Closely Related Answers

upload file using ajax

file upload in php through ajax

file upload in php through ajax

php file upload ajax

file upload to ajax

file upload in php through ajax

file upload in php through ajax

file upload in php through ajax

file upload in php through ajax

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.