Add Remove and Update specific data In JSON using AngularJS

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!.

READ :  Get Count of Visitors in Website using Asp.net and C#.Net

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;

READ :  vue js getelementbyid Method DOM in VUE

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]

Example

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.

Leave a Comment