ng-grid tests

This is a complete package with jQuery, jQueryUI, AngularJS and twitterBootstrap and ng-grid

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://code.angularjs.org/1.1.0/angular.js"></script>
<script src="https://raw.github.com/angular-ui/angular-ui/master/build/angular-ui.js"></script>
<link rel="stylesheet" href="https://raw.github.com/angular-ui/angular-ui/master/build/angular-ui.css">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.22/themes/base/jquery-ui.css">
<script src="http://angular-ui.github.com/ng-grid/lib/ng-grid.debug.js"></script>
<link rel="stylesheet" href="http://angular-ui.github.com/ng-grid/css/ng-grid.css">
<div ng-app="myapp">
    <div ng-controller="myctrl">
      <div ng-grid="gridOptions" class="grid"></div>   
            <div ng-show="editT">
            <input type="text" ng-model="id" disabled="true"/>
            <input type="text" ng-model="name"/><br/>
            <input type="button" value="save" ng-click="save()" />
            <input type="button" value="cancel" ng-click="cancel()" />    
            </div>
    </div>
</div>

CSS

.grid {
  height: 250px;
}

JavaScript

var myapp = angular.module('myapp', ["ui", "ngGrid"]);

myapp.controller('myctrl', function($scope, $http) {

    $scope.editT = true;
$scope.id = "";
$scope.name = "";    

var editContactCellTemplate = '<input type="button" value="Edit" ng-click="OnContactEdit(row.entity)"></input>';


    $scope.myData = [{id:1,name:"ABC"},{id:2,name:"DEF"},{id:3,name:"GHI"},{id:4,name:"JKL"},{id:5,name:"MNO"},{id:6,name:"PQR"}];
    $scope.gridOptions = {
        data: 'myData',
        multiSelect : false,
        enablePaging: true,
        columnDefs: [{field: 'id', displayName: 'ID', enableCellEdit: false,  colFilterText: ''},
                     {field:'name', displayName:'Name', enableCellEdit: true, colFilterText: '' },
                     {field:'edit', displayName:'Edit', enableCellEdit: true, cellTemplate: editContactCellTemplate, colFilterText: ''}]
    };
    
    
    $scope.OnContactEdit = function(value){
       
        $scope.id = value.id;
        $scope.name = value.name;
        $scope.editT = true;
    
    };
    
    $scope.save = function(){
        for(var i=0;i<$scope.myData.length;i++){
            if($scope.myData[i].id == $scope.id){
                $scope.myData[i].name = $scope.name;
            }
               
        }
    $scope.editT = false;
        $scope.id = "";
        $scope.name = "";
    }
    
    $scope.cancel = function(){
          $scope.editT = false;
        $scope.id = "";
        $scope.name = "";
    };
  
});