Skip to content

Instantly share code, notes, and snippets.

@Avinava
Last active August 29, 2015 14:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Avinava/9e65549036c25b5b5d4a to your computer and use it in GitHub Desktop.
Save Avinava/9e65549036c25b5b5d4a to your computer and use it in GitHub Desktop.
Angular JS & SObject Remote : Part 2 Updating Data from Page #NoControllers
<apex:page >
<apex:includeScript value="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"/>
<c:sObjectRemote />
<script>
var vfApp = angular.module('vfApp',[]);
vfApp.controller('vfappController',function($scope){
$scope.accounts = []
$scope.getAccounts = function(){
sObject.query('SELECT Id,Name,Site,Type,Phone FROM Account LIMIT 100',function(result){
$scope.accounts = result;
$scope.$apply();
})
}
$scope.update = function(a){
/*remove angular added properties e.g. $$hashKey*/
var temp = angular.copy(a);
sObject.update(temp,function(result,event){
if(!event.status){
alert("Update Failed!");
}
});
}
$scope.getAccounts();
});
</script>
<div ng-app="vfApp" ng-controller="vfappController">
<apex:sectionHeader title="AngularJS" subtitle="AngularJS & SObject Remote #2 Update Records"/>
<apex:pageBlock >
<!-- Borrow some styling from Pageblock table -->
<table class="list" border="0" cellpadding="0" cellspacing="0" id="contactsTable">
<thead class="rich-table-thead">
<tr class="headerRow ">
<th class="headerRow">Name</th>
<th class="headerRow">Site</th>
<th class="headerRow">Type</th>
<th class="headerRow">Phone</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="a in accounts" class="dataRow" onmouseover="if (window.hiOn){hiOn(this);} " onmouseout="if (window.hiOff){hiOff(this);} " onblur="if (window.hiOff){hiOff(this);}" onfocus="if (window.hiOn){hiOn(this);}">
<td class="dataCell">
<input type="text" ng-model="a.Name" ng-blur="update(a)"/>
</td>
<td class="dataCell">
<input type="text" ng-model="a.Site" ng-blur="update(a)"/>
</td>
<td class="dataCell">
<input type="text" ng-model="a.Type" ng-blur="update(a)"/>
</td>
<td class="dataCell">
<input type="tel" ng-model="a.Phone" ng-blur="update(a)"/>
</td>
</tr>
</tbody>
</table>
</apex:pageBlock>
</div>
</apex:page>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment