我试图使用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
)都会附加到上一个数据集(类似于+=
记录 )。我错过了什么吗?
答案 0 :(得分:1)
您缺少以下配置参数:
table: {
bodyRowSelector: 'li'
},
将此添加到您的配置中,如下所示:
$('#sampleUIList').dynatable({
dataset: {
perPageDefault: 4,
records: records
},
writers: {
_rowWriter: ulWriter
},
table: {
bodyRowSelector: 'li'
}
});
应该做的伎俩。