jquery cfml ajax

Question

这是令人沮丧的。我读过的任何东西都没有清楚地说明这一点。它不应该这么复杂。这是我的代码的当前状态。我一直在测试每种组合，希望它是有意义的。我只想从CFfunction返回一个记录计数，并在悬停期间显示它。

$(".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

按照下面的说明更改成功函数。As函数返回的整个查询不仅只有count，所以你会在usercount参数中得到query对象，而不仅仅是count。此外，您将收到文本字符串，您可能需要使用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();
          }
        );

Answer 3

你为什么不试试cfreturn qResults.recordCount呢？您现在返回的是整个查询对象。