`

dataTables对象数据的展现问题

阅读更多
datables处理带"."的数据做了一些特殊处理
前端JavaScript
columns: [
{data: "creator.name",title: "创建者", defaultContent: "", width: 120,align: "left"},
 {data: "creator.email",title: "创建者邮箱", defaultContent: "", width: 120, align: "left"},
{data: "creator.mobilePhoneNumber",title: "创建者手机", defaultContent: "", width: 120, align: "left"}
]


后台返回的数据格式必须为:
creator:{name: "张三", email: "zhangsan@xx.com", mobilePhonoeNumber: "1333333333"}


datatables的源码在1274行,代码为
//else if ( typeof mSource === 'string' && (mSource.indexOf('.') !== -1 ||
		//	      mSource.indexOf('[') !== -1 || mSource.indexOf('(') !== -1) )
		//{
		//	/* If there is a . in the source string then the data source is in a
		//	 * nested object so we loop over the data for each level to get the next
		//	 * level down. On each loop we test for undefined, and if found immediately
		//	 * return. This allows entire objects to be missing and sDefaultContent to
		//	 * be used if defined, rather than throwing an error
		//	 */
		//	var fetchData = function (data, type, src) {
		//		var arrayNotation, funcNotation, out, innerSrc;
        //
		//		if ( src !== "" )
		//		{
		//			var a = _fnSplitObjNotation( src );
        //
		//			for ( var i=0, iLen=a.length ; i<iLen ; i++ )
		//			{
		//				// Check if we are dealing with special notation
		//				arrayNotation = a[i].match(__reArray);
		//				funcNotation = a[i].match(__reFn);
        //
		//				if ( arrayNotation )
		//				{
		//					// Array notation
		//					a[i] = a[i].replace(__reArray, '');
        //
		//					// Condition allows simply [] to be passed in
		//					if ( a[i] !== "" ) {
		//						data = data[ a[i] ];
		//					}
		//					out = [];
        //
		//					// Get the remainder of the nested object to get
		//					a.splice( 0, i+1 );
		//					innerSrc = a.join('.');
        //
		//					// Traverse each entry in the array getting the properties requested
		//					if ( $.isArray( data ) ) {
		//						for ( var j=0, jLen=data.length ; j<jLen ; j++ ) {
		//							out.push( fetchData( data[j], type, innerSrc ) );
		//						}
		//					}
        //
		//					// If a string is given in between the array notation indicators, that
		//					// is used to join the strings together, otherwise an array is returned
		//					var join = arrayNotation[0].substring(1, arrayNotation[0].length-1);
		//					data = (join==="") ? out : out.join(join);
        //
		//					// The inner call to fetchData has already traversed through the remainder
		//					// of the source requested, so we exit from the loop
		//					break;
		//				}
		//				else if ( funcNotation )
		//				{
		//					// Function call
		//					a[i] = a[i].replace(__reFn, '');
		//					data = data[ a[i] ]();
		//					continue;
		//				}
        //
		//				if ( data === null || data[ a[i] ] === undefined )
		//				{
		//					return undefined;
		//				}
		//				data = data[ a[i] ];
		//			}
		//		}
        //
		//		return data;
		//	};
        //
		//	return function (data, type) { // row and meta also passed, but not used
		//		return fetchData( data, type, mSource );
		//	};
		//}



我的解决方案
返回的数据格式为:
{creator.name: "张三", creator.email: "zhangsan@xx.com", creator.mobilePhonoeNumber: "1333333333"}

需要把dataTables的代码注释掉才能展示数据
分享到:
评论

相关推荐

    datatables

    总之,Datatables是jQuery生态中的一个强大工具,无论是在简单的数据展示还是复杂的业务场景中,都能展现出强大的功能和灵活性。了解并掌握其使用方法,将极大地提升网页数据管理的效率和用户体验。

    datatables中响应数据显示问题

    使用datatables获取后台响应数据时,只能获取到aaData,而其他数据无法显示问题

    DataTables很好用的数据表格工具

    DataTables是一款广泛应用于Web开发领域的强大数据表格工具,尤其适合那些需要展示大量结构化数据的项目。这款插件基于JavaScript,兼容HTML5和CSS3,能够与各种后端技术(如Java、C++、C#)无缝集成,为用户提供...

    Datatables使用Ajax方式读取数据

    在本教程中,我们将探讨如何利用Datatables与Ajax结合,动态地从服务器获取并展示数据。 首先,让我们了解基础概念。jQuery是一个轻量级的JavaScript库,简化了HTML文档遍历、事件处理、动画以及Ajax交互。...

    表格 demo datatables 回调

    回调函数是Datatables的核心特性之一,允许开发者自定义数据处理逻辑,例如在数据加载前后进行操作,或者在用户与表格交互时执行特定功能。 在"表格 demo datatables 回调"中,"回调"可能指的是Datatables的事件回...

    Datatables实现多选框与AJAX返回数据 JAVA版

    在本项目中,“Datatables实现多选框与AJAX返回数据 JAVA版”是针对Java开发者的,它涉及到使用Datatables与Spring MVC框架结合,通过AJAX技术动态加载并处理服务器端的数据,同时实现表格内的多选框功能,以提升...

    Laravel开发-datatables

    Datatables是一款强大的jQuery插件,它能够帮助开发者实现数据的动态展示、排序、过滤和分页,极大地提高了用户体验。在Laravel中集成datatables,可以将后端的复杂逻辑与前端的交互体验完美结合。 首先,我们要...

    datatables固定头与滚动条适配文件

    总的来说,`datatables固定头与滚动条适配文件`是为了解决`DataTables`在使用`FixedHeader`和滚动模式时的兼容性问题,通过合理的CSS样式调整,确保用户在浏览大量数据时仍能方便地看到表头。理解和解决这个问题对于...

    datatables刷新插件fnReloadAjax

    本资源提供的插件`fnReloadAjax`是针对`DataTables`的一个增强功能,它使得在不刷新整个页面的情况下,能够重新加载表格中的数据,这对于实时更新或者异步获取数据的场景尤为重要。 `DataTables`本身支持Ajax数据源...

    datatables1.10.15示例代码

    DataTables支持多种数据源,包括DOM、Ajax、服务器端处理和JSON对象。例如,通过Ajax加载数据: ```javascript $('#example').DataTable({ "processing": true, "serverSide": true, "ajax": "scripts/server_...

    jquery-dataTables简单实例

    DataTables支持多种数据源,包括HTML表格数据、服务器端数据(Ajax)和JSON对象。在本例中,假设数据已内置于HTML表格中,无需额外配置。 3. **功能定制** DataTables提供很多可选参数以定制其行为。例如,可以...

    datatables最简单的模板

    9. **自定义事件和扩展**:Datatables允许添加自定义事件处理函数,以及使用众多的插件和扩展来增强功能,如按钮、固定列、导出数据等。 10. **模板应用**:"我的模板"可能是包含上述配置的一个实际应用示例,可以...

    开发工具 dataTables.bootstrap.min

    开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min开发工具 dataTables.bootstrap.min...

    JQuery DataTables示例,包含分页、拖拽、导出

    3. **导出**:DataTables 支持导出数据为CSV, Excel, PDF 或其他格式,方便用户进一步分析或保存数据。这个示例包含了导出功能,意味着用户可以轻松地将表格数据导出至所需的格式。 4. **Struts2框架**:项目基于...

    Datatables版本集合免积分下载

    1. 数据排序:Datatables支持多种排序方式,用户可以根据需求对表格中的数据进行升序或降序排列。 2. 数据过滤:它提供了内置的搜索功能,用户可以快速查找表格中的特定信息。 3. 分页:Datatables能够将大量数据...

    DataTables导出CVS Excel PDF 打印

    通过以上步骤,你可以轻松地在你的网页应用中集成DataTables的导出和打印功能,为用户提供便利的数据操作体验。无论是对大型数据集进行分析,还是需要离线查看,CSV、Excel和PDF格式都能满足不同的需求。在实际开发...

    jquery DataTables-1.9.4

    10. **文档和社区**:DataTables官方提供详尽的文档和活跃的社区支持,开发者可以快速找到解决问题的方法和获取最新的更新信息。 在压缩包`DataTables-1.9.4`中,通常会包含以下文件和目录: - `css`:存放CSS样式...

Global site tag (gtag.js) - Google Analytics