Hi Sander,
Thanks a lot!
I modified the code a bit and tried again. But, it doesn't seem to work
still!
What could be wrong here?
View:
--------
<html>
<head>
<title>Home</title>
<script src="js/angular.min.js"></script>
<script src="/js/jquery.min.js"></script>
<script src="assets/js/myscript.js"></script>
</head>
<body>
<div ng-app="myPhoto">
<div ng-controller="myControl">
<div class="photoUpload box">
<center>
<b><i>
{{message}}
</i></b>
</center>
<form id="imageform" enctype="multipart/form-data" method=
"POST">
<table align="left" cellpadding="10">
<caption><h2>Create an album!</h2><hr></caption>
<div ng-model="file.err"></div>
<tr>
<th><label for="album">Album:</label></th>
<td><input type="text" ng-model="file.album"
placeholder="Enter the album name" class="form-control"></td>
</tr>
<tr>
<th><label for="photo">Photo:</label></th>
<td><input type="file" ng-model="file.photo"
multiple class="form-control"></td>
</tr>
<tr>
<th><label for="title">Photo title:</label></th>
<td><input type="text" ng-model="file.pictitle"
placeholder="Enter the photo title or caption" class="form-control"></td>
</tr>
<tr>
<th><label for="files">Preview file:
</label></th>
<td>
<div ng-model="file.preview" class=
"previewfile"><img src=""></img></div>
</td>
</tr>
<tr>
<th colspan="2">
<button type="button" class="btn-primary"
ng-model="file.uploadimg" ng-click="uploadimg()">Upload</button>
<button type="button" class="btn-primary">
Reset</button>
</th>
</tr>
</table>
</form>
</div>
</div>
</div>
</body>
</html>
Script:
---------
var obj = angular.module("myPhoto", []);
obj.controller("myControl", function($scope, $http){
$scope.file = {};
var formData = new FormData();
formData.append("file", $scope.file);
$scope.uploadimg = function(){
$http({
method: "POST",
url:"index.php",
data: $.param({'formData':$scope.formData}),
transformRequest:angular.identity,
headers: {'Content-Type': 'multipart/form-data'}
//headers: {'Content-Type':
'application/x-www-form-urlencoded; charset=UTF-8'}
}).success(function (response,status) {
if(status==200)
{
//console.log(response);
$scope.message = response;
$scope.file.preview.html(data).fadeIn();
$scope.formData[0].reset();
}
}).error(function(response,status){
$scope.file.err.html(data).fadeIn();
});
}
});
Controller:
---------------
<?php
$formData = $_POST['formData'];
$album = $formData['fname'];
$pictitle = $formData['pictitle'];
$uploadimg = $formData['uploadimg'];
$conn = mysqli_connect("localhost","root","","angularjs");
/* mysql_connect("localhost","root","");
mysql_select_db("angularjsdb"); */
if(isset($uploadimg)){
$image = addslashes(file_get_contents($_FILES['photo'][
'tmp_name']));
echo $query = "Insert into image(ALBUM, PHOTO, TITLE)
values('$album','$image', '$pictitle');";
$sts = mysqli_query($conn, $query);
if($sts == true)
echo "Success";
else
echo "Failure";
}
?>
Regards,
Anshul
On Saturday, December 10, 2016 at 5:07:37 PM UTC+5:30, Sander Elias wrote:
>
> Hi Ansul,
>
> You are pretty much on the good path!
> You need to set your transformRequest, otherwise angular will mess up your
> files.
> If you don't get it figured out, ping back to me, and I will reveal a bit
> more. (BTW if you search in this group for "upload file" you will find
> quite some hints.. ;) )
>
> As you said you want to figure it out yourself, I won't post a complete
> sample ;)
>
> Regards
> Sander
>
>
--
You received this message because you are subscribed to the Google Groups
"Angular" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
