Wednesday, 16 April 2014

Auto save data to the server after a cell value changed - AngularJS and ng-grid

Hi friends,

how get the data or auto save data to the server after a cell value changed in angular js

I have to create a controller as "DonarController" and with in create a ng-grid "GridOptions"
<div data-ng-controller="DonarController">
    <form name="bb-donar-form">
        <div class="col-sm-12">
                <div class="gridStyle" data-ng-grid="GridOptions">
                </div>
            </div>
    </form>
</div>
Then have to create functionality for particular grid

(function () {
    angular.module('BloodBank.Controller')
    .controller('DonarController', ['$scope', function ($scope) {
 //past below code here
    } ]);
})()

below code have to past the above.
This functionality is declare the celledit template as a input box with updateEntity(col,row) function

 var cellEditableTemplate = "<input type=\"number\" style=\"width:56px; text-align: right;\" ng-class=\"'colt' + col.index\" ng-input=\"COL_FIELD\" ng-blur=\"updateEntity(col,row)\" ng-model='row.entity.phno'/>";
        
        $scope.GridOptions = {
            data: 'datas',
            enableCellSelection: true,
            enableRowSelection: false,
            columnDefs: [
                { field: 'username', displayName: 'User Name' },
                { field: 'fullname', displayName: 'Full Name' },
                { field: 'bloodtype', displayName: 'Blood Type' },
                { field: 'gender', displayName: 'Gender' },
                { field: 'location', displayName: 'Location'},
                { field: 'phno', displayName: 'Phone No',                                          enableCellEdit: true,                                                            editableCellTemplate: cellEditableTemplate }
            ]
        };

and also add below function,

$scope.updateEntity = function (column, row) {
            console.log(row.entity);
            console.log(column.field);
            }

below screen i get changed cell value from ng-grid



Wednesday, 2 April 2014

Error : Request header field Content-Type is not allowed by Access-Control-Allow-Headers

I got below error when accessing the web api from angular js



So, i have to add the following line in web config(web api)


hope this helpful..


KendoUI Chart using in AngularJS with Dynamic data

Here i'm going to do the KendoUI Chart using AngularJS  and getting dynamic data from angular services. First need to down-lode the r...