jquery cfml ajax

Question

这令人沮丧。我读过的任何内容都没有阐明这一点。而且事情不应该这么复杂。这是我的代码的当前状态。我一直在测试每一种组合，希望它有意义。我想要从 CF 函数返回的是记录计数并在悬停期间显示它。

$(".alphabet").hover(function () {
  $.ajax({ type: "POST", 
  url: "cfc/basic.cfc?method=CountUsersByLetter&returnformat=json", 
  data: "nbw=" + $(this.target).val(), 
  datatype: "html",
  success: function(usercount){
  alert(usercount);
  },
  error: function (xhr, textStatus, errorThrown){ 
   // show error 
   //alert(errorThrown);
   console.log('errorThrown');
    } 
  }); 
    $(this).append($("<span>" + usercount +"</span>"));
     }, 
  function () {
    $(this).find("span:last").remove();
  }
);

<cffunction name="CountUsersByLetter" output="no" returntype="query" access="remote">
 <cfargument name="NBW" required="false" type="string" default="A" hint="name begins with">
 <cfset var qResults = "">
  <cfquery name="qResults" datasource="#request.dsn#">
   select count(id) as usercount from Temp_Duplicate_Individuals_CC
   WHERE left(lastname,1) = <cfqueryparam value="#arguments.NBW#" />
  </cfquery>
 <cfreturn #qResults#>
</cffunction>

Answer 1

您必须了解，默认情况下，ajax 本质上是异步的，因此您必须等到服务器响应才能使用仅在成功处理程序中可用的 usercount。通过将 async 设置为 false 进行同步调用，或者等待服务器响应。

将代码移到成功处理程序中

$(".alphabet").hover(function () {
  $.ajax({ type: "POST", 
     url: "cfc/basic.cfc?method=CountUsersByLetter&returnformat=json", 
     data: "nbw=" + $(this.target).val(), 
     datatype: "html",
     success: function(usercount){
       //alert(usercount);
       $(this).append($("<span>" + usercount +"</span>"));
     },
     error: function (xhr, textStatus, errorThrown){ 
      // show error 
      //alert(errorThrown);
      console.log('errorThrown');
    } 
  }); 

  }, 
  function () {
    $(this).find("span:last").remove();
  }
);

我不会建议您进行同步调用，因为它会使整个页面等待，有时如果服务器需要时间响应，浏览器会完全挂起。

Answer 2

你为什么不尝试一下
cfreturn qResults.recordCount？
您现在正在返回整个查询对象。

Answer 3

有很多东西可以在代码中进行调整。

我会在 .ajax() 调用之前添加这行代码：

$.ajaxSetup({ timeout: 5000, cache: false }); // this is needed or ie will cache the ajax responses!

@Jason Tabler 的响应很接近。使用 COUNT() 的查询的 RecordCount 将始终返回值 1（一）。我会将 cfreturn 语句更改为：

<cfreturn qResults.usercount />

cfreturn 中不需要井号，这将返回值而不是查询对象。

ajax 调用不应该是“POST”。 “POST”通常用于提交到表单操作页面。这应该是“GET”。

我总是使用 Firebug 检查 success: 函数返回的数据格式，然后添加代码来显示它。由于上面的返回值发生了变化，它应该成为一个更简单的 json 对象来使用。

Answer 4

按如下方式更改成功函数。由于函数不仅返回整个查询，因此您将在 usercount 参数中获得查询对象，而不仅仅是计数。您还将收到文本字符串，您可能需要使用 eval() 函数将其转换为 JSON 对象。

编辑：
这是完整的功能代码。我只是在研究 success 函数问题，但附加您在 success 之外编写的 SPAN 也会引起问题。

    $(".alphabet").hover(function () {
              var _$this = $(this);
              var usercount = 0;
              $.ajax({ type: "POST", 
              url: "scribble.cfc?method=CountUsersByLetter&returnformat=json", 
              data: "nbw=" + $(this.target).val(), 
              datatype: "html",
              success: function(res){
                 usercount = eval("(" + res + ")").DATA[0][0];
                 _$this.append($("<span> (" + usercount +")</span>"));
              },
              error: function (xhr, textStatus, errorThrown){ 
               console.log('errorThrown');
                } 
            }); 
        }, 
          function () {
            $(this).find("span:last").remove();
          }
        );