0

有没有办法合并 UI-grid 的列以显示为连续行（中间没有任何列线）。我已经 在ui网格中尝试过这个合并列

但这会导致我丢失第 1 行的行数据。更重要的是，我希望合并每个备用行。

这是我的 HTML

<div id="grid" ui-grid="gridOptions" ui-grid-move-columns ui-grid-resize-columns ui-grid-auto-resize class="grid"></div>

这是我的网格 js 代码

$scope.gridOptions = {
    enableColumnResizing: true,
    enableRowHeaderSelection: false,
    enableGridMenu: true,
    enableHorizontalScrollbar: 0,
    enableVerticalScrollbar: 2,
    enableColumnMenus: false,
    enableRowSelection: true,
    columnDefs: [
   {
       name: 'Code',
       field: 'Code',
   }, {
       name: 'Title',
       field: 'Title',
   }, {
       name: 'Visits',
       field: 'Visit',
   }, {
       name: 'UsedVisits',
       field: 'usedVisits',
   }, {
       name: 'Pending Visits',
       field: 'pendingVisits',
   }, {
       name: 'Available Visits',
       field: 'availableVisits',
   }, {
       name: 'Start Date',
       field: 'StartDate',
   }, {
       name: 'End Date',
       field: 'EndDate',
   }, {
       name: 'Status',
       field: 'Status',
   }
    ]
};

请给我一些建议，谢谢

4

1 回答 1

0

为了实现它，我们可以在为网格本身创建数组的同时合并数据

最初使用逻辑我们有我们合并以显示在网格中的数组，以便在网格中我们可以获得合并的数据

  $scope.myData = [{name: "1Abcd", age: "one", gender:2},
               {name: "2Tom", age: "two", gender:1},
               {name: "3Abcd", age: "three", gender:2},
               {name: "4Abcd", age: "four", gender:2},
               {name: "5Abcd", age: "five", gender:2},
               {name: "6Abcd", age: "six", gender:2},
               {name: "7Abcd", age: "seven", gender:2},
               {name: "8Abcd", age: "eight", gender:2},
               {name: "9Abcd", age: "nine", gender:2},

              ];

$scope.myDataNew =[]     ;    

for(var i=0;i<(($scope.myData.length/2)+1);i++){
var tempObj ={};
if($scope.myData[i*2] && $scope.myData[i*2].name && $scope.myData[i*2+1] &&$scope.myData[i*2+1].name){
 tempObj.name =$scope.myData[i*2].name+$scope.myData[i*2+1].name ;
 }
 else if($scope.myData[i*2] && $scope.myData[i*2].name &&    !$scope.myData[i*2+1] ){
tempObj.name =$scope.myData[i*2].name;
 }
if($scope.myData[i*2] && $scope.myData[i*2].age && $scope.myData[i*2+1]    &&$scope.myData[i*2+1].age){
tempObj.age =$scope.myData[i*2].age+$scope.myData[i*2+1].age ;
}else if($scope.myData[i*2] && $scope.myData[i*2].age &&    !$scope.myData[i*2+1] )
{
tempObj.age =$scope.myData[i*2].age;
}

$scope.myDataNew.push(tempObj);
}

这是完成实施的代码笔 http://codepen.io/vkvicky-vasudev/pen/LRPNyL

如果需要更改蚂蚁，请随时通知我

于 2016-08-30T07:41:53.830 回答