lundi 28 novembre 2016

$.param() not working with file angularjs

I am new in angularjs working with file upload but it is not working giving me error

TypeError: Illegal invocation

My html code is

<form name="form" enctype="multipart/form-data" class="form-horizontal"  onkeypress="return event.keyCode != 13;" id="myform" ng-init="url =''; _token =''">
    <div class="form-group">


        <div class="col-md-6">
            <label for="name" class="control-label">*School Name:</label>
            <input  type="text" class="form-control" data-validation="required" name="school_name" ng-model="formdata.school_name"  value="<% formdata.school_name %>"  autofocus>

        </div>

        <div class="col-md-6">
            <label for="name" class="control-label">*Logo:</label>
            <input  type="file" class="form-control" data-validation="required mime size" data-validation-allowing="jpg, png, gif" data-validation-max-size="5M" name="logo" fileread="formdata.logo"  >
        </div>

    </div>
</form>

My js code is

var app = angular.module('appinit', [],function($interpolateProvider){
       $interpolateProvider.startSymbol('<%');
    $interpolateProvider.endSymbol('%>');
});


app.directive("fileread", [function () {
    return {
        scope: {
            fileread: "="
        },
        link: function (scope, element, attributes) {
            element.bind("change", function (changeEvent) {
                var reader = new FileReader();
                reader.onload = function (loadEvent) {
                    scope.$apply(function () {
                        scope.fileread = changeEvent.target.files[0];
                    });
                }
                reader.readAsDataURL(changeEvent.target.files[0]);
            });
        }
    }
}]);

app.controller('CrudController', function ($scope, $http) {

 $scope.save = function (modalstate, id) {

        var url = $scope.url;
        var method = "POST";
        var data={};
        data = $scope.formdata;

        if (!$("#myform").isValid()) {
            return false;
        } else {

            $http({
                method: method,
                url: url,
                data: $.param(data),
                headers: {'Content-Type': 'application/x-www-form-urlencoded'},

            }).success(function (response) {
            }).error(function (response) {
                alert('This is embarassing. An error has occured. Please check the log for details');
            });
        }

    }
});

I think the problem is in $.param(data) it is not processing file object. I want to make this function general it will use in all crud to save data. I am using ng-model="formdata.any_name" with all input to make it general.I will just call $scope.formdata to get all form data. It is working perfectly with my other form that is without file but problem when i use it with file. Kindly help me to solve my problem



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire