datagrid没有数据显示无数据提示信息

$('#tt').datagrid({
    width: document.getElementById('div1').width,
    height: document.getElementById('div1').heigh,
    nowrap: false,
    striped: true,
    collapsible: true,
    remoteSort: false,
    singleSelect: true,
    sortName: 'Id',
    sortOrder: 'desc',
    idField: 'Id',
    url: '/Service/UnAuditedHandler.ashx',
    columns: [[
    { field: 'id', title: '编号', width: $(this).width() * 0.05 },
    { field: 'username', title: '用户名', width: $(this).width() * 0.10 },
    { field: 'mobile', title: '家庭电话', width: $(this).width() * 0.10 },
    { field: 'phone', title: '手机号', width: $(this).width() * 0.10 },
    { field: 'cnname', title: '真实姓名', width: $(this).width() * 0.10 },
    { field: 'gender', title: '性别', width: $(this).width() * 0.05 },
    { field: 'birthday', title: '出生日期', width: $(this).width() * 0.10 },
    { field: 'idcardnumber', title: '身份证号', width: $(this).width() * 0.15 }
    ]],
    onLoadSuccess:function(data){
        if(data.total > 0) return;
        $(this).datagrid('appendRow', { id: '<div style="text-align:center;color:red">没有相关记录！</div>' }).datagrid('mergeCells', { index: 0, field: 'id', colspan: 8 });
        //隐藏分页导航条，这个需要熟悉datagrid的html结构，直接用jquery操作DOM对象，easyui datagrid没有提供相关方法隐藏导航条
        //$(this).closest('div.datagrid-wrap').find('div.datagrid-pager').hide();
        //如果通过调用reload方法重新加载数据有数据时显示出分页导航容器
        //$(this).closest('div.datagrid-wrap').find('div.datagrid-pager').show();
    },
    pagination: true,
    pageSize: 15,
    pageList: [15, 25, 50, 100]
});

效果如下：

原文地址：http://www.wenotebook.com/Article/Index?articleID=20141024103743