气体-按柱对flexTable进行分类

Question

我理解GWT中的cellTable执行这个(Sort FlexTable Inquiry)，我想知道是否有人知道使用UiApp中的flexTable来模拟某些列排序行为的方法。

在我的例子中，只需要应用程序在创建时对列进行一次排序，而不是让用户在单击时将其排序。我在下面包含了我的flexTable创建代码：

var flexTable = app.createFlexTable()
  .setStyleAttribute('marginTop', '10px')
  .setCellPadding(5)
  .setCellSpacing(2);

for(var i = 0;i<(size-1);i++){

  var class = "class" + (i+1);
  var classCode = classObjectsIndex[loggedInUser][class];
  var text10 = statusObjectsIndex[classCode].classname;
  var text11 = statusObjectsIndex[classCode].homeworkstatus;
  var text12 = statusObjectsIndex[classCode].classcalendarlink;

  var anchor = app.createAnchor('Calendar', text12)
    .setTarget('_blank');
  var calPanel = app.createAbsolutePanel() 
    .add(anchor);

  flexTable.setText(i, 0, text10);
  flexTable.setText(i, 1, text11);
  flexTable.setWidget(i, 2, calPanel);


  if(text11 == "No homework set for this class"){
    flexTable.setRowStyleAttribute(i, "backgroundColor", "#96bcfd")
    flexTable.setRowStyleAttribute(i, "color", "#000000");
  }else{
    flexTable.setRowStyleAttribute(i, "backgroundColor", "#eca8a3");
    flexTable.setRowStyleAttribute(i, "color", "#FFFFFF");      
  };

}

app.add(flexTable);

由于表的填充方式，对数组进行排序将无助于从数组中提取值。

这是我在这里发布的第一个问题，请温柔一点。如果我可以更好地问它，我忽略了一个明显的资源，以获得我的答案，或如果有更多的信息，我需要提供，请告诉我！

编辑/

我在使用Serge提供的代码进行排序时遇到了困难，非常有用，所以我对它的处理略有不同，并为每一行数据创建了单独的对象。Serge和Zig给我的建议帮助我最终解决了这个问题，非常感谢！

//create flexTable
var flexTable = app.createFlexTable();
  flexTable.setStyleAttribute('marginTop', '10px')
  flexTable.setCellPadding(5);
  flexTable.setCellSpacing(2);

//create empty table array to store rowObjects
var tableArray =[];

//create rowObjects
for(var i = 0; i<(size-1); i++){
  var rowObject = {};
  var class = 'class' + (i+1);
  var classCode = classObjectsIndex[loggedInUser][class];

  rowObject.className = statusObjectsIndex[classCode].classname;
  rowObject.homeworkStatus = statusObjectsIndex[classCode].homeworkstatus;
  rowObject.link = app.createAbsolutePanel().add(app.createAnchor('Calendar',statusObjectsIndex[classCode].classcalendarlink));

  if(statusObjectsIndex[classCode].homeworkstatus == "No homework set for this class"){
    rowObject.BGColor = "#96bcfd";
    rowObject.color = "#000000";
  }else{
    rowObject.BGColor = "#eca8a3";
    rowObject.color = "#FFFFFF";    
  }
  tableArray.push(rowObject);
  }

//sort objects in array by homework status 
tableArray.sort(function (a, b) {
  if (a.homeworkStatus > b.homeworkStatus)
    return 1;
  if (a.homeworkStatus < b.homeworkStatus)
    return -1;
    return 0;
  });  

//populate flextable
for(var i = 0;i<(size-1);i++){
  flexTable.setText(i,0, tableArray[i].className);
  flexTable.setText(i,1, tableArray[i].homeworkStatus);
  flexTable.setWidget(i,2, tableArray[i].link);
  flexTable.setRowStyleAttribute(i, 'color', tableArray[i].color);
  flexTable.setRowStyleAttribute(i, 'backgroundColor', tableArray[i].BGColor); 
 };

 app.add(flexTable);

Answer 1

没有什么可以阻止您先对源数组进行排序。只需将每5列(3列数据加上背景/前景颜色)存储在另一个数组中，并对其他数组进行排序。在排序之后，填充表。

Answer 2

我完全同意Zig的观点，这里是这样一个实现的示例，以帮助您了解如何处理它。(代码没有测试，但应该是正确的)

  var flexTable = app.createFlexTable()
  .setStyleAttribute('marginTop', '10px')
  .setCellPadding(5)
  .setCellSpacing(2);
  var array = [];
  var t0 = [];
  var t1 = [];
  var t2 = [];
  var color = [];
  var BGcolor = [];

  for(var i = 0;i<(size-1);i++){

    var class = "class" + (i+1);
    var classCode = classObjectsIndex[loggedInUser][class];
    t0.push(statusObjectsIndex[classCode].classname);
    t1.push(statusObjectsIndex[classCode].homeworkstatus);
    t2.push(app.createAbsolutePanel().add(app.createAnchor('Calendar',statusObjectsIndex[classCode].classcalendarlink)));    

    if(statusObjectsIndex[classCode].homeworkstatus == "No homework set for this class"){
      color.push("#000000")
      BGcolor.push("#96bcfd")
    }else{
      color.push("#FFFFFF")
      BGcolor.push("#eca8a3")
    };
    array.push(t0,t1,t2,color,BGcolor);
  }
 // sort the array here
 array.sort();// use other sort parameter if you want, search SO for examples

  for(var n in array){

    flexTable.setText(i, 0, array[n][0]);
    flexTable.setText(i, 1, array[n][1]);
    flexTable.setWidget(i, 2, array[n][2]);
    flexTable.setRowStyleAttribute(i, array[n][3])
    flexTable.setRowStyleAttribute(i, array[n][4]);
  }
  app.add(flexTable);