cordova camera not showing image in div

Everything works fine other then the div is not showing the photo, I'm not sure where i have made the error. I am using the newest version of phonegap cli-5.2.0 and i have been over and over the docs trying to find where i might have gone wrong

html

<div id="myImage"></div>

CSS

#myImage
        {
         width:80%; 
         padding:2%; 
         left:7.5%; 
         top:15%; 
         background-color:#111; 
         height:50%; 
         border: 3px solid #111;
         }

JS

  $(document).ready(function() {
        $("#camera").click(function() {
            navigator.camera.getPicture(onSuccess, onFail, { 
            quality : 75,
            destinationType: Camera.DestinationType.FILE_URI,
            sourceType : Camera.PictureSourceType.CAMERA,
            encodingType: Camera.EncodingType.JPEG,
            targetWidth: 300,
            targetHeight: 300,
            popoverOptions: CameraPopoverOptions,
            saveToPhotoAlbum: true });

    function onSuccess(imageURI) {
        var image = document.getElementById('myImage');
        image.src = imageURI;

    }

    function onFail(message) {
        alert('Failed because: ' + message);
    }
        });
    });

Upvotes: 1

Views: 1128

Answers (3)

OneWeekCreations
OneWeekCreations

Reputation: 1

I think that the "saveToPhotoAlbum Option" has to be false

Upvotes: 0

KAUSHAL J. SATHWARA
KAUSHAL J. SATHWARA

Reputation: 994

OK then You want to for both then first of all bellow code try for android.

<img id="myImage" >

<script type="text/javascript">
            var profileImage = '';
            function profileCapturePhotoEdit() {
              navigator.camera.getPicture(profileonPhotoDataSuccess, onFail, {
                quality: 20, allowEdit: true,
                correctOrientation: true,
                destinationType: Camera.DestinationType.DATA_URL,
                sourceType: Camera.PictureSourceType.CAMERA }
                                         );
            }

            function profileonPhotoDataSuccess(imageData) {
              localStorage.setItem("imageDataProfile","data:image/jpeg;base64," + imageData);
              var imageDataProfile = localStorage.getItem("imageDataProfile");
              document.getElementById('myImage').src = imageDataProfile;
            }

            function onFail(message) {
              // alert('Failed because: ' + message);
            }

          </script>

and add cordova.js and camera related permissions for android.

Upvotes: 0

jcesarmobile
jcesarmobile

Reputation: 53301

You can't put an image on a div, the div doesn't have src, you have to put it on an img tag

<img id="myImage" src=""/>

Upvotes: 1

Related Questions