AJAX请求返回对象的双重列表 - YUI

时间:2015-07-20 15:26:33

标签: javascript ajax yui

我正在使用YUI的Datatable Column Formatter来格式化从AJAX请求返回的一些数据。这是配置:

var dataTable = new Y.DataTable(
{
    id: 'my-table',
    height: '500px',
    width: '500px'
});
var columns = [{
        key: 'id',
        label: 'ID'
    }, {
        label: 'Name',
        formatter: function (o) {
            console.log(o.data);
            return o.data.name; 
        }
    },
    {   
        key: 'department',
        label: 'Department'
    }
];

function search(){
    dataSource = new Y.DataSource.IO({source: '/search' });
    dataSource.sendRequest({
        dataType: 'json',
        on: {
            success: function(e) {
                response = e.data.responseText;             
                data = Y.JSON.parse(response);
                dataTable.set('columns', columns);
                dataTable.set('data', data.content); 
            },
            failure: function(e) {
                //do stuff
            }
        });
    }

我的表格填充得很好

enter image description here

这是从控制台返回的

Object {id: 1, name: "Bob", department: 001}
Object {id: 2, name: "Andy", department: 003}

但是,如果我第二次启动请求,则返回的对象数量会增加一倍

Object {id: 1, name: "Bob", department: 001}
Object {id: 2, name: "Andy", department: 003}
Object {id: 1, name: "Bob", department: 001}
Object {id: 2, name: "Andy", department: 003}

虽然数据仍然显示,但此复制会破坏其他地方的功能。此外,无论请求启动的次数如何,只返回加倍的列表。知道对象为什么要合并?

1 个答案:

答案 0 :(得分:1)

尝试删除每个AJAX请求的现有数据。 $('#myTableID').remove()然后重新创建。您的AJAX调用似乎附加到现有内容