AngularJs ng-click not working with fileupload field

Question

I am new to AngularJS, and I got stuck on this ng-click when trying to set some parameters before uploading an image. Here is the code:

<div ng-controller="TestCtrl">
    <div data-ng-click="readUploadedImage('grPhoto', '{{ id }}')">
        <label class="changePhotoBtn" for="uploadBanner">Click Here</label>
        <input style="display: none;" type="file" name="Upload a file" id="uploadBanner" />
    </div>
</div>

var myApp = angular.module('myApp',[]);

function TestCtrl($scope) {
    $scope.id = 1234;

    $scope.readUploadedImage = function(parentClass, spid) {       
        alert(parentClass + ' ' + spid);
    }
}

Link to Fiddle: http://jsfiddle.net/CMJkg/2/

Rename function TestCtrl($scope) to function MyCtrl($scope) — Dhaval Marthak
– Dhaval Marthak, Commented Oct 15, 2013 at 13:19
Sorry for the naming error. The problem is it never gets to the alert(). So the method called in ng-click never gets fired. — Ioana Cucuruzan
– Ioana Cucuruzan, Commented Oct 15, 2013 at 13:23

Vianney Dupoy de Guitard · Accepted Answer · 2013-10-15 13:38:45Z

1

Change readUploadedImage('grPhoto', '{{ id }}') to readUploadedImage('grPhoto', id). Expressions in ng-click are evaluated.

Demo here.

edited Oct 15, 2013 at 13:38

answered Oct 15, 2013 at 13:31

Vianney Dupoy de Guitard

2,2641 gold badge15 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJs ng-click not working with fileupload field

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related