CODEWITHSUNDEEP
javascriptjquerycordovajquery-mobilephonegap-plugins
tllewellyn
tllewellyn

Reputation: 913

Phonegap plugin - imagePicker - Producing Error Message

I'm trying to add the phonegap imagePicker plugin to my app and am receiving the following error when I try to call the function:

"Uncaught TypeError: Cannot read property 'getPictures' of undefined", source: file:///android_asset/www/js/main.js (85)

I installed the plugin using the CLI per the instructions. I have copied the .js to the appropriate folder and referenced it.

Here are the relevant sections of the different pages:

Html:

<!DOCTYPE html>

<html>
  <head>
    <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />
    <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />

    <link rel="stylesheet" type="text/css" href="css/index.css" />
    <link href="jquerymobile/jquery.mobile-1.4.5.css" rel="stylesheet" type="text/css" />

    <script src="js/jquery.js" type="text/javascript"></script>
    <script src="jquerymobile/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>
    <script src="js/imagepicker.js" type="text/javascript"></script>
    <script src="js/main.js"></script>
  </head>
  <body>
  <!-- a bunch of irrelevant stuff -->
    <a href="#" data-role="button" data-inline="true" data-icon="arrow-u" data-iconpos="bottom" id="btn_upload">Upload</a> 
  </body>
</html>

main.js:

$(document).on("pageshow", "#thepageinquestion", function() {
    $("#btn_upload").click(function() {
        window.imagePicker.getPictures( // <--- this is line 85
            function(results) {
                for (var i = 0; i < results.length; i++) {
                    console.log('Image URI: ' + results[i]);
                }
            }, function (error) {
                console.log('Error: ' + error);
            }
        );
    }); 
});

imagepicker.js:

cordova.define("com.synconset.imagepicker.ImagePicker", function(require, exports, module) { /*global cordova,window,console*/
/**
 * An Image Picker plugin for Cordova
 * 
 * Developed by Wymsee for Sync OnSet
 */

var ImagePicker = function() {

};

/*
*   success - success callback
*   fail - error callback
*   options
*       .maximumImagesCount - max images to be selected, defaults to 15. If this is set to 1, 
*                             upon selection of a single image, the plugin will return it.
*       .width - width to resize image to (if one of height/width is 0, will resize to fit the
*                other while keeping aspect ratio, if both height and width are 0, the full size
*                image will be returned)
*       .height - height to resize image to
*       .quality - quality of resized image, defaults to 100
*/
ImagePicker.prototype.getPictures = function(success, fail, options) {
    if (!options) {
        options = {};
    }

    var params = {
        maximumImagesCount: options.maximumImagesCount ? options.maximumImagesCount : 15,
        width: options.width ? options.width : 0,
        height: options.height ? options.height : 0,
        quality: options.quality ? options.quality : 100
    };

    return cordova.exec(success, fail, "ImagePicker", "getPictures", [params]);
};

window.imagePicker = new ImagePicker();

});

Upvotes: 0

Views: 1895

Answers (1)

tllewellyn
tllewellyn

Reputation: 913

After beating this up for hours, finally realized the external javascript file wasn't loading. Rookie mistake, I had placed the reference to the script in the page header instead of within the data-role="page" tags.

Found the answer here:

JQuery Mobile Change Page doesnt load JS files

Upvotes: 1

Related Questions