Как изменить колонку в значении в угловых js?

Я использую UI-сетку в моем примере. Я видел документацию здесь из строки редактирования. http://ui-grid.info/docs/#/tutorial/205_row_editable В данном примере пользователь может редактировать столбцы, присутствующие в строке. Я также делаю тот же пример, что и модули, но не могу редактировать мои столбцы. Что такое процедура для редактирования столбцов?Как изменить колонку в значении в угловых js?

вот мой код http://plnkr.co/edit/zypDrZeJUx9ZoTHNnMxc?p=preview

уже добавлены модули

angular.module('app',['ngTouch', 'ui.grid', 'ui.grid.selection' ,'ui.grid.edit', 'ui.grid.rowEdit', 'ui.grid.cellNav'])

вот мой JS файл

$scope.gridOptions = { 
     //filter demo 
     // enableFiltering: true, 
     // showHeader: false, // show header check 
      enableRowSelection: true, 
      multiSelect:false, 
      //show checkbox front of each row or not 
      enableRowHeaderSelection: false, 
      onRegisterApi : function(gridApi){ 
     //set gridApi on scope 
     $scope.gridApi = gridApi; 
     gridApi.selection.on.rowSelectionChanged($scope,function(row){ 
     var msg = 'row selected ' + row.entity.age; 
     console.log(row); 
     }); 
      }, 

      enableFiltering: true, 


    columnDefs: [ 
     { 
       field: 'gender', 
       displayName:'Gender', 
       filter: { 
        type: uiGridConstants.filter.SELECT, 
        selectOptions: [ 
         { value: 'm', label: 'male' }, 
         { value: 'F', label: 'female' }, 
         { value: 'N', label: 'mdd' } 

        ] 
       }, 
      }, 



     {field: 'name', displayName:'First'}, 
     {field: 'lastname', displayName:'Second',enableSorting: false} 
     ] 
    }

источник

2016-01-05 user5711656

Взгляните на демо, я надеюсь, что это то, что вы разыскивается.

Это не совсем то же самое, что и у вас, но вы все равно можете редактировать код.

var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.edit', 'ui.grid.rowEdit', 'ui.grid.selection']); 
 

 

 
app.controller('MainCtrl', ['$scope', '$http', '$q', '$interval', 'uiGridConstants', 
 
    function($scope, $http, $q, $interval, uiGridConstants) { 
 
    $scope.data = [{ 
 
     name: 'abc', 
 
     lastname: 'hrt', 
 
     gender: 'm', 
 
     age: 28 
 

 
    }, { 
 
     name: 'pqr', 
 
     lastname: 'oiu', 
 
     gender: 'F', 
 
     age: 8 
 

 
    }, { 
 
     name: 'lqm', 
 
     lastname: 'ytu', 
 
     gender: 'N', 
 
     age: 11 
 

 
    }]; 
 

 
    $scope.gridOptions = { 
 
     enableFiltering: true, 
 
     enableRowSelection: true, 
 
     multiSelect: false, 
 
     enableRowHeaderSelection: false 
 
    }; 
 

 
    $scope.gridOptions.columnDefs = [{ 
 
     name: 'gender', 
 
     displayName: 'Gender', 
 
     filter: { 
 
     type: uiGridConstants.filter.SELECT, 
 
     selectOptions: [{ 
 
      value: 'm', 
 
      label: 'male' 
 
      }, { 
 
      value: 'F', 
 
      label: 'female' 
 
      }, { 
 
      value: 'N', 
 
      label: 'mdd' 
 
      } 
 

 
     ] 
 
     } 
 
    }, { 
 
     name: 'name', 
 
     displayName: 'First' 
 
    }, { 
 
     name: 'lastname', 
 
     displayName: 'Second' 
 
    }]; 
 

 
    $scope.saveRow = function(rowEntity) { 
 
     // create a fake promise - normally you'd use the promise returned by $http or $resource 
 
     var promise = $q.defer(); 
 
     $scope.gridApi.rowEdit.setSavePromise(rowEntity, promise.promise); 
 

 
     promise.resolve(); 
 
    }; 
 

 
    $scope.gridOptions.onRegisterApi = function(gridApi) { 
 
     //set gridApi on scope 
 
     $scope.gridApi = gridApi; 
 
     gridApi.rowEdit.on.saveRow($scope, $scope.saveRow); 
 

 
     gridApi.selection.on.rowSelectionChanged($scope, function(row) { 
 
     var msg = 'row selected ' + row.entity.age; 
 
     console.log(row); 
 
     }); 
 
    }; 
 

 
    $scope.gridOptions.data = $scope.data; 
 
    } 
 
]);

<!doctype html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script> 
 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-touch.js"></script> 
 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-animate.js"></script> 
 
    <script src="http://ui-grid.info/docs/grunt-scripts/csv.js"></script> 
 
    <script src="http://ui-grid.info/docs/grunt-scripts/pdfmake.js"></script> 
 
    <script src="http://ui-grid.info/docs/grunt-scripts/vfs_fonts.js"></script> 
 
    <script src="http://ui-grid.info/release/ui-grid.js"></script> 
 
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css"> 
 
    <link rel="stylesheet" href="main.css" type="text/css"> 
 
</head> 
 

 
<body> 
 

 
    <div ng-controller="MainCtrl"> 
 
    <div ui-grid="gridOptions" ui-grid-edit ui-grid-row-edit ui-grid-selection class="grid"></div> 
 
    </div> 
 

 

 
    <script src="app.js"></script> 
 
</body> 
 

 
</html>

Для любых дальнейших вопросов, которые вы всегда рады. Адрес Plunker.

источник

2016-01-05 14:07:58 SjaakvBrabant

wait Я обновлю вас – user5711656

код кода в моем коде .. мы можем добавить этот код? мы можем добавить событие щелчка строки .. или мы не можем добавить событие щелчка при использовании редактирования – user5711656

Я нахожусь в чате. Сообщение типа типа – user5711656

Как изменить колонку в значении в угловых js?

ответ

Смежные вопросы