Question

我試圖建立一個由數據庫中的員工設置的基於選項卡的字母表，這樣它就不會成爲一個集合，而是基於數據庫中的員工動態構建。這裏是查詢：

<cffunction name="ALPHA_RL" access="remote" returnformat="JSON" returntype="any" > 
     <cfargument name='DEPTMATRICSID' required='true' /> 
     <cfset retVal = ArrayNew(1)> 
     <cfquery datasource="#request.DSN#" username="#request.User#" password="#request.Password#" name="getAlphaList"> 
       SELECT DISTINCT ALPHA FROM (
       SELECT SUBSTR(A.LAST_NAME, 1, 1) As ALPHA 
       FROM WEBSCHEDULE.APPLICATION_USER A, WEBSCHEDULE.FACULTYHISTORY H, WEBSCHEDULE.FACULTYTABLE T 
       WHERE A.EMPLID = H.FACULTYEMPLID 
       AND A.EMPLID = T.EMPLID 
       AND H.DEPTMATRICSID = #ARGUMENTS.DEPTMATRICSID#) 
       WHERE ALPHA IS NOT NULL 
       ORDER BY ALPHA 
     </cfquery> 
     <cfloop query="getAlphaList"> 
      <cfset temp = {} /> 
      <cfset temp['ALPHA'] = getAlphaList.ALPHA /> 
      <cfset ArrayAppend(retval, temp)> 
     </cfloop> 
     <cfset result = {} /> 
     <cfset result['items'] = retVal /> 

     <cfreturn result> 
    </cffunction> 

這工作不錯，並返回低於所需的數據顯示：

{"items":[{"ALPHA":"A"},{"ALPHA":"B"},{"ALPHA":"C"},{"ALPHA":"F"},{"ALPHA":"G"},{"ALPHA":"H"},{"ALPHA":"J"},{"ALPHA":"L"},{"ALPHA":"M"},{"ALPHA":"N"},{"ALPHA":"O"},{"ALPHA":"P"},{"ALPHA":"R"},{"ALPHA":"S"}]} 

現在這裏是我有問題，在我的html頁面我創建了一個函數和循環扔上述結果建立的HTML標籤：

function alphaTabs(d){ 
$.ajax({ 
    url: "CFCs/ManageUserProfiles.cfc", 
    dataType: "json", 
    data: { 
     method: "ALPHA_RL", 
     DEPTMATRICSID: d 
    }, 
    success: function(response){ 
     var x = response.items; 
     var str = ''; 
     if (response.items[0] != undefined) { 

      str += '<ul>'; 
      for (var i = 0; i < x.length; i++) { 
       str += '<li><a href="#alphaTabz-' + x[i].ALPHA + '">' + x[i].ALPHA + '</a></li>'; 
      } 
      str += '</ul>'; 
      for (var j = 0; j < x.length; j++) { 
       str += '<div id="alphaTabz-' + x[j].ALPHA + '">'; 
       str += '<p>' + j + '</p>'; 
       str += '</div>'; 
      } 

     } 
     $('#displayAlphaList').append(str); 
    }, 
    error: function(data){ 
    } 
}); 
} 

這裏是我叫我的document.ready jquery的標籤：

$('#displayAlphaList').tabs(); 
var d = '<cfoutput>#session.ad.AppDeptID#</cfoutput>'; 
alphaTabs(d) 

生成的html很好，但對$（'＃displayAlphaList'）。tabs（）的調用無法識別標籤，因此它看起來只是純html，並且不會創建標籤。預先感謝您的任何洞察力，您可以幫助我。

Answer 1

您在創建選項卡之前調用$（'＃displayAlphaList'）。tabs（）。

您需要在'成功'功能結束時調用$('#displayAlphaList').tabs();。

function alphaTabs(d){ 
$.ajax({ 
    url: "CFCs/ManageUserProfiles.cfc", 
    dataType: "json", 
    data: { 
     method: "ALPHA_RL", 
     DEPTMATRICSID: d 
    }, 
    success: function(response){ 
     var x = response.items; 
     var str = ''; 
     if (response.items[0] != undefined) { 
      str += '<div id="displayAlphaList">' 
      str += '<ul>'; 
      for (var i = 0; i < x.length; i++) { 
       str += '<li><a href="#alphaTabz-' + x[i].ALPHA + '">' + x[i].ALPHA + '</a></li>'; 
      } 
      str += '</ul>'; 
      for (var j = 0; j < x.length; j++) { 
       str += '<div id="alphaTabz-' + x[j].ALPHA + '">'; 
       str += '<p>' + j + '</p>'; 
       str += '</div>'; 
      } 
      str += '</div>'; 
     } 
     $('#alphaList').html(str); 
     $('#displayAlphaList').tabs(); 
    }, 
    error: function(data){ 
    } 
}); 
}