how to upload image on server using ajax in cordova build

问题

Can anybody provide the complete ajax and (php or asp) server side code to upload the image directly from simple html to online server. Actually I'm trying to upload image on server using phonegap cli

<form id="uploadaadhar" action="http://server_url" method="post">
    <input type="hidden" name="userid" >
    <br><label>Aadhar Number</label>
    <br><input type="number" name="aadhar" class="form-control" placeholder="XXXX XXXX XXXX">
    <br><label>Choose File</label>
    <br><input name="files[]" class="form-control" type="file" />
    <br><label>PAN Number</label>
    <br><input type="number" name="pan" class="form-control" placeholder="XXXX XXXX XXXX">
    <br><span class="ak-text-indigo">Leave Pan Card Field Blank if you do not want to update your pan card</span>
    <br><br>
    <input type="submit" value="Upload" class="ak-btn ak-blue">
</form>

<script>
    $("[type='hidden']").val(localStorage.getItem("userid")); 
    $("#uploadaadhar").ajaxForm(function(data){

        if(data !== ""){

            $("[type='submit']").val(data);
        }

    });
</script>

回答1:

Here is a sample demo for uploading image. Here data is image and other data that you want to send using post. url is where you want to post data.

 <html>
   <form>
     <input id="file-input" type="file" name="files" accept="image/*" />
     <button type="button" onclick="uploadImage()">upload</button>
   </form>
 </html>

and ajax function

function uploadImage(){
 url = "your web url where u want to upload image";
 var formdata = new FormData();  
 formdata.append( 'files', $('#file-input')[0].files[0]);
 $.ajax({
   type: "POST",
   url: url,
   data: formdata,
   processData: false,
   contentType: false,
   type: 'POST',
   success: function(msg){
       // on success
   },
   error: function(){
       alert("failure");
   },
   async: false
 });
}

回答2:

    <form id="uploadaadhar" action= "http://app.365valueservices.com/365APP/settings.php" method="post">
       <label>Aadhar Number</label>
          <input type="number" name="aadhar" class="form-control" placeholder="XXXX XXXX XXXX">`enter code here`
       <label>Choose File</label>
          <input name="files[]" class="form-control" type="file" />
          <input type="submit" value="Upload" class="ak-btn ak-blue">
   </form>

Javascript

  <script> $("#uploadaadhar").ajaxForm(function(data){
    if(data !== ""){
      $("[type='submit']").val(data);
   } });
  </script>

回答3:

if(isset($_FILES['files']))
{
    if(is_array($_FILES))   
    {  
        foreach ($_FILES['files']['name'] as $name => $value)  
        {  
            $file_name = explode(".", $_FILES['files']['name'][$name]);  
            $allowed_ext = array("jpg","JPG", "jpeg", "JPEG", "png", "PNG", "gif","pdf","docx","doc");  
            if(in_array($file_name[1], $allowed_ext))  
            {  
                $new_name = md5(rand()) . '.' . $file_name[1];  
                $sourcePath = $_FILES['files']['tmp_name'][$name];  
                $targetPath = "../httpdocs/docs/".$new_name;  
                //$targetPath = "upload/".$new_name;  

                move_uploaded_file($sourcePath, $targetPath);

                $filepath = "../docs/".$new_name;
                $sql = "update usertbl set aadhar = '".$_POST['aadhar']."' where userid = ".$_POST['userid'];
                sqlsrv_query($conn,$sql);
                if($_POST['pan'] != ""){
                    $sql2 = "update usertbl set panno = '".$_POST['pan']."' where userid = ".$_POST['userid'];
                    sqlsrv_query($conn,$sql2);
                }

                $stmt  = sqlsrv_query($conn,"select * from user_meta where userid = ".$_POST['userid']." and metakey = 'aadharpath'");
                $row_count = sqlsrv_has_rows($stmt);
                if($row_count === false){
                    sqlsrv_query($conn,"insert into user_meta(userid,metakey,metavalue,Active) values (".$_POST['userid'].",'aadharpath','".$filepath."',1)");

                }
                else
                {
                    sqlsrv_query($conn,"update user_meta set metavalue = '".$filepath."' where metakey='aadharpath' and userid=".$_POST['userid']);
                }

                sqlsrv_query($conn,"insert into useractivity values(".$_POST['userid'].",'You had updated your aadhar details','" .date("d-m-Y H:i:s"). "',1)");

                echo "Updated Successfully";

            }            
        }  



    } 
}

来源：https://stackoverflow.com/questions/47150331/how-to-upload-image-on-server-using-ajax-in-cordova-build

标签

php

ajax

cordova

image-uploading

phonegap