title: Multiple Image upload to server in Cordova
body: <p>I tried uploading multiple Images to server.
  I am able to click images and display it in block but not able to transfer it to server. Error I am getting is <code>04-02 10:35:41.984: I/chromium(23772): [INFO:CONSOLE(104)] "Uncaught TypeError: Cannot call method 'lastIndexOf' of undefined", source: file:///android_asset/www/index.html (104)</code></p>
  
  <p>Code: </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;Submit form&lt;/title&gt;
  
      &lt;script type="text/javascript" charset="utf-8" src="cordova.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" charset="utf-8"&gt;
  
      var pictureSource;   // picture source
      var destinationType; // sets the format of returned value
  
      // Wait for device API libraries to load
      //
      document.addEventListener("deviceready",onDeviceReady,false);
  
      // device APIs are available
      //
      function onDeviceReady() {
          pictureSource = navigator.camera.PictureSourceType;
          destinationType = navigator.camera.DestinationType;
      }
  
  
      // Called when a photo is successfully retrieved
      //
     /* function onPhotoURISuccess(imageURI) {
  
          // Show the selected image
          var smallImage = document.getElementById('smallImage');
          smallImage.style.display = 'block';
          smallImage.src = imageURI;
      }*/
  
       function onPhotoDataSuccess1(imageData) {
  
        var smallImage1 = document.getElementById('smallImage1');
        smallImage1.style.display = 'block';
        smallImage1.src = "data:image/jpeg;base64," + imageData;
      }
       function onPhotoDataSuccess2(imageData) {
  
        var smallImage2 = document.getElementById('smallImage2');
        smallImage2.style.display = 'block';
        smallImage2.src = "data:image/jpeg;base64," + imageData;
      }
       function onPhotoDataSuccess3(imageData) {
  
        var smallImage3 = document.getElementById('smallImage3');
        smallImage3.style.display = 'block';
        smallImage3.src = "data:image/jpeg;base64," + imageData;
      }
  
      function capturePhoto1() {
          // Take picture using device camera and retrieve image as base64-encoded string
          navigator.camera.getPicture(onPhotoDataSuccess1, onFail, { quality: 20,
            destinationType: destinationType.DATA_URL,
  
            });
        }
        function capturePhoto2() {
          // Take picture using device camera and retrieve image as base64-encoded string
          navigator.camera.getPicture(onPhotoDataSuccess2, onFail, { quality: 20,
            destinationType: destinationType.DATA_URL,
  
            });
        }
        function capturePhoto3() {
          // Take picture using device camera and retrieve image as base64-encoded string
          navigator.camera.getPicture(onPhotoDataSuccess3, onFail, { quality: 20,
            destinationType: destinationType.DATA_URL,
  
            });
        }
  
      // A button will call this function
      /*
      function getPhoto(source) {
        // Retrieve image file location from specified source
        navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 20,
          destinationType: destinationType.FILE_URI,
          sourceType: source });
      }*/
  
       //selected photo URI is in the src attribute (we set this on getPhoto)
          var imageURI1 = document.getElementById('smallImage1').getAttribute("src");
          var imageURI2 = document.getElementById('smallImage2').getAttribute("src");
          var imageURI3 = document.getElementById('smallImage3').getAttribute("src");
          if (!imageURI1) {
              alert('Please select an image first.');
              return;
          }
  
          var items = [imageURI1,imageURI2,imageURI3];
          $.each(items,function(){
              uploadPhoto($(this));
          });
  
  
      function uploadPhoto(imageURI) {
  
          //set upload options
          var options = new FileUploadOptions();
          options.fileKey = "file";
          options.fileName = imageURI.substr(imageURI.lastIndexOf('/')+1);
          options.mimeType = "image/jpeg";
  
          options.params = {
              firstname: document.getElementById("firstname").value,
              lastname: document.getElementById("lastname").value,
              workplace: document.getElementById("workplace").value
          }
  
          var ft = new FileTransfer();
          ft.upload(imageURI, encodeURI("http://www.xyz.co/AppData/upload.php"), win, fail, options);
      }
  
      // Called if something bad happens.
      //
      function onFail(message) {
        console.log('Failed because: ' + message);
      }
  
      function win(r) {
          console.log("Code = " + r.responseCode);
          console.log("Response = " + r.response);
          //alert("Response =" + r.response);
          console.log("Sent = " + r.bytesSent);
      }
  
      function fail(error) {
          alert("An error has occurred: Code = " + error.code);
          console.log("upload error source " + error.source);
          console.log("upload error target " + error.target);
      }
  
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;form id="regform"&gt;
  
  
          &lt;input type="button" onclick="capturePhoto1();" value="Capture Photo"&gt;&lt;br&gt;
          &lt;img style="display:none;width:60px;height:60px;" id="smallImage1" src="" /&gt;
  
          &lt;input type="button" onclick="capturePhoto2();" value="Capture Photo"&gt;&lt;br&gt;
          &lt;img style="display:none;width:60px;height:60px;" id="smallImage2" src="" /&gt;
  
          &lt;input type="button" onclick="capturePhoto3();" value="Capture Photo"&gt;&lt;br&gt;
          &lt;img style="display:none;width:60px;height:60px;" id="smallImage3" src="" /&gt;
  
          First Name: &lt;input type="text" id="firstname" name="firstname"&gt;&lt;br&gt;
          Last Name: &lt;input type="text" id="lastname" name="lastname"&gt;&lt;br&gt;
          Work Place: &lt;input type="text" id="workplace" name="workPlace"&gt;&lt;br&gt;
          &lt;input type="button" id="btnSubmit" value="Submit" onclick="uploadPhoto();"&gt;
      &lt;/form&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I guess there's some problem in <code>function uploadPhoto()</code>. Foreach loop is not handling imageURI properly. 
  What can be the solution?  </p>