如何使用长度为 5 的数字文本框来编辑 angular 网格中的单元格

Question

我是新手 AngularJS

当我单击编辑按钮使单元格可编辑时，我有一个显示数据的网格。现在我只想允许小数或数字，长度应该只有 5。请看图

那是我在控制器中的代码

 { field: 'fam_coinsurance', width: '15%', displayName: 'Fam Coinsurance',type: 'number', cellFilter: 'number: 3', enableCellEdit: true, cellEditableCondition: $scope.canEdit }

enter image description here

Answer 1

您可以使用 editableCellTemplate 属性定义编辑该字段时要使用的自定义单元格模板。这可以使用 HTML5 "numeric" 输入和 "max" 的“99999”来只允许 5 位数字。

 editableCellTemplate: '<input type="number" max="99999" ui-grid-editor ng-model="MODEL_COL_FIELD">'

请参阅 this Fiddle 示例 - 这里 "age" 列使用自定义单元格模板。

Answer 2

在网格选项中试试这个

editableCellTemplate: <input ui-grid-editor ng-model="MODEL_COL_FIELD" ng-minlength="12" ng-maxlength="14" minlength="12" maxlength="14">

在这里工作！谢谢@Ian A.

如何使用长度为 5 的数字文本框来编辑 angular 网格中的单元格

How to have a numeric text box of length 5 for editing a cell in angular grid

angularjs

ui-grid