kusumar...@gmail.com
Mar 22, 2016, 8:04:38 AM3/22/16
to AngularJS
Hi to all,
i am new to angular js,i created json file manually,
i am loading json data into angular js file and using ng-repeat i am looping it si working good for me,but i want to edit and save data into json file is it possible..this is my code
<html>
===============
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css">
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="angular-resource.js"></script>
<!-- <script src="app.js"></script> -->
<script>
var app=angular.module("myModule",['ngResource']);
app.controller("myController",['$scope','$resource',function($scope,$resource) {
var Record=$resource('http://localhost/example/resource/database.json/:id',{id:'@id'},{query:{'method':'GET',isArray:false}});
Record.get(function(data){
$scope.list=data.records;
});
}]);
</script>
</head>
<body ng-app="myModule" ng-controller="myController">
<form role="form" name="registrationForm">
<div class="form-group col-md-6">
<label for"fname">First Name:</label>
<input class="form-control" type="text" ng-model="user.Fname">
</div>
<div class="form-group col-md-6">
<label for="lname">Last name:</label>
<input type="text" name="lname" ng-model="user.Lname" class="form-control">
<span ng-show="registrationForm.userLname.$error.required" class="error">Please fill last name</span>
</div>
<div class="control-group col-md-6">
<label class="radio-inline">
<input name="radioGroup" id="radio1" value="Male" ng-model="user.gender" type="radio"> Male
</label>
<label class="radio-inline">
<input name="radioGroup" id="radio2" value="Female" ng-model="user.gender" type="radio"> Female
</label>
</div>
<div class="form-group col-md-6">
<label for="email">Email:</label>
<input type="email" name="email" ng-model="user.email" class="form-control">
</div>
<button type="submit" class="btn btn-primary" ng-click="add(user)">submit</button>
</form>
<table class="table table-stripped">
<tr>
<th>Id</th>
<th>First Name</th>
<th>Last Name</th>
<th>Gender</th>
<th>Email</th>
</tr>
<tbody ng-repeat="x in list">
<tr>
<td>{{x.id}}</td>
<td>{{x.Fname}}</td>
<td>{{x.Lname}}</td>
<td>{{x.gender}}</td>
<td>{{x.email}}</td>
<td><button type="button" ng-click="getUser(x)">getUser</button></td>
</tr>
</tbody>
</table>{{test.fname}}
</body>
</html>
app.js
=======
angular.module('jsonData',['ngResource'])
.factory('jsonData',function($resource){
var factory={};
factory.records=function(){
return $resource('http://localhost/example/resource/database',{query:{method:'GET',isArray:true}});
}
return factory;
});
database.json
=================
{
"records":[{"id":1,"Fname":"sirish","Lname":"reddy","gender":"male","email":"ssir...@gmail.com"},
{"id":2,"Fname":"gowtham","Lname":"reddy","gender":"male","email":"gow...@gmail.com"},
{"id":3,"Fname":"pavan","Lname":"reddy","gender":"male","email":"pa...@gmail.com"},
{"id":4,"Fname":"kumar","Lname":"reddy","gender":"male","email":"ku...@gmail.com"}]
}
Sander Elias
Mar 23, 2016, 2:18:43 AM3/23/16
to AngularJS
Hi Kusumar...
You can't save files from within JS in your browser. The browser will not allow this for (mostly) security reasons. You will need a 'server' part for this. As I'm unaware of your knowledge it is difficult to advise one blindly, but json-rest-server is fairly easy to use and install. This is a solution that is aimed at learning and developing. If you need to go to production, you need something more.
Regards
Sander
Reply all
Reply to author
Forward
0 new messages