AngularJS Multiple Images uploading using PHP

Rate this post

AngularJS Multiple Images uploading using PHP

In this Post We Will Explain About is AngularJS Multiple Images uploading using PHP With Example and Demo.Welcome on – Examples, The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to AngularJS File Upload using $http post and FormDataExample

In this post we will show you Best way to implement File Upload Using AngularJS with php server script, hear for Angularjs multiple image upload using ajax and phpwith Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

READ :  Angular Multiple File Upload with PHP MySQLi


Make a HTML file and define markup


AngularJS Multiple Image upload using PHP



Make a js file and define scripting

var liveApp = angular.module(‘liveApp’, []);

liveApp.directive(‘fileModel’, [‘$parse’, function ($parse) {
return {
restrict: ‘A’,
link: function(scope, element, attrs) {
var model = $parse(attrs.fileModel);
var modelSetter = model.assign;

element.bind(‘change’, function(){
modelSetter(scope, element[0].files[0]);

liveApp.service(‘fileUpload’, [‘$http’, function ($http) {
this.uploadFileToUrl = function(file, fileuploaduri, name){
var fd = new FormData();
fd.append(‘file’, file);
fd.append(‘name’, name);
$, fd, {
transformRequest: angular.identity,
headers: {‘Content-Type’: undefined,’Process-Data’: false}
console.log(“Your File/images Success”);

liveApp.controller(‘liveCtrl’, [‘$scope’, ‘fileUpload’, function($scope, fileUpload){
$scope.multiImagesUpload = function(){
var file = $scope.myimgfile;
console.log(‘file is ‘ );

READ :  Dynamically DropDownList from JSON Array using jQuery

var fileuploaduri = “do_submit_save.php”;
var text = $;
fileUpload.uploadFileToUrl(file, fileuploaduri, text);



PHP server side scripting Languages as well as “do_submit_save.php” PHP file move_uploaded_file to your root folder /upload/products/ put all the images.

connect_error) {
die(“Database Connection failed: ” . $db_conn->connect_error);

$sql_query = “INSERT INTO live_product_mst (name,filename) VALUES (‘”.$name.”‘,'”.basename($_FILES[“file”][“name”]).”‘)”;

if ($db_conn->query($sql_query) === TRUE) {
echo json_encode($_FILES[“file”]); // simple response new file uploaded
} else {
echo “Error: ” . $sql_query . “
” . $db_conn->error;




I hope you have Got What is Angularjs Upload multiple images using jQuery, Ajax, PHP And how it works.I would Like to have FeadBack From My Blog( readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article( Are Most Always Welcome.

Leave a Reply

Your email address will not be published.