Question

我试图使用Dynatable从本地json数据集创建风格化的记录列表。在Dynatable文档中，程式化列表的示例是使用Reader函数从DOM获取记录，并使用Writer在页面中生成记录。我只需要使用本地数据集而不是Reader函数。这是写的：

     var localJSON = '[{  "caption": "<div>myCaption1</div>", "thumbnail": " <img src=\'../images/test.jpg\' />" },'
                     +'{  "caption": "<div>myCaption1</div>", "thumbnail": " <img src=\'../images/test.jpg\' />" }, '
                     +'{  "caption": "<div>myCaption1</div>", "thumbnail": " <img src=\'../images/test.jpg\' />" }, '
                     +'{  "caption": "<div>myCaption1</div>", "thumbnail": " <img src=\'../images/test.jpg\' />" }] ';
     var records = JSON.parse(localJSON);
     function ulWriter(rowIndex, record, columns, cellWriter) {
         var li = '';
         var cssClass = "col-sm-3";
         if (rowIndex % 4 === 0) { cssClass += ' first'; }
         li = '<li class="' + cssClass + '"><div class="thumbnail"><div class="thumbnail-image">' + record.thumbnail + '</div>' + record.caption + '</div></li>';
         return li;
     }
     $('#sampleUIList').dynatable({
        dataset: {
              perPageDefault: 4,
              records: records 
          },
          writers: {
              _rowWriter: ulWriter
          }
     });

问题是，每当我尝试更改页码或更改perPageOptions时，整个数据集（localJSON）都会附加到上一个数据集（类似于+=记录）。我错过了什么吗？

Answer 1

您缺少以下配置参数：

  table: {
     bodyRowSelector: 'li'
  },

将此添加到您的配置中，如下所示：

$('#sampleUIList').dynatable({
   dataset: {
         perPageDefault: 4,
         records: records 
     },
     writers: {
         _rowWriter: ulWriter
     },
     table: {
       bodyRowSelector: 'li'
     }
});

应该做的伎俩。

Dynatable - 每次更改页码时，记录都会附加到上一个列表中

1 个答案: