Question

我从数据库中获取行id。如果rowid相同，那么我想在同一行显示它们。否则我想在不同的行显示它们。我正在使用kendo ui list视图控件。应根据rowid对齐列表视图项。

我的记录将来自数据库，如

 id   name     rowid
  1   first      1
  2   second     1
  3   third      2
  4   fourth     2
  5   fifth      3
  6   sixth      4
  7   seven      5
  8   eight      5

然后输出将采用类似

的形式

  first          second
  third          fourth
  fifth
  sixth
  seven           eight

Answer 1

首先，您必须确保ordered的{{1}}来自数据库的记录为rowid。

然后你的列表视图模板应该是这样的：

<div style="width: 400px;">
    <script type="text/x-kendo-tmpl" id="template">
        <div style="float: left;height: 100px; width:#=getColWidth(rowid,data)#px;">
            #=name#
        </div>
    </script>
</div>

<script>
function getColWidth(currentRowID,data)
{
    var dataLen = data.length, 
        numberOfColumn=0, 
        columnWidth,
        rowWidth = 400; /**suppose that your Row take 400 pixel in View*/

    for(var i = 0; i < dataLen; i++)
    {
        if(data.rowid == currentRowID)
        {
            numberOfColumn++;
        }
    }
    columnWidth = Math.round(rowWidth/numberOfColumn);
    return columnWidth;
}
</script>

如何根据表的类并排对齐表

1 个答案: