所有
我正在使用我在以下网站上找到的服务器端coldfusion jquery数据表的一个很好的例子。 Site Here
在示例代码中，表和select语句在JS文件中公开，我需要在搜索中包含多个表。原始代码看起来像这样。
原始工作代码
"fnServerData": function ( sSource, aoData, fnCallback ) {
aoData.push(
{ "name": "table", "value": "ukLocationCodes" },
{ "name": "sql", "value": "SELECT [id], [varCode], [varLocation]" }
);
$.ajax( {"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback} );
原始代码在ColdFusion页面上进行查询搜索。
<cfquery name="rResult" datasource="A8002CMS">
#preservesinglequotes(form.sql)#
FROM #form.table#
WHERE 1 = 1
<cfif len(form.sSearch)>
AND (
<cfloop from="1" to="#listLen(variables.fieldlist)#" index="variables.index">
#listGetAt(variables.fieldlist, variables.index,',')# LIKE '%#form.sSearch#%' <cfif variables.index LT listLen(variables.fieldlist)> OR </cfif>
</cfloop>
)
</cfif>
<cfif isdefined('form.iSortCol_0')>
ORDER BY
<cfloop from="0" to="#form.iSortingCols-1#" index="variables.i">
#listGetAt(variables.fieldlist,form["iSortCol_#variables.i#"]+1)# #form["sSortDir_#variables.i#"]#
<cfif variables.i is not form.iSortingCols-1>,
</cfif>
</cfloop>
<!--- create the JSON response --->
<cfsavecontent variable="variables.sOutput"><cfoutput>{
"sEcho": #form.sEcho#,
"iTotalRecords": #qGetCount.fullCount#,
"iTotalDisplayRecords": #rResult.recordcount#,
"aaData": [
<cfloop query="rResult" startrow="#form.iDisplayStart+1#" endrow="#form.iDisplayStart+form.iDisplayLength#"><cfset variables.count=variables.count+1>
[<cfloop list="#variables.fieldlist#" index="variables.i">
<!--- custom translations --->
"#rResult[variables.i][rResult.currentRow]#"
<cfif variables.i is not listLast(variables.fieldlist)>, </cfif>
</cfloop>]
更改代码，搜索结果直到你搜索
为了查找多个表并隐藏表并选择，我将JS脚本更改为以下内容。
$(document).ready(function() {
var table = $('#displayData').dataTable( {
"processing": true,
"stateSave": true,
"serverSide": true,
"ajax": {
"url": "MyVolunteers.cfm",
"type": "POST"
},
"columns": [
{"name": "EMPLOYEE_ID" , "className": "hidden"},
{"name": "EVER_NUM" , "className": "hidden" , "orderable": "true"},
{"name": "LAST_NAME", "title": "LAST NAME", "orderable": "true"},
{"name": "FIRST_NAME", "title": "FIRST NAME", "orderable": "true"},
{"name": "SortOrderDate", "title": "APP DATE", "orderable": "true"},
{"name": "DOCS_VER", "className": "hidden"},
{"name": "DOCS_WAIT", "title": "APP STATUS", "orderable": "true"},
{"name": "APP_STATUS", "title": "PROGRESS", "orderable": "true"},
{"name": "LOCATION_NAME", "title": "LOCATION", "orderable": "true"},
{"title": "OPTIONS", "orderable": "false"}
],
"columnDefs": [
{
<cfset E = "+row[0]+"/>
"render": function ( data, type, row )
{return "<a class='btn btn-primary btn-xs' href='candidate/?select="#E#"'>view</a> <a class='btn btn-success btn-xs' href='candidate/?select=#e_id#"+"'>edit</a>";},
"targets": -1
},
{
"render": function ( data, type, row )
{
var color = 'black';
if (row[5] == 1) {
color = 'green';
ColorCheck = 'VALIDATED';
IconChoice = ' fa fa-check-square-o';
}
else if (row[6] == 1) {
color = 'orange';
ColorCheck = 'WAITING';
IconChoice = 'fa fa-spin fa-spinner';
}
else {
color = 'red';
ColorCheck = 'NON-VALID';
IconChoice = 'fa fa-exclamation-triangle';
}
return '<span style="color:' + color + '"><i class="' + IconChoice + '"></i> ' + ColorCheck + '</span>';
},
"targets": -4
},
{
"render": function ( data, type, row )
{
var appstat = 'black';
if (row[5] == 1) {
appstat = 'green';
TextStatus = 'FINISHED';
IconChoice = 'fa fa-check';
}
else {
appstat = 'black';
var TextStatus = row[7];
IconChoice = 'fa fa-chevron-right';
}
return '<span class="text-uppercase" style="color:' + appstat + '"><i class="' + IconChoice + '"></i> ' + TextStatus + '</span>';
},
"targets": -3
},
{ "visible": false, "targets": [ 0 ] }
],
"pagingType": "full_numbers",
"order": [[2,'asc']],
"language": {
"lengthMenu": "Page length: _MENU_",
"search": "Filter:",
"zeroRecords": "No matching records found"
},
"data": function ( sSource, aoData, fnCallback ) {
aoData.push(
);
$.ajax( {"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback} );
}
} );
} );
setInterval( function () {
$('#displayData').DataTable().ajax.reload();
}, 30000 );
将查询更改为如下所示。
<cfsilent>
<cfparam name="form.table" default="">
<cfparam name="form.columns" default="">
<cfparam name="form.editButtonText" default="">
<cfparam name="form.editButtonTarget" default="">
<cfparam name="form.search" default="">
<cfparam name="variables.fieldlist" default="">
<cfsetting showDebugOutput="true">
<cfsetting enablecfoutputonly="true">
<cfprocessingdirective suppresswhitespace="true">
<!--- this comes from the AJAX script in the template --->
<cfset variables.fieldlist=form.columns>
<cfset variables.count=0>
<!--- strip off the comma if it is the last element --->
<cfif right(variables.fieldlist,'1') EQ ",">
<!--- last char is a comma --->
<cfset variables.listLength = len(variables.fieldlist)>
<cfset variables.fieldlist = left(variables.fieldlist, variables.listLength-1)>
</cfif>
<!--- get count of records --->
<cfquery name="qGetCount" datasource="MySQLDATABASE">
SELECT COUNT(*) AS fullCount
FROM VOLTABLE1
WHERE ARCHIVE IS NULL
</cfquery>
<cfquery name="rResult" datasource="MySQLDATABASE">
SELECT VOLTABLE1.EMPLOYEE_ID, VOLTABLE1.EVER_NUM, VOLTABLE1.LAST_NAME, VOLTABLE1.FIRST_NAME, VOLTABLE1.DOCS_VER, VOLTABLE1.DOCS_WAIT, VOLTABLE1.APP_STATUS, VOLTABLE1.LOCATION_ID, DATE_FORMAT(VOLTABLE1.EMPLOYEE_DATE,'%Y-%m-%d %r') AS SortOrderDate, VOLTABLE2.LOCATION_NAME
FROM VOLTABLE1
RIGHT JOIN
VOLTABLE2
ON VOLTABLE1.LOCATION_ID = VOLTABLE2.LOCATION_ID
WHERE 1 = 1 AND VOLTABLE1.ARCHIVE IS NULL
<cfif len(form.search)>
AND (
<cfloop from="1" to="#listLen(variables.fieldlist)#" index="variables.index">
#listGetAt(variables.fieldlist, variables.index,',')# LIKE '%#form.search#%' <cfif variables.index LT listLen(variables.fieldlist)> OR </cfif>
</cfloop>
)
</cfif>
<cfif isdefined('form.iSortCol_0')>
ORDER BY
<cfloop from="0" to="#form.iSortingCols-1#" index="variables.i">
#listGetAt(variables.fieldlist,form["iSortCol_#variables.i#"]+1)# #form["sSortDir_#variables.i#"]#
<cfif variables.i is not form.iSortingCols-1>,
</cfif>
</cfloop>
</cfif>
</cfquery>
<!--- strip off the table name from the values, otherwise it will break making the json --->
<cfset variables.fieldlist = ReplaceNoCase(variables.fieldlist,'VOLTABLE1.','','all')>
<cfset variables.fieldlist = ReplaceNoCase(variables.fieldlist,'VOLTABLE2.','','all')>
<!--- This is where I think the error is happening, I've read the JQuery Datatable documentation and I still am unable to resolve the issue.--->
<cfsavecontent variable="variables.sOutput"><cfoutput>{
"draw": #form.draw#,
"recordsTotal": #qGetCount.fullCount#,
"recordsFiltered": #rResult.recordcount#,
"data": [
<cfloop query="rResult" startrow="#form.iDisplayStart+1#" endrow="#form.iDisplayStart+form.iDisplayLength#"><cfset variables.count=variables.count+1>
[
<cfloop list="#variables.fieldlist#" index="variables.i">
<!--- custom translations --->
<cfset outputResults = ReplaceNoCase(rResult[variables.i][rResult.currentRow],'"','', 'ALL' ) />
"#outputResults#"
<cfif variables.i is not listLast(variables.fieldlist)>, </cfif>
</cfloop>
]
<cfif rResult.recordcount LT form.iDisplayStart+form.iDisplayLength>
<cfif variables.count is not rResult.recordcount AND rResult.recordcount NEQ rResult.currentRow>,</cfif>
<cfelse>
<cfif variables.count LT form.iDisplayLength>,</cfif>
</cfif>
</cfloop>
]
}</cfoutput></cfsavecontent>
</cfprocessingdirective>
</cfsilent>
<cfoutput>#variables.sOutput#</cfoutput>
页面上的数据显示正常，但是当我尝试使用数据表搜索功能时，调试中会出现以下错误。 元素SECHO在FORM中未定义
我认为可能是错的。我认为我的新查询包含两个表，但我不太确定如何解决这个问题。
答案 0 :(得分：1)
我弄清楚是什么导致了你的错误。当你再次阅读你的帖子时，它跳了出来。
原始工作代码
"fnServerData": function ( sSource, aoData, fnCallback ) {
aoData.push(
{ "name": "table", "value": "ukLocationCodes" },
{ "name": "sql", "value": "SELECT [id], [varCode], [varLocation]" }
);
$.ajax( {"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback} );
更改代码，搜索结果直到你搜索
为了查找多个表并隐藏表并选择，我将JS脚本更改为以下内容。
$.ajax( {"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback} );
当您从旧数据表功能更改代码时，问题首次出现。在发布ajax请求时，传统数据表ajax会自动生成并传递sEcho参数。它还期望服务器响应在成功回调中回显该值。
所以当您更改ajax以使用自定义ajax调用时会发生什么，这会绕过任何数据表内置功能（即不发送sEcho）。
要纠正即时错误，您有多种选择。要正确纠正这一点，您可能不应该使用选项3。
将代码还原为使用仅旧版代码和legacy parameters。这意味着您的ajax必须使用最初使用的bProcessing，bServerSide，sAjaxSource和fnServerData。
使用 upgrade guide 并将旧版数据转换为v1.10。
sEcho，因此请在form.sEcho文件中注明cfm的引用。这将消除即时错误，但我不知道它可能产生什么副作用。