Skip to content

done file upload and autocomplete #23

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
rupalitomar5 merged 1 commit into from
Feb 7, 2017
Merged

done file upload and autocomplete #23

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
72 changes: 61 additions & 11 deletions login/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,29 +3,79 @@ var express=require('express');
var bodyParser=require('body-parser');
mongoose.connect('mongodb://localhost:27017/test');
var urlencodedParser=bodyParser.urlencoded({extended:true});
var cors = require('express-cors');
var Employee=require('./js/employee.js');
var app=express();
var router=express.Router();
var app = express();
app.use(urlencodedParser);
var router = express.Router();
var multer=require('multer');
router.get("/employee",function(){
var id;
app.use('/uploads',express.static(__dirname+"/upload"));
var upload=multer({dest:"./uploads/"}).array('name',1);
app.use(cors({
allowedOrigins: [
'http://localhost:63342', 'google.com'
]
}));
router.get("/employee",function(req,res){
Employee.find({},function(err,employee){
if(!err){
console.log(employee);
res.json(employee)
res.json(employee);
}
});
/*Employee.find({},"-_id Name",function(err,employees){
res.json(employees)
});*/

});
router.get("/employee/name",function(){
Employee.find({},"-_id Name",function(err,employee){
res.json(employee)
router.get("/employeename",function(req,res){
Employee.find({},"-_id Name",function(err,employees){
res.json(employees)
})
})


router.post();
router.put();
router.delete();
var storage = multer.diskStorage({
destination: function (req, file, callback) {
callback(null,'./uploads');
},
filename: function (req, file, callback) {
console.log(file);
var filename = file.originalname;
req.body.file = filename;
callback(null, file.originalname)
}
});
var upload = multer({ //multer settings
storage: storage
}).single('file');
router.post("/employee", upload,function(req,res) {
console.log("it is here");
var emp3 = new Employee();
emp3.Name = req.body.name;
Employee.findOne({Name:req.body.employee},"_id",function(err,id1){
id=id1;
})
emp3.EmployeeId = id;
emp3.File = req.body.file;
emp3.save(function (err, emp3) {
if (err) {
console.log(err);
}
console.log(emp3);
})
})


/*
router.put();*/

router.delete("/employee/:id",function(req,res){
Employee.findByIdAndRemove(req.params.id,function(err,emp){console.log(emp);});
});



app.use(urlencodedParser);
app.use('/api',router);
app.listen(8001);
6 changes: 2 additions & 4 deletions login/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,17 +6,15 @@
<title>Title</title>
<link rel="shortcut icon" href="img/favicon.png">
<!--<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>-->

<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-modal-service/dst/angular-modal-service.js"></script>
<script src="bower_components/ng-file-upload/ng-file-upload.js"></script>

<script src="bower_components/angular-bootstrap/ui-bootstrap.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-bootstrap-toggle/dist/angular-bootstrap-toggle.js"></script>
<script src="js/app.js"></script>

</head>
<body>
<div ng-view></div>
Expand Down
82 changes: 46 additions & 36 deletions login/js/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,41 +19,50 @@ angular.module('myapp',['ngRoute','ui.bootstrap','angularModalService','ngAnimat
}
})
.controller('listController',function($scope,$http){
$scope.items=['hdhsjhfshf','dshgsjhchb'];
$scope.status={
isopen:false
};
$scope.toggled=function(open){
console.log("open");
};
$scope.toggleDropDown=function($event){
$event.preventDefault();
$event.stopPropagation();
$scope.status.isopen = !$scope.status.isopen;
};
$scope.appendToEl = angular.element(document.querySelector('#dropdown-long-content'));
$scope.emp = [];
function getUser(){
$scope.getEmp=function (){
$http
.get('http://localhost:8000/api/user')
.get('http://localhost:8001/api/employee')
.then(function (d) {
$scope.emp= d.data;
console.log(d.data);
//$scope.emp=d;
})}})
.controller('ComplexController', [
'$scope', '$element', 'title', 'close',
function($scope, $element, title, close) {
'$scope', '$element', 'title','emp', 'close','Upload',
function($scope, $element, title,emp,close,Upload) {

$scope.name = null;
$scope.employee = null;
$scope.title = title;

$scope.emp2=emp;
// This close function doesn't need to use jQuery or bootstrap, because
// the button has the 'data-dismiss' attribute.
$scope.close = function() {
var add=function(){
Upload.upload({
url: 'http://localhost:8001/api/employee',
method: 'POST',
data: {
'name': $scope.name,
'employee':$scope.employee,
'file':$scope.file
}
})
.success(function(data){
//$scope.newprofile = {};
$scope.emp2 = data;

})
.error(function(data){
console.log(data);
})
}
add();
close({
name: $scope.name,
age: $scope.employee,
employee: $scope.employee,
file:$scope.file
}, 500); // close, but give 500ms for bootstrap to animate
};

Expand All @@ -65,36 +74,37 @@ angular.module('myapp',['ngRoute','ui.bootstrap','angularModalService','ngAnimat
$element.modal('hide');

// Now call close, returning control to the caller.
close({
close(
{
name: $scope.name,
age: $scope.age
employee: $scope.employee,
file:$scope.file
}, 500); // close, but give 500ms for bootstrap to animate
};

function add(){
Upload.upload({
url: 'http://localhost:8001/api/user',
method: 'POST',
data: {
'name': $scope.name,
'customer':$scope.employee
}
})
}}]
}]
)
.controller('SampleController', ['$scope', 'ModalService', function($scope, ModalService){
.controller('SampleController', ['$scope', 'ModalService','$http', function($scope, ModalService,$http){
$scope.getUser1= function() {
$scope.emp2=[];
$http
.get('http://localhost:8001/api/employeename')
.then(function (d) {
$scope.emp2 = d.data;
console.log($scope.emp2)
})
}
$scope.showComplex = function() {

$scope.getUser1();
ModalService.showModal({
templateUrl: "views/modal.html",
controller: "ComplexController",
inputs: {
title: "A More Complex Example"
title: "A More Complex Example",
emp: $scope.emp2
}
}).then(function(modal) {
// modal.element.modal();
modal.close.then(function(result) {
$scope.complexResult = "Name: " + result.name + ", EmployeeName: " + result.employee;
});
});

Expand Down
42 changes: 20 additions & 22 deletions login/views/list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,24 +1,22 @@
<div>

<div ng-controller="listController"></div>
<select ng-model="dropdown" ng-options="x for x in items" ng-click="submit()">
</select>
</div>
<div ng-controller="SampleController" data-spy="scroll" data-target="#mainNav">
<p><a href class="btn btn-default btn-lg " ng-click="showComplex()">Show Complex</a></p>
<pre ng-show="complexResult">{{complexResult}}</pre>
<div ng-controller="listController" data-ng-init="getEmp()">
<table>
<tr ng-repeat="e in emp">
<td>
{{e.Name}}
</td>
<td>
<img src="../uploads/{{e.File}}" alt="Smiley face" height="42" width="42">
</td>
<td>
{{e.EmployeeId}}
</td>
</tr>
</table>
<div ng-controller="SampleController" data-spy="scroll" data-target="#mainNav">
<p><a href class="btn btn-default btn-lg " ng-click="showComplex()">Show Complex</a></p>
<!--<pre ng-show="complexResult">{{complexResult}}</pre>-->
</div>
</div>
</div>
<table>
<tr ng-repeat="user in emp">
<td>
{{emp.Name}}
</td>
<td>
{{emp.File}}
</td>
<td>
{{emp.}}
</td>
</tr>
</table>
</div>

1 change: 0 additions & 1 deletion login/views/login.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
<script src="../bower_components/angular/angular.js"></script>
<script src="../bower_components/angular-route/angular-route.js"></script>
<script src="../js/app.js"></script>
<script src="../js/controller.js"></script>
<form ng-controller="mainController" ng-click="submit()">
<input type="text" placeholder="login"/>
<input type="text" placeholder="password"/>
Expand Down
25 changes: 18 additions & 7 deletions login/views/modal.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,30 +1,41 @@
<div class="modal fade">
<div class="modal fade" >
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" ng-click="close()" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">{{title}}</h4>
</div>
<div class="modal-body">
<div class="modal-body" >
<p>Ads the details</p>

<form class="form-horizontal" role="form">
<form class="form-horizontal" role="form" enctype="multipart/form-data" >
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" placeholder="Your Name" ng-model="name">
</div>
</div>
<div class="form-group">
<label for="image" class="col-sm-2 control-label">Age</label>
<!--<label for="image" class="col-sm-2 control-label">Employee Pic</label>-->
<div class="col-sm-10">
<input type="file" class="form-control" id="image" placeholder="File" ng-model="file">
<input
type="file"
ngf-select
ng-model="file"
name="file"
ngf-pattern="'image/*'"
accept="image/*"
ngf-max-size="20MB"
/>
</div>
</div>
<div class="form-group">
<label for="employee" class="col-sm-2 control-label"></label>
<label for="employee" class="col-sm-2 control-label">Employee </label>
<div class="col-sm-10">
<input type="text" class="form-control" id="employee" placeholder="Employee name" ng-model="employee"> <!--ng-repeat="array in ctrl.array1|filter:{year:search}-->">
<input list="employee1" id="employee" ng-model="employee">
<datalist id="employee1" ng-repeat="empl in emp2">
<option value="{{empl.Name}}">{{empl.Name}}</option>
</datalist>
</div>
</div>
</form>
Expand Down