本帖最后由 Java框架 于 2017-7-13 14:28 编辑
FlexGrid如果不出现滚动条，复选框获取数据正常。如果FlexGrid出现滚动条，全选的复选框不能全部勾上，而且只能获取眼睛看到的复选框状态数据，获取不了滚动条下面的复选框状态数据。
出现滚动条，上下左右拉动滚动条，FlexGrid复选框跳动，部分复选框自动切换勾选状态，获取的复选框状态不对：
html代码：
- <wj-flex-grid item-formatter="ctx.itemFormatter" headers-visibility="Column" control="ctx.flexGrid" items-source="roleData" align="center" is-read-only="true" allow-add-new="false" allow-delete="true">
- <wj-flex-grid-column header="" width="50" name="selectAllCheckbox">
- <input type="checkbox" id="{{$item.roleId}}" name="selectedCheckbox" ng-click="updateSelection($event,$item.roleKey)" />
- </wj-flex-grid-column>
- <wj-flex-grid-column header="序号" width="80">
- {{$row.index + 1}}
- </wj-flex-grid-column>
- <wj-flex-grid-column header="ID" width="0" binding="roleId" is-read-only="true"></wj-flex-grid-column>
- <wj-flex-grid-column header="编码" binding="roleKey" is-required="true" width="*"></wj-flex-grid-column>
- <wj-flex-grid-column header="名称" binding="roleValue" is-required="true" width="*"></wj-flex-grid-column>
- <wj-flex-grid-column header="描述" binding="description" width="*"></wj-flex-grid-column>
- <wj-flex-grid-column header="操作" is-read-only="true" width="*">
- <span ng-click="removeItem($item.roleId)" class="glyphicon glyphicon-remove" style="color:#D14836" title="删除"></span>
- <span ng-click="authorize($item.roleKey)" class="fa fa-cog" style="color:green" title="授权"></span>
- </wj-flex-grid-column>
- </wj-flex-grid>
- // 全选复选框
- $scope.selectedArray = [];
- $scope.selectedCheckbox = true;
- function itemFormatter(panel, r, c, cell) {
- if (panel.cellType == wijmo.grid.CellType.ColumnHeader) {
- var flex = panel.grid;
- var col = flex.columns[c];
- if (col.name == "selectAllCheckbox") {
- col.allowSorting = false;
- cell.innerHTML = '<input type="checkbox" /> ' + cell.innerHTML;
- var cb = cell.firstChild;
- cb.addEventListener('click', function(e) {
- if (cb.checked) {
- for (var i = 0; i < $(':checkbox[name="selectedCheckbox"]').not("input:checked").length; i++) {
- $(':checkbox[name="selectedCheckbox"]').not("input:checked").trigger('click');
- }
- } else {
- for (var i = 0; i < $(':checkbox[name="selectedCheckbox"]:checked').length; i++) {
- $(':checkbox[name="selectedCheckbox"]:checked').trigger('click');
- }
- }
- // console.log("--->" + $scope.selectedArray);
- });
- }
- }
- }
- // 勾选行的复选框，弹出明细窗口
- $scope.sysUserData = [];
- var updateSelected = function(action, id) {
- if (action == 'add' && $scope.selectedArray.indexOf(id) == -1) {
- $scope.selectedArray.push(id);
- }
- if (action == 'remove' && $scope.selectedArray.indexOf(id) != -1) {
- var idx = $scope.selectedArray.indexOf(id);
- $scope.selectedArray.splice(idx, 1);
- }
- }
- $scope.updateSelection = function($event, id) {
- var checkbox = $event.target;
- var action = (checkbox.checked ? 'add' : 'remove');
- updateSelected(action, id);
- }
恳请帮忙解决，万分感谢！
|
陕公网安备：61019002000258 |
隐私政策 |
网站地图