Ajax数据源（对象）：TypeError：f未定义 [英] Ajax data source (objects) :TypeError: f is undefined

问题描述

我正在使用我的ASP.Net Web应用程序，我必须使用Ajax数据源填充一个HTML表格，我正在使用jQuery DataTables插件。

HTML代码

  ; table class =table table-stripe table-hover table-bordered displayid =examplecellspacing =0width =100％> 
< thead> 
< tr> 
< th> Prctice Group Risk No 
< / th> 
< th  Practice_Group 
< / th> 
< th> Risk_Category 
< / th> 
< / tr> 
< / thead> 
< / table> 
  

JavaScript代码

$ b $数据表（{
ajax：{
dataType：'json'，
contentType：application / json; charset = utf-8，
type：POST，
url：index.aspx / Risky
}，
列：[
{data：Prctice_Group_Risk_No}，
{data：Practice_Group}，
{data：Risk_Category}]
}）;

这里是我的Web方法我正在调用以获取对象列表的JSON响应

  [WebMethod] 
 [ScriptMethod] 
 public static string Risky（）
 {
 return JsonConvert.SerializeObject（riskList）; 
} 
  

来自服务器的JSON响应：

  d：[{Prctice_Group_Risk_No：1，Practice_Group：M& A，Risk_Category：利益冲突 }，{Prctice_Group_Risk_No：2，Practice_Group：abc，Risk_Category：客户关怀和沟通}] 
  

返回的JSON响应对我来说似乎是正确的，在jquery DataTables
http://www.datatables.net/examples/ajax/objects.html

但是没有数据被填充在表中，我的Firebug控制台中出现以下错误

TypeError：f is undefined

< blockquote>

解决方案

默认情况下，jQuery DataTables预期Ajax采购数据采用以下格式。

  {
data：[
 
] 
} 
  

如果数据格式不同，您需要使用 ajax.dataSrc 定义表数据的数据属性（ d 您的示例）。

我不是ASP.NET专家，但似乎您以JSON格式对数据进行编码两次。

对于您当前的服务器端代码，请尝试此JavaScript代码：

  $（'＃example'）。 DataTable（{
ajax：{
dataType：'json'，
contentType：application / json; charset = utf-8，
type：POST，
url：index.aspx / Risky，
dataSrc：function（json）{
 return $ .parseJSON（json.d）; 
} 
}，
列：[
 {data：Prctice_Group_Risk_No}，
 {data：Practice_Group}，
 {data：Risk_Category} 
] 
}）; 
  

I am working on my ASP.Net web application where I have to populate an HTML table with Ajax data source for which I am making a use of jQuery DataTables plugin.

HTML code:

<table class="table table-striped table-hover table-bordered display" id="example" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Prctice Group Risk No
            </th>
            <th>Practice_Group
            </th>
            <th>Risk_Category
            </th>
        </tr>
    </thead>
</table>

JavaScript Code:

$('#example').DataTable({
    "ajax": {
        "dataType": 'json',
        "contentType": "application/json; charset=utf-8",
        "type": "POST",
        "url":"index.aspx/Risky"
    },
    "columns": [
        { "data": "Prctice_Group_Risk_No" },
        { "data": "Practice_Group" },
        { "data": "Risk_Category" }]
});

And here is my Web Method I am making a call to to get a JSON response of list of objects

 [WebMethod]
 [ScriptMethod]
    public static string Risky()
    {
        return JsonConvert.SerializeObject(riskList);
    }

JSON response from server:

d:"[{"Prctice_Group_Risk_No":1,"Practice_Group":"M&A","Risk_Category":"Conflicts of Interests"},{"Prctice_Group_Risk_No":2,"Practice_Group":"abc","Risk_Category":"Client Care and Communication"}]

The JSON response returned seems fine to me as described in the official site of jquery DataTables http://www.datatables.net/examples/ajax/objects.html

But no data is been populated in the table and I get the following error in my Firebug Console

TypeError: f is undefined

解决方案

By default, jQuery DataTables expects Ajax sourced data in the following format.

{ 
   "data": [

   ]
}

If data format differs, you need to use ajax.dataSrc to define data property for table data (d in your example).

I'm not ASP.NET expert but it seems that you encode your data in JSON format twice.

For your current server-side code, try this JavaScript code:

$('#example').DataTable({
    "ajax": {
        "dataType": 'json',
        "contentType": "application/json; charset=utf-8",
        "type": "POST",
        "url":"index.aspx/Risky",
        "dataSrc": function (json) {
           return $.parseJSON(json.d);
        }
    },
    "columns": [
        { "data": "Prctice_Group_Risk_No" },
        { "data": "Practice_Group" },
        { "data": "Risk_Category" }
    ]
});

这篇关于Ajax数据源（对象）：TypeError：f未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！