Join the Stack Overflow Community
Stack Overflow is a community of 6.6 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up

I need one help.I need to store image in my local folder using Angular.js and PHP.I am explaining my code below.

<div class="col-md-6 bannerimagefile" ng-controller="imgController">
    <form  name="form">
        <label for="bannerimage" accesskey="B">
            <span class="required">*</span> Banner Image
        </label>
        <input type="file" class="filestyle" data-size="lg" name="bannerimage" id="bannerimage" ngf-select ng-model="file" name="file" ngf-pattern="'image/*'" accept="image/*" ngf-max-size="20MB" ngf-min-height="100" ngf-resize="{width: 100, height: 100}" custom-on-change="uploadFile" multiple>
        <label for="bannerimage" accesskey="B" >
            <span class="required">*</span> View Image
        </label>
        <div style="padding-bottom:10px;" ng-repeat="step in stepsModel">
            <img ng-src="{{step}}" border="0" name="bannerimage" style="width:70px; height:70px;">
        </div>
        <div>
            <input type="button" id="btn" ng-click="submitImage();" value="Upload" />
        </div>
        <div class="clear"></div>
    </form>
</div>

The controller file is given below.

var app=angular.module('testImage',['ngFileUpload']);
app.controller('imgController',function($scope,$http){
    $scope.submitImage=function(){
        console.log('image',$scope.file);
    }
    $scope.stepsModel = [];
    $scope.uploadFile = function(event){
        console.log('event',event.target.files);
        var files = event.target.files;
        for (var i = 0; i < files.length; i++) {
            var file = files[i];
            var reader = new FileReader();
            reader.onload = $scope.imageIsLoaded; 
            reader.readAsDataURL(file);
        }
    };
    $scope.imageIsLoaded = function(e){
        $scope.$apply(function() {
            $scope.stepsModel.push(e.target.result);
        });
    }
});
app.directive('customOnChange', function() {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var onChangeHandler = scope.$eval(attrs.customOnChange);
            element.bind('change', onChangeHandler);
        }
    };
});

Here my requirement is when user will click on upload button the validation will check and image will save inside the project folder.I am using Angular.js and PHP. Please help me to do this.

share|improve this question

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.