阿賈克斯數據的回調被視爲字面

阿賈克斯數據作爲文字阿賈克斯數據的回調被視爲字面

處理我使用jQuery UI自動完成。它適用於本地數據源。但是，當我將數據源更改爲遠程ajax數據源時，它不像本地數據源那樣工作。它似乎將回調數據視爲文字或字符串，而不是像數組或JSON那樣的數據源，即使回調數據是JSON。此外，回調數據與本地數據具有相同的合成。

本地數據源：

是被印刷到控制檯

var local = [ 
    { 
     "label": "item 1", 
     "value": "item 1", 
     "id": 1 
    }, 
    { 
     "label": "item 2", 
     "value": "item 2", 
     "id": 2 
    }, 
    { 
     "label": "item 3", 
     "value": "item 1", 
     "id": 3 
    } 
];

回調數據來源：

[ 
    { 
     "label": "CIS104", 
     "value": "CIS104", 
     "id": "35" 
    }, 
    { 
     "label": "CIS214", 
     "value": "CIS214", 
     "id": "60" 
    }, 
    { 
     "label": "CIS256", 
     "value": "CIS256", 
     "id": "61" 
    }, 
    { 
     "label": "CIS335", 
     "value": "CIS335", 
     "id": "62" 
    } 
];

這是我的HTML：

<head> 
<title>AutoComplete TextBox with jQuery</title> 
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> 
    <script type="text/javascript"> 

     var localsource = [ 
    { "label": "item 1", "value": "item 1", "id": 1 }, 
    { "label": "item 2", "value": "item 2", "id": 2 }, 
    { "label": "item 3", "value": "item 1", "id": 3}]; 

    $(function() { 
     $("[id$=txtAuto]").autocomplete(
    { 
     source: function(request, response) { 
      $.ajax(
      { 
       url: "/playground/service/PlayGroundWebService.asmx/GetListOfCourse", 
       data: "{ 'param': '" + request.term + "' }", 
       dataType: "json", 
       type: "POST", 
       contentType: "application/json; charset=utf-8", 
       async: true, 
       success: function(data) { 
       //data.d because it's .NET web application  

        var remotesource = data.d; 
       //It works if remotesource = localsource 
        response(remotesource); 
        console.log(remotesource); 
       }, 
       error: function(result) { } 
      }); 
     }, 
     select: function(event, ui) { 
      alert(ui.item.id); 
     } 
    }); 
    });  

    </script> 
</head> 
<body> 

    <div class="demo"> 
     <div class="ui-widget"> 
      <label for="txtAuto">Enter Course # or title: </label> 
      <input id="txtAuto" type="text" style="width: 600px" /> 
     </div> 
    </div> 

</body> 
</html>

誰能告訴是什麼問題？由於

更新1：

的console.log（數據）給出了這樣的：

Object { d= 

"[ { "label": "CIS104", "value": "CIS104", "id": "35" }, 
{ "label": "CIS214", "value": "CIS214", "id": "60" }, 
{ "label": "CIS256", "value": "CIS256", "id": "61" }, 
{ "label": "CIS335", "value": "CIS335", "id": "62" } ]" 

}

來源

2013-05-09 Narazana

'console.log（data）'顯示了什麼？（沒有'.d'屬性。） – nnnnnn 2013-05-09 10:45:26

我在上面的update 1中添加了console.log（data）。 – Narazana 2013-05-09 10:55:17

我想通了。我需要使用JavaScript eval方法將遠程數據源轉換爲JavaScript對象（字符串 - >對象）

// Change var remotesource = data.d; to this: 

var remotesource = eval("(" + data.d + ")");

來源

2013-05-09 12:30:23 Narazana

不要使用' eval（）'，使用'JSON.parse（）'。（或者jQuery的'.parseJSON（）'）。儘管我認爲最好修復服務器端代碼，以便首先返回您需要的JSON，而不是將其作爲字符串掩埋在'd'屬性中。 – nnnnnn 2013-05-09 20:53:38

你檢查結果是從請求目標網址是什麼？

在Chrome中運行您的腳本，並查看控制檯中的網絡選項卡。當您運行啓動ajax調用的進程時，您應該看到記錄的請求。點擊請求並查看響應，是否如預期的那樣？ - 它失敗了嗎？

這就是你需要開始的地方。

來源

2013-05-09 10:47:41 Matt

Ajax回調正在工作。自動完成工作，但它對待不同的回調數據，例如，如果我鍵入「C」它顯示C，我，S，1,0,4，..這樣，而不是顯示CIS104，CIS256 – Narazana 2013-05-09 12:18:39

阿賈克斯數據的回調被視爲字面

回答

相關問題