從Ajax請求創建JavaScript數組

我想填充一個數組（使用jquery-ui元素）使用Ajax請求，我不是很熟悉。有兩個文件，selectStudents.php這是什麼將被視爲與loadStudents.php這就是Ajax請求。從Ajax請求創建JavaScript數組

當我查看loadStudents.php時，複製輸出，並將Ajax請求替換爲完美，所以我只是在做我的ajax問題。任何人都能看到它是什麼？

<script> 
$(function() { 
    var availableTags = new Array(); 

    new Ajax.Request('includes/loadStudents.php', { 

     onSuccess : function(xmlHTTP){ 
      eval(mlHTTP.responseText); 
     } 
    }); 

    $("#tags").autocomplete({ 
     source: availableTags 
    }); 
}); 
</script>

謝謝！

來源

2011-06-15 tgrosinger

您看起來像使用jQuery，只要給定'$（）'樣式，但'Ajax'調用看起來像另一個庫。你在用什麼庫？ – Orbling 2011-06-15 23:20:57

什麼庫是'Ajax.Request'？什麼是'xmlHTTP.responseText'？你爲什麼要評估它？這個問題很可能是一個非常普遍的問題：在'$（「#tags」）.autocomplete（...）'調用後執行'onSuccess'回調**。 Ajax是**異步**。只能訪問你在回調中獲得的數據*。 – 2011-06-15 23:21:58

我正在使用jquery-ui庫以及正常的jquery。這是允許的嗎？ – tgrosinger 2011-06-15 23:35:06

這看起來像prototype。如果你正在使用jQuery，Ajax請求如下：

$.ajax('includes/loadStudents.php', { 
    success: function(data) { 
    // no need to eval, jQuery handles parsing the json for you 
    console.debug(data); 
    } 
});

詳情請參閱jQuery.ajax。

另外使用jQuery UI可以讓自動完成處理Ajax爲您提供：

$('#tags').autocomplete({ 
    source: 'includes/loadStudents.php' 
});

進一步用法請參見jQuery UI Autocomplete。

來源

2011-06-15 23:22:30 scurker

我給了第二個選擇一個嘗試，但沒有運氣，並且自動完成頁面沒有提及它會執行ajax。仍然只是似乎是一個正常的文本框。包含/ loadStudents.php的輸出爲：availableTags [0] ='Doe，Kid'; availableTags [1] ='Smith，John'; – tgrosinger 2011-06-15 23:41:28

@ursa：您的腳本必須返回有效的JSON。 – 2011-06-15 23:44:04

你需要返回一個javascript/json編碼數組，看起來像'['Doe，Kid'，'Smith，John']'。你可以通過創建一個php數組並使用['json_encode']（http://php.net/manual/en/function.json-encode.php）來做到這一點。如果你發佈'loadStudents.php'看起來像什麼，人們可以提供進一步的幫助。 – scurker 2011-06-15 23:46:11

假設Ajax.Request有效，數組設置不正確的原因在我的評論中描述：Ajax是異步。 .autocomplete調用在onSuccess回調運行之前執行（因此在設置數組元素之前）。

您可以通過簡單地把函數內.autocomplete()呼叫解決這個問題。但以不同的方式解決問題會更好：

不要在您的PHP腳本中返回JavaScript。返回JSON：

<?php 
    $data = array('Doe, Kid', 'Smith, John'); 
    echo json_encode($data); 
?>

然後你的JavaScript看起來像：

$(function() { 
    $.getJSON('includes/loadStudents.php', function(data) 
     $("#tags").autocomplete({ 
      source: data 
     }); 
    }); 
});

或者爲@scurker already mentioned，URL作爲值設置爲source。它在documentation描述：

自動填充可以定製與各種數據源的工作，僅通過指定源的選項。數據源可以是：

與本地數據

字符串，指定URL的Array

回調

（...）

當字符串是使用時，Autocomplete插件希望該字符串指向將返回JSON數據的URL資源。它可以位於同一臺主機上或不同的主機上（必須提供JSONP）。請求參數「term」被添加到該URL。數據本身可以採用與上述本地數據相同的格式。

所以爲了這個工作，你必須返回JSON，如上所示。

來源

2011-06-15 23:48:08

從Ajax請求創建JavaScript數組

回答

相關問題