使用表单从Jquery Mobile Phonegap应用程序附加图像？

Question

In my app (JQM + Phonegap) I have created a form where the user can take an image using the camera and want to submit the form via php email with image attached. I am getting the form fields, but no the image.

I had found this example of a file upload and tried to use some of the php.

<form action="....onmyserver..../bcmc-wnv-mailer.php" method="post" data-ajax="false" id="reportBirdForm" enctype="multipart/form-data">
        <label for="textinput" class="ui-hidden-accessible">Name:</label>
        <input type="text" name="f2_fullName" id="f2_fullName" value="" placeholder="Full Name *" required />

        <label for="f2_phone" class="ui-hidden-accessible">Phone:</label>
        <input type="tel" name="f2_phone" id="f2_phone" value="" placeholder="Phone #" required/>
        <label for="f2_email" class="ui-hidden-accessible">Phone:</label>
        <input type="email" name="f2_email" id="f2_email" value="" placeholder="Email Address *" required />
        <a href="#mapPage" onClick="locFormFieldName='deadBirdLocation';" class=" ui-btn ui-btn-icon-right ui-icon-location ui-corner-all ui-nodisc-icon" data-transition="pop">Click to find Location Address...</a>
        <label for="f2_locationAddress" class="ui-hidden-accessible">Location Address:</label>
        <input type="text" name="f2_locationAddress" id="f2_locationAddress" value="" placeholder="Location Address *" />
        <input type="hidden" name="f2_GPSLocation" id="f2_GPSLocation" value="" />
        <select name="f2_numBirds" id="f2_numBirds" data-native-menu="false" data-theme="c" required>
            <option>Number of Birds?</option>
            <option value="1">One(1)</option>
            <option value="2">Two(2)</option>
            <option value="3">Three(3)</option>
            <option value="4+">Four+(4+)</option>
        </select>
        <label for="f2_additionalDetails" class="ui-hidden-accessible">Description:</label>
        <textarea name="f2_additionalDetails" id="f2_additionalDetails" placeholder="Additional Details" style="height:80px !important;" ></textarea>

        <a href="" onClick="capturePhoto();" class="ui-btn ui-btn-icon-right ui-icon-camera ui-nodisc-icon ui-corner-all" id="photoBtn" >Attach Photo</a>
        <input type="hidden" name="f2_photoURI" id="f2_photoURI" value="" placeholder="Photo URI"/>

        <div style="border:thin rgba(172,172,172,1.00) solid; padding:0.5em; border-radius:0.9em;"><center><img src="img/imgPlaceholder.jpg" id="photoPreview" style="width:50%;"/></center></div>

        <button class="ui-btn ui-corner-all" type="submit" id="submit">Submit Form</button>

    </form>

Javascript

function capturePhoto(){
navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
    destinationType: Camera.DestinationType.FILE_URI, correctOrientation:true});
} // end function capturePhoto()

function onSuccess(imageURI) {
var image = document.getElementById('photoPreview');
image.src = imageURI;
//$('#photoPreview').attr("src",imageURI);
var formElem = document.getElementById("photoURI");
formElem.value = imageURI;
}

function onFail(errorMessage) {
showAlert('Photo Attchment Failed: ' + errorMessage,'Error!');
}

Here is my PHP.

<?php
// VARS

$BCMC_email="[e-mail]";

$email_subject="Bird Report - BCMC Mobile App";


$FullName=$_POST["f2_fullName"];
$FromEmail=$_POST["f2_email"]; 
$Phone=$_POST["f2_phone"];
$LocationAddress=$_POST["f2_locationAddress"];
$GPSLocation=$_POST["f2_GPSLocation"]; 
$NumberOfBirds=$_POST["f2_numBirds"];
$AdditionalDetails=$_POST["f2_additionalDetails"]; 

// get photo attachment
$attachment = $field_file = $_POST['f2_photoURI'];
$tmpName = $_FILES['f2_photoURI']['tmp_name'];
$fileType = $_FILES['f2_photoURI']['type'];
$fileName = $_FILES['f2_photoURI']['name']; 


// setup email header
//$Headers = "From:" .$FromEmail;

function clean_string($string) {
  $bad = array("content-type","bcc:","to:","cc:","href");
  return str_replace($bad,"",$string);
}

// email to BCMC
$email_message .= "You have recieved a Bird Report through the BCMC Mobile App
";
$email_message .= "

";
$email_message .= "Name: ".$FullName."
";
$email_message .= "Address: ".$LocationAddress."
";
$email_message .= "GPS Location: ".$GPSLocation."
";
$email_message .= "E-mail: ".$FromEmail."
";
$email_message .= "Telphone: ".$Phone."

";
$email_message .= "Number of Birds?  ".$NumberOfBirds."

";
$email_message .= "Additional Details:
    ".clean_string($AdditionalDetails)."

";
$email_message .= "

";

// create email headers
 $headers = 'From: '.$FromEmail."
".
        'Reply-To: '.$FromEmail."
" .
        'X-Mailer: PHP/' . phpversion();

if (!empty($tmpName)) 
{
      /* Reading file ('rb' = read binary)  */
      $file = fopen($tmpName,'rb');

      $data = fread($file,filesize($tmpName));
      fclose($file); 
        /* a boundary string */
      $randomVal = md5(time());
      $mimeBoundary = "==Multipart_Boundary_x{$randomVal}x";

      /* Header for File Attachment */
      $headers .= "
MIME-Version: 1.0
";
      $headers .= "Content-Type: multipart/mixed;
" ;
      $headers .= " boundary=\"{$mimeBoundary}\"";

      /* Multipart Boundary above message */
      $email_message = "This is a multi-part message in MIME format.

" .
      "--{$mimeBoundary}
" .
      "Content-Type: text/plain; charset=\"iso-8859-1\"
" .
      "Content-Transfer-Encoding: 7bit

" .
      $email_message . "

";

      /* Encoding file data */
      $data = chunk_split(base64_encode($data));

      /* Adding attchment-file to message*/
      $email_message .= "--{$mimeBoundary}
" .
      "Content-Type: {$fileType};
" .
      " name=\"{$fileName}\"
" .
      "Content-Transfer-Encoding: base64

" .
      $data . "

" .
      "--{$mimeBoundary}--
";
}

    // send email to BCMC (and DHEC?)
    mail($BCMC_email, $email_subject, $email_message, $Headers);


?>

Any help would be greatly appreciated.

Thanks,

RGecy