I have one table in jquery,In which when I click delete icon I need to display bootstrap modal to perform delete action.I did it using jquery but I dont know to do it in angular..Can anyone give me some suggestions?
<body ng-app="intranet_App">
<div class="container">
<div class="modal" id="deleteProject">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body" id="confirmMessage">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="confirmOk">Ok</button>
<button type="button" class="btn btn-default" id="confirmCancel">Cancel</button>
</div>
</div>
</div>
</div>
<div class="col-xs-12 margin20 padding table-responsive">
<table class="col-xs-12 table table-hover table-bordered" id="projectList" ng-controller="myCtrl">
<thead class="colorBlue">
<tr><th>Project Name</th><th>Client</th><th>Client Co-ordinator</th><th>Action</th></tr>
</thead>
<tbody id="projectListTBody" >
<tr ng-repeat="x in projectList | filter:ProjectName">
<td>{{ x.ProjectName}}</td>
<td>{{ x.Client}}</td>
<td>{{ x.OnsiteCoordinator}}</td>
<td>
<i class="fa fa-user-plus fa-2x" ng-click="addResource()"></i>
<i class="fa fa-edit fa-2x" ng-click="editProj(x.Id)"></i>
<i class="fa fa-trash fa-2x" data-toggle="modal" data-target="#myModal" data-dismiss="modal" ng-click="deleteProject(x.Id)"></i>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
<script>
var app = angular
.module("intranet_App", [])
.controller("myCtrl", function ($scope, $http) {
$scope.projDetails = [];
$http.post('/Project/getProjectsList')
.then(function (response) {
console.log(response)
$scope.projectList = response.data;
})
$scope.editProj = function (x) {
$scope.projectDetails(x);
window.location = "/Project/EditProject?id=" + x;
}
$scope.projectDetails = function (x) {
$scope.projDetails.push(x);
$scope.json = angular.toJson($scope.x)
console.log($scope.json)
}
$scope.addResource = function () {
window.location = "/Project/ProjectRes";
}
});
</script>
This is my jquery methods:
function deleteProject(control) {
event.stopPropagation()
id = $(control).closest('tr').attr('id');
confirmDialog("Are you sure do you want to delete this Project?", function () {
removeProject(id)
});
}
function removeProject(elem) {
var updatedBy = $("#userName").text();
var ajxObj = { id: elem};
$.ajax({
type: "POST",
url: "/project/ProjectDelete",
data: JSON.stringify(ajxObj),
contentType: "application/json; charset=utf-8",
dataType: "json",
async: true,
cache: false,
success: function (msg) {
$(".success").html("project Deleted successfully!");
$('.success').show();
setTimeout(function () {
$('.success').hide();
}, 1000);
loadProjectsList()
}
});
}
You can use bootstrap angular model popup.
for more information https://angular-ui.github.io/bootstrap/#!#modal
Related
I am constantly getting the mentioned error no matter what I try. The error stops when I comment out the "fetchCourses()" in courses.js file. I am guessing the error is somewhere in the http request but I cannot figure it out.
Here are my code snippets.
courses.js (controller)
var app = angular.module("app");
app.controller('coursesCtrl', ['$scope', 'Courses', '$routeParams', function ($scope, Courses, $routeParams) {
function fetchCourses() {
Courses.getCourses({}).then(function (res) {
$scope.courses = res.data;
}, function (err) {
console.log(err);
});
}
fetchCourses();
$scope.modal = {
title: "Modal",
btnText: "Ok",
save: function () {
if ($scope.modal.type == 'course_delete') {
Courses.deleteCourse($scope.modal.req).then(function (res) {
if (res.status == 200) {
$scope.courses.splice($scope.modal.req.index, 1);
$("#course_modal").modal("hide");
}
}, function (err) {
console.log(err);
});
} else if ($scope.modal.type == 'course_create') {
Courses.createCourse($scope.modal.req).then(function (res) {
$scope.courses.unshift(res.data);
$("#course_modal").modal("hide");
}, function (err) {
console.log(err);
});
} else if ($scope.modal.type == 'course_edit') {
$scope.courses[$scope.modal.req.index] = $scope.modal.req.course;
$("#course_modal").modal("hide");
$scope.modal.req.course = null;
}
},
type: "default",
req: {},
};
$scope.createCourse = function () {
$("#course_modal").modal("show");
$scope.modal.title = "Create course";
$scope.modal.btnText = "Create";
$scope.modal.type = "course_create";
$scope.modal.req = {};
};
$scope.editCourse = function (index) {
$("#course_modal").modal("show");
$scope.modal.title = "Edit course";
$scope.modal.btnText = "Ok";
$scope.modal.type = "course_edit";
$scope.modal.req.index = index;
};
$scope.deleteCourse = function (index) {
$("#course_modal").modal("show");
$scope.modal.title = "Delete course";
$scope.modal.btnText = "Yes";
$scope.modal.type = "course_delete";
$scope.modal.req.index = index;
};
}]);
Route.js
var Students = require('../../models/students');
var Courses = require('../../models/courses');
var Departments = require('../../models/departments');
var Exams = require('../../models/exams');
var ObjectId = require('mongoose').Types.ObjectId;
var bodyParser = require('body-parser');
module.exports = function (app) {
app.use(bodyParser.urlencoded({
extended: true
}));
app.post('/getCourses', (req, res) => {
Courses.find({}).exec(function (err, documents) {
res.send(documents);
console.log(documents);
});
});
app.post('/createCourse', (req, res) => {
var data = {
coursesName: req.body.coursesName,
coursesProfessor: req.body.coursesProfessor,
coursesDepartment: req.body.coursesDepartment,
coursesNumStudents: req.body.coursesNumStudents,
};
Courses.create(data, function (err, document) {
if (err) return res.status(500).send({
message: "Sorry! There was a problem creating a course."
});
res.send(document);
console.log(document);
});
});
};
menu.js (aka header)
var menu = angular.module("menu", []);
menu.controller('menuCtrl', ['$scope', '$location', function ($scope, $location) {
/*
if (notloggedin){
window.location.replace("/");
}
*/
$scope.logout = function () {
window.location.replace("/");
}
$scope.url = $location.url();
console.log($location.url());
}]);
menu.service('Courses', ['$http', function ($http) {
var Headers = {
'Content-Type': 'application/x-www-form-urlencoded',
}
var transformReq = function (obj) {
var str = [];
for (var p in obj)
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
return str.join("&");
}
this.getCourses = function (req) {
return $http({
method: 'POST',
url: '/getCourses',
headers: Headers,
transformRequest: transformReq,
data: req
});
}
this.createCourse = function (req) {
return $http({
method: 'POST',
url: '/createCourse',
headers: Headers,
transformRequest: transformReq,
data: req
});
}
}]);
And the courses.html
<div class="wrapper">
<div ng-include="'header/menu.html'"></div>
<div class="main-panel">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar bar1"></span>
<span class="icon-bar bar2"></span>
<span class="icon-bar bar3"></span>
</button>
<a class="navbar-brand" href="#">Courses</a>
</div>
</div>
</nav>
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="header">
<h4 class="title">Courses List</h4>
<p class="category">Here is a list of all courses</p>
<button class="btn btn-success" style="float:right" ng-click="createCourse()">Create Course</button>
</div>
<div class="content table-responsive table-full-width">
<table class="table table-striped">
<thead>
<th>Name</th>
<th>Professor</th>
<th>Department</th>
<th>Num of Students</th>
<th>#</th>
</thead>
<tbody>
<tr ng-repeat="c in courses">
<td>{{c.coursesName}}</td>
<td>{{c.coursesProfessor}}</td>
<td>{{c.coursesDepartment}}</td>
<td>{{c.coursesNumStudents}}</td>
<td>
<a href="" ng-click="editCourse($index)">Edit
</a> /
<a href="" ng-click="deleteCourse($index)">Delete
</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="course_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h5 class="modal-title" id="modalLabel">{{modal.title}}</h5>
</div>
<div class="modal-body">
<div class="row">
<div class="col">
<form ng-if="modal.type == 'course_create' || modal.type == 'course_edit'">
<div class="form-group">
<label for="coursesName">Name</label>
<input type="text" class="form-control" ng-model="modal.req.course.coursesName" ng-disabled>
</div>
<div class="form-group">
<label for="coursesProfessor">Professor</label>
<input type="text" class="form-control" ng-model="modal.req.course.coursesProfessor" ng-disabled>
</div>
<div class="form-group">
<label for="coursesDepartment">Department</label>
<input type="text" class="form-control" ng-model="modal.req.course.coursesDepartment" ng-disabled>
</div>
<div class="form-group">
<label for="coursesNumStudents">Number of Students</label>
<input type="text" class="form-control" ng-model="modal.req.course.coursesNumStudents" ng-disabled>
</div>
</form>
<div ng-if="modal.type == 'course_delete'">
Are you sure you want to delete this course?
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-success" ng-click="modal.save()">{{modal.btnText}}</button>
</div>
</div>
</div>
</div>
This means that $scope.courses have some values which are duplicate. Duplicate keys are banned because AngularJS uses keys to associate DOM nodes with items.
So in this case you can use track by $index So repeated items will be tracked by its index.
<tr ng-repeat="c in courses track by $index">{{value}}</tr>
i want to inject my children view into a web.
I have declared my config:
var states = [
{
name: 'application',
url: '/application',
component: 'application'
},
{
name: 'application.detail',
url: '/:id',
component: 'applicationInfo'
}
];
// Loop over the state definitions and register them
states.forEach(function(state) {
$stateProvider.state(state);
});
i have a button, which tries? to inject view
<button type="button" ui-sref="application.detail({id: application.id})" class="btn btn-sm btn-danger">
<i class="glyphicon glyphicon-info-sign">
</i>
</button>
And a component:
angular.module('crudModule').component('applicationInfo', {
template: '<h1>hellllooooooooo</h1>',
controller: function($stateParams) {
}
});
EDITED:
application component:
angular.module('crudModule').component('application', {
templateUrl: 'applicationModule.html',
controller: function($http, $scope, httpService, $cookies, $log, $document, $dialogs) {
httpService.httpGetRequest('http://localhost:8080/applications').then(function success(response) {
$scope.applications = response.data;
$scope.displayedApplications = [].concat($scope.applications);
})
$scope.deleteApplication = function (id) {
$http({
method: 'DELETE',
url: "http://localhost:8080/application/" + id,
}).then(function success(response) {
httpService.httpGetRequest('http://localhost:8080/applications').then(function success(response) {
$scope.applications = response.data;
$scope.displayedApplications = [].concat($scope.applications);
})})
};
}
});
applicationModule html:
<table st-table="applications" st-safe-src="displayedApplications" class="table table-striped" style="width: auto;">
<thead>
<tr>
<th st-sort='id'>Id</th>
<th st-sort='name'>Name</th>
</thead>
<tbody>
<tr ng-repeat="application in applications">
<td>{{application.id}}</td>
<td>{{application.name}}</td>
<td>More info
<button type="button" ui-sref="application.detail({id: application.id})" class="btn btn-sm btn-danger">
<i class="glyphicon glyphicon-info-sign">
</i>
</button>
</td>
</tr>
</tbody>
</table>
<div class="form-group">
<button class="btn btn-primary" ui-sref="addApplication">Add new</button>
</div>
<div class="form-group">
<button type="button" class="btn btn-default" ng-click="open()">Open me!</button>
</div>
I have included application module:
When i click on the button my url changes to /application/(number) but the view does not change.
You need to have in your application component:
<ui-view></ui-view>
Because the router search this to put the content.
Check the oficial documentation for this:
https://ui-router.github.io/ng1/tutorial/hellogalaxy
the pushed data from the model is not reflecting in the first table. It is there in console. The fiddle link is attached with this please help me on this.
fiddle link ---- http://jsfiddle.net/8MVLJ/2649/
html=========
<script src="https://code.angularjs.org/1.4.9/angular.min.js"></script>
<script src="https://rawgit.com/dwmkerr/angular-modal-service/master/dst/angular-modal-service.js"></script>
<div class="container" ng-app="app" ng-controller="Controller">
<div class="row">
<div class="col-xs-12">
<table class="table table-striped table-bordered">
<thead>
<th>Attribute Name</th>
<th>Attribute Value</th>
</thead>
<tbody>
<tr ng-repeat="newdetail in newDetails">
<td>
<p ng-model="detail">{{newdetail.attrName}} </p>
</td>
<td>
<p ng-model="detailValue">{{newdetail.userAttrValue}} </p>
</td>
</tr>
</tbody>
</table>
<a class="btn btn-default" href ng-click="show()">Select Attribute</a>
<script type="text/ng-template" id="modal.html">
<div class=" ngdialog-messsage modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" ng-click="close('Cancel')" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-xs-12">
<table class="table table-striped table-bordered">
<thead>
<th>
<input type="checkbox" ng-model="allSelected" ng-model-options="{getterSetter: true}">
</th>
<th>Attribute Name</th>
<th>Attribute Value</th>
</thead>
<tbody>
<tr ng-repeat="detail in details">
<td>
<input type="checkbox" ng-model="detail.Selected">
</td>
<td>
<p ng-model="detail">{{detail.attrName}}</p>
</td>
<td>
<select ng-model="detail.user_attr_value" ng-init="detail.user_attr_value=detail.attr_value_Ind.split(',')[0]" class="form-control full-width">
<option ng-repeat="option in detail .attr_value_Ind.split(',')" value="{{option}}">{{option}}</option>
</select>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="modal-footer">
<div class="form-group">
<input type="button" class="btn btn-primary" value="Add Selected" ng-click="add();close('Cancel')">
<input type="button" class="btn btn-danger " ng-click="checkAll(details.length)" value="Clear">
</div>
</div>
</div>
</div>
</div>
</script>
</div>
</div>
</div>
js===================
var app = angular.module('app', ['angularModalService']);
app.controller('Controller', function($scope, $element, ModalService) {
$scope.newDetails = [{
"attrName": "userType",
"userAttrValue": "Customer",
"userOrGroupId": "aaaazzz8522",
}];
$scope.add = function() {
angular.forEach($scope.details, function(detail) {
if (detail.Selected == true) {
$scope.newDetails.push({
'attrName': detail.attrName,
'attrName': detail.user_attr_value
});
$element.modal('hide');
close($scope.newDetails, 500);
console.log("loop", $scope.newDetails);
}
});
};
$scope.show = function() {
ModalService.showModal({
templateUrl: 'modal.html',
controller: "Controller"
}).then(function(modal) {
modal.element.modal();
modal.close.then(function(result) {});
});
};
//=================================================
$scope.close = function(result) {
close(result, 600);
};
$scope.details = [{
"attrName": "region",
"attrType": "USER",
"attr_value_Ind": "CHN-N,CHN-S,CHN-C",
"buId": "DEFAULT",
}];
var getAllSelected = function() {
var selecteddetails = $scope.details.filter(function(detail) {
return detail.Selected;
});
return selecteddetails.length === $scope.details.length;
}
var setAllSelected = function(value) {
angular.forEach($scope.details, function(detail) {
detail.Selected = value;
});
}
$scope.allSelected = function(value) {
if (value !== undefined) {
return setAllSelected(value);
} else {
return getAllSelected();
}
}
$scope.checkAll = function(Count) {
angular.forEach($scope.details, function(details) {
details.Selected = false;
});
};
});
i have updated your fiddle please check and review.http://jsfiddle.net/8MVLJ/2652/
it's not pushing it's value because you have pass scope in your modal controller and set parent scope like this
ModalService.showModal({
templateUrl: 'modal.html',
controller: "Controller",
scope:$scope <-- added here scope
}).then(function(modal) {
modal.element.modal();
modal.close.then(function(result) {});
});
and add $parent to push your value like this
$scope.$parent.newDetails.push({ <-- added $parent here
'attrName': detail.attrName,
'userAttrValue': detail.user_attr_value
});
I have been stuck in something simple that I think I haven't solved yet because of a lack of experience. Here is the catch I have a very simple controller which load the data from a service when I first Load the modal but once I tried to use the CRUD operations (hopefully working!!) the datatable doesn't update. I will share the code. Thanks of all.
I need that after insert, for example, the datatable update meaning rerender the current list of elements.
Call of the Modal
vm.openBooksModal = function (authorId) {
var modalInstance = $uibModal.open({
templateUrl: '/app/book/index.html,
controller: 'BooksController',
size: '',
resolve: {
authorId: function () {
return authorId;
}
}
});
Modal Controller
(function () {
'use strict';
angular.module('bookApp').controller('BooksController', BooksController);
BooksController.$inject = ['$uibModalInstance', '$scope', 'authorId', 'bookService', 'DTOptionsBuilder', 'DTColumnDefBuilder',
'DTColumnBuilder', 'dtUtils','alertService'];
function NotesController($uibModalInstance, $scope, authorId, bookService, DTOptionsBuilder, DTColumnDefBuilder,
DTColumnBuilder, dtUtils, alertService) {
$scope.authorId= authorId;
$scope.book= {
id: 0,
title:''
};
//if (angular.isDefined())
$scope.cancel = function () {
$uibModalInstance.dismiss('cancel');
}
$scope.dtBooksColumnDefs = [
DTColumnDefBuilder.newColumnDef(0).notSortable()
];
$scope.dtBooksOptions = DTOptionsBuilder
.newOptions()
.withOption('bFilter', false)
.withOption('order', [[2, 'desc']])
.withOption('aaSorting', [])
.withOption('lengthMenu', [[5, 10, 25, 50], [5, 10, 25, 50]]);
$scope.dtBooksInstance = {};
$scope.LoadData = LoadData();
function LoadData(){
return bookService.getBook($scope.authorId).$promise
.then(getBookCompleted, handleError);
}
$scope.save = function (newTitle) {
$scope.book.title= newTitle;
bookService.saveBook($scope.book.id, $scope.authorId, $scope.book.title).$promise
.then(saveBookCompleted, handleError);
LoadData();
}
$scope.editBook= function( book){
$scope.book= book;
$scope.newTitle= book.title;
}
$scope.deleteBook = function( book){
bookService.deleteBook(book.id).$promise
.then(saveBookCompleted, handleError);
}
//private methods
function getBookCompleted(data) {
$scope.leadBookList = data;
debugger;
if (angular.isDefined($scope.dtBookInstance.rerender)) {
$scope.dtBooksInstance.rerender();
}
$scope.book= { };
$scope.newTitle = '';
}
function saveBookCompleted() {
bookService.getBook($scope.authorId).$promise
.then(getBookCompleted, handleError);
}
function handleError(response) {
alertService.error("Error trying to add a Note. Please try again later or contact IT.");
}
}
})();
HTML TEMPLATE
<div class="modal-header">
<h3 class="modal-title">Books</h3>
</div>
<div class="modal-body">
<div class="book-container">
<div class="head">
</div>
<div class="book">
<div class="form-group">
<div class="row">
<div class="col-lg-12">
<label class="control-label">{{headerLabel}}</label>
<textarea id="newTitle" class="comment-textarea" data-ng-model="newTitle" rows="8" cols="90"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<table id="tblBooks" datatable="ng" class="table table-striped table-bordered font-xs"
dt-options="dtBookOptions" dt-column-defs="dtBookColumnDefs" >
<thead>
<tr>
<th></th>
<th></th>
<th>Title</th>
<th>Created By</th>
<th>Created Date</th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="book in BookList">
<td>
<button class="btn btn-sm btn-warning" ng-click="editBook(book)">
<i class="fa fa-pencil"></i>
</button>
</td>
<td>
<button class="btn btn-sm btn-danger" ng-click="deleteBook(book)">
<i class="fa fa-trash-o"></i>
</button>
</td>
<td>{{book.title}}</td>
<td>{{book.createdBy}}</td>
<td>{{book.createdDate | date:'MM/dd/yyyy HH:mm:ss'}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer margin-top-0">
<button class="btn btn-primary" ng-click="save(newBook)" data-ng-disabled="newTitle === ''">Save</button>
<button class="btn btn-primary" ng-click="cancel()">Close</button>
</div>
Thanks
You're calling getBookCompleted twice. First after save in the saveBookCompleted function and second in the loaddata function
$scope.save = function (newTitle) {
$scope.book.title= newTitle;
bookService.saveBook($scope.book.id, $scope.authorId, $scope.book.title).$promise
.then(saveBookCompleted, handleError);
// remove this line since you're already call saveBookCompleted
//LoadData();
}
I am using a simple CRUD API in MEAN STACK with a delete function
app.delete('/api/users/:user_id', function(req, res) {
users.remove({
_id : req.params.user_id
}, function(err, user) {
if (err)
res.send(err);
users.find(function(err, users) {
if (err)
res.send(err)
res.json(users);
});
});
});
The controller
var app = angular.module('usersList', []);
app.controller('usersController', function($scope, $http) {
$http.get('/api/users')
.success(function(userData) {
$scope.users = userData;
$scope.length = userData.length;
})
.error(function(data) {
console.log('Error: ' + data);
});
$scope.deleteUser = function(id) {
$http.delete('/api/users/' + id)
.success(function(data) {
$scope.users = data;
console.log(data);
})
.error(function(data) {
console.log('Error: ' + data);
});
};
});
In the HTML file I populate a table as follow with a btn to open modal with corresponding user details by getting the {{$index}}
<body data-ng-controller="usersController">
<table>
<thead>
<tr>
<th>#</th>
<th>ID</th>
<th>Login</th>
<th>Email</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="userData in users" >
<td><input type="checkbox"/></td>
<td>{{ userData._id }}</td>
<td>{{ userData.id_userLogin }}</td>
<td>{{ userData.email }}</td>
<td>
<!-- Button trigger for Delete modal -->
<button type="button" data-toggle="modal" data-target="#deleteModal{{$index}}" data-ng-click="Clear()">
<span class="glyphicon glyphicon-trash"></span>
</button>
<!-- Delete Modal -->
<div class="modal fade" id="deleteModal{{$index}}" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Delete <strong>{{ userData.id_userLogin }}</strong> account</h4>
</div>
<div class="modal-body">
<div class="alert alert-danger" role="alert">Are you sure you want to delete this account?</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger" data-ng-click="deleteUser(user._id)">Delete</button>
</div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
How can I use the API to delete the corresponding user from the modal as following does not work
<button type="button" class="btn btn-danger" data-ng-click="deleteUser(user._id)">Delete</button>
It is important that the modal is not a confirm delete popup but a modal with content from where the delete button will delete the corresponding user. Any help would be appreciated.
Seem like the problem is solved. I'll just post the answer here. The html of the button should be:
<button type="button" class="btn btn-danger" data-ng-click="deleteUser(userData._id)">Delete</button>
<!-- Use userData._id instead of user._id-->