Add Remove and Update specific data In JSON using AngularJS
In this Post We Will Explain About is Add Remove and Update specific data In JSON using AngularJS With Example and Demo.Welcome on infinityknow.com – Examples, The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to how to add, edit and delete rows of a html table with angularjsExample
Example of Add Remove and Update specific data In JSON
In this post we will show you Best way to implement how to add edit and delete rows of a html table with angularjs, hear for dynamically add remove rows in html table using angularjswith Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.
index.html
[php]
{{client.client_id}} | {{client.name}} | {{client.age}} |
|
{{client.client_id}} |
|
||
[/php]
liveCtrl.js
[php]
(function () {
‘use strict’;
angular
.module(‘liveapp’)
.controller(‘liveCtrl’, liveCtrl);
liveCtrl.$inject = [‘$scope’, ‘LiveFactory’];
function liveCtrl($scope, LiveFactory) {
$scope.clientList = LiveFactory.clientList;
function init() {
LiveFactory.get();
}
init();
$scope.detailsModel = {
“client_id”: 1,
“name”: “Format 1”,
“age”: “300×250”
};
$scope.add = function () {
$scope.clientList.push($scope.detailsModel);
};
$scope.delete = function (index) {
$scope.clientList.splice(index, 1);
};
$scope.rowedited = -1;
$scope.clienteditMo = {
“client_id”: 0,
“name”: “”,
“age”: “”
};
$scope.edit = function (index) {
$scope.rowedited = index;
};
$scope.finishEdit = function (index) {
$scope.clientList[index] = $scope.clienteditMo;
$scope.rowedited = -1;
};
}
})();
[/php]
LiveFactory.js
[php]
(function () {
‘use strict’;
angular
.module(‘liveapp’)
.factory(‘LiveFactory’, LiveFactory);
LiveFactory.$inject = [];
function LiveFactory() {
var self = this;
self.clientList = [];
self.get = $http.get(‘data/myproducts.json’)
.then(function (response) {
self.clientList = response.data;
}).catch(function (error) {
// simple generate log error
});
return self;
}
})();
[/php]
I hope you have Got What is add and delete rows dynamically with textboxes using angularjs And how it works.I would Like to have FeadBack From My Blog(infinityknow.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(infinityknow.com) Are Most Always Welcome.