jQuery数据表插件通过Ajax调用加载Asp.Net中继器
包谭三
问题内容：
问题答案：
我正在尝试使用DataTables插件为Ajax数据绑定Asp.Net Repeater控件，但无法正常工作以下是我的代码。
$(document).ready(function () {
$('#tblMessages').dataTable({
"sDom": 'T<"clear">lfrtip',
"oLanguage": { "sSearch": "Search the Messages:" },
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"iDisplayLength": 25,
"bProcessing": true,
"bServerSide": true,
"bFilter": true,
"sAjaxSource": "../QCDataServices.asmx/GetPatients",
"fnServerData": function(sSource, aoData, fnCallback) {
aoData.push("{pageSize:'20',pageNumber:'1'}");
$.ajax({
"type": "POST",
"dataType": 'json',
"contentType": "application/json; charset=utf-8",
"url": sSource,
"data": aoData,
"success": function (msg) {
fnCallback(msg.d);
}
});
},
"sPaginationType": "full_numbers",
"oTableTools": {
"aButtons": [
"copy",
"csv",
"xls",
{
"sExtends": "pdf"
},
"print"
]
},
"aaSorting": [[0, "desc"]]
});
});
这是作为Json对象获得的Class
public class PatientGridDataSet
{
public int sEcho { get; set; }
public int iTotalRecords { get; set; }
public int iTotalDisplayRecord { get; set; }
public List<Patient> aaData { get; set; }
}
这是服务方法
[WebMethod(EnableSession=true)]
public PatientGridDataSet GetPatients(int pageSize, int pageNumber)
{
var patlist=Patients("", "", "");
return new PatientGridDataSet {sEcho = pageNumber,iTotalRecords = patlist.Count, iTotalDisplayRecord = pageSize, aaData= patlist.Skip(pageSize * pageNumber).Take(pageSize).ToList() };
}
[WebMethod(EnableSession = true)]
public List<Patient> Patients(string searchIn, string Operator, string searchString)
{
List<Patient> result;
try
{
DataRow[] rows;
var table = new dsVw_Patients.vw_PatientsDataTable();
var adapter = new vw_PatientsTableAdapter();
adapter.Fill(table);
//DataTable distinctTable = originalTable.DefaultView.ToTable( /*distinct*/ true);
string hid = Context.Session["HospitalId"] == null ? "0" : Context.Session["HospitalId"].ToString();
string rid = Context.Session["RoleId"] == null ? "0" : Context.Session["RoleId"].ToString();
string uid = Context.Session["UserId"] == null ? "0" : Context.Session["UserId"].ToString();
if (searchIn.Equals(""))
{
rows = hid.Equals("0") ? table.DefaultView.ToTable(true).Select("1=1", "PatientName ASC") : table.DefaultView.ToTable(true).Select("HospitalId="+hid, "PatientName ASC");
if(rid.Equals("5"))
rows = table.DefaultView.ToTable(true).Select("UserId="+uid, "PatientName ASC");
}
else
{
if (hid.Equals("0"))
{
rows = Operator.Contains("%") ? table.DefaultView.ToTable(true).Select(searchIn + " like '" + Operator.Replace("_", searchString) + "'", searchIn + " ASC") : table.DefaultView.ToTable(true).Select(searchIn + " " + Operator + " '" + searchString + "'", searchIn + " ASC");
}
else
{
rows = Operator.Contains("%") ? table.DefaultView.ToTable(true).Select("HospitalId=" + hid+" and "+searchIn + " like '" + Operator.Replace("_", searchString) + "'", searchIn + " ASC") : table.DefaultView.ToTable(true).Select("HospitalId=" + hid + " and " + searchIn + " " + Operator + " '" + searchString + "'", searchIn + " ASC");
}
if (rid.Equals("5"))
{
rows = Operator.Contains("%") ? table.DefaultView.ToTable(true).Select(searchIn + " like '" + Operator.Replace("_", searchString) + "'", searchIn + " ASC") : table.DefaultView.ToTable(true).Select(searchIn + " " + Operator + " '" + searchString + "'", searchIn + " ASC");
}
}
var tieup=new clsTieUpCompanies();
result = rows.Select(row => new Patient
{
PatientId = Convert.ToInt32(row["PatientId"]), PatientName = row["PatientName"].ToString(), Address = row["Address"].ToString(), Street = row["Street"].ToString(), City = row["City"].ToString(), ContactNo = row["Contactno"].ToString(), MobileNo = row["MobileNo"].ToString(), Email = row["Email"].ToString(), State = row["State"].ToString(), Country = row["Country"].ToString(), BPLCardNo = row["BPLCardNo"].ToString(), Company = tieup.GetTieupCompanyName(Convert.ToInt32(row["CompanyId"]))
}).ToList();
}
catch (Exception)
{
result = null;
}
return result;
}
首先，当我调用我的Web服务方法时，它没有去那里，请告诉我其余代码是否正确，这是标记
<asp:Repeater ID="rptList" runat="server">
<HeaderTemplate>
<table id="tblMessages">
<thead>
<tr>
<th>
Patient Name
</th>
<th>
Address
</th>
<th>
City
</th>
<th>
Contact No
</th>
<th>
MobileNo
</th>
<th>
BPL Card No.
</th>
</tr>
</thead>
<tbody>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<%# Eval("PatientName")%>
</td>
<td>
<%#Eval("Address")%>
</td>
<td>
<%# Eval("City")%>
</td>
<td>
<%# Eval("ContactNo")%>
</td>
<td>
<%# Eval("MobileNo")%>
</td>
<td>
<%# Eval("BPLCardNo")%>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</tbody> </table>
</FooterTemplate>
</asp:Repeater>
问题答案：
@蒂姆·詹姆斯
我已经做到了，但是我尝试使用它的原因是无视的。仅提取80条记录需要花费大量时间。在这里找到我的客户代码。
$(document).ready(function () {
var grid = $('#tblMessages').dataTable({
"sDom": 'T<"clear">lfrtip',
"oLanguage": { "sSearch": "Search the Messages:" },
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"iDisplayLength": 25,
"oTableTools": {
"aButtons": [
"copy",
"csv",
"xls",
{
"sExtends": "pdf"
},
"print"
]
},
"bProcessing": true,
"bSort": true,
"sPaginationType": "full_numbers",
"bServerSide": true,
"sAjaxSource": "../QCDataServices.asmx/GetPatients",
"fnServerData": function (sSource, aoData, fnCallback) {
var jsonAOData = JSON.stringify(aoData);
$.ajax({
type: "POST",
//dataType: "json",
contentType: "application/json; charset=utf-8",
url: sSource,
data: "{jsonAOData : '" + jsonAOData + "'}",
success: function (msg) {
fnCallback(JSON.parse(msg.d));
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.responseText);
}
});
},
"aoColumnDefs": [
{ "fnRender": function (oObj) {
return "<a href='../FrmMessage.aspx?id='" + oObj.aData[0] + "><img src='../../images/SMS.png'/></a>";
},
"bSortable": false,
"aTargets": [0]
},
{ "sName": "PatientName",
"bSearchable": true,
"aTargets": [1]
},
{ "sName": "Address",
"bSearchable": true,
"bSortable": true,
"aTargets": [2]
},
{ "sName": "ContactNo", "aTargets": [3] },
{ "sName": "MobileNo", "aTargets": [4] },
{ "sName": "BPL Card No", "aTargets": [5] }
]
});
grid.fnSetFilteringDelay(1000);
});
我已使用此链接提供的解决方案 http://activeengine.wordpress.com/2011/02/09/datatablepager-
now-has-multi-column-sort-capability-for-datatables-
net/
我的Web服务方法是
[WebMethod(EnableSession = true)]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public string GetPatients(string jsonAOData)
{
var patients= Patients("", "", "");
var dataTablePager = new DataTablePager<Patient>(jsonAOData, patients);
var formattedList = dataTablePager.Filter();
return JsonConvert.SerializeObject(formattedList);
}
[WebMethod(EnableSession = true)]
public IQueryable<Patient> Patients(string searchIn, string Operator, string searchString)
{
IQueryable<Patient> result ;
try
{
DataRow[] rows;
var table = new dsVw_Patients.vw_PatientsDataTable();
var adapter = new vw_PatientsTableAdapter();
adapter.Fill(table);
//DataTable distinctTable = originalTable.DefaultView.ToTable( /*distinct*/ true);
var hid = Context.Session["HospitalId"] == null ? "0" : Context.Session["HospitalId"].ToString();
var rid = Context.Session["RoleId"] == null ? "0" : Context.Session["RoleId"].ToString();
var uid = Context.Session["UserId"] == null ? "0" : Context.Session["UserId"].ToString();
if (searchIn.Equals(""))
{
rows = hid.Equals("0") ? table.DefaultView.ToTable(true).Select("1=1", "PatientName ASC") : table.DefaultView.ToTable(true).Select("HospitalId="+hid, "PatientName ASC");
if(rid.Equals("5"))
rows = table.DefaultView.ToTable(true).Select("UserId="+uid, "PatientName ASC");
}
else
{
if (hid.Equals("0"))
{
rows = Operator.Contains("%") ? table.DefaultView.ToTable(true).Select(searchIn + " like '" + Operator.Replace("_", searchString) + "'", searchIn + " ASC") : table.DefaultView.ToTable(true).Select(searchIn + " " + Operator + " '" + searchString + "'", searchIn + " ASC");
}
else
{
rows = Operator.Contains("%") ? table.DefaultView.ToTable(true).Select("HospitalId=" + hid+" and "+searchIn + " like '" + Operator.Replace("_", searchString) + "'", searchIn + " ASC") : table.DefaultView.ToTable(true).Select("HospitalId=" + hid + " and " + searchIn + " " + Operator + " '" + searchString + "'", searchIn + " ASC");
}
if (rid.Equals("5"))
{
rows = Operator.Contains("%") ? table.DefaultView.ToTable(true).Select(searchIn + " like '" + Operator.Replace("_", searchString) + "'", searchIn + " ASC") : table.DefaultView.ToTable(true).Select(searchIn + " " + Operator + " '" + searchString + "'", searchIn + " ASC");
}
}
//.Skip(pageSize*pageNumber).Take(pageSize).ToList().
var tieup=new clsTieUpCompanies();
result = rows.Select(row => new Patient
{
PatientId = Convert.ToInt32(row["PatientId"]), PatientName = row["PatientName"].ToString(), Address = row["Address"].ToString(), Street = row["Street"].ToString(), City = row["City"].ToString(), ContactNo = row["Contactno"].ToString(), MobileNo = row["MobileNo"].ToString(), Email = row["Email"].ToString(), State = row["State"].ToString(), Country = row["Country"].ToString(), BPLCardNo = row["BPLCardNo"].ToString(), Company = tieup.GetTieupCompanyName(Convert.ToInt32(row["CompanyId"]))
}).AsQueryable();
}
catch (Exception)
{
result = null;
}
return result;
}
请指导如何提高性能。
类似资料：
-
我在这里找过类似的帖子，但是我找不到符合我要求的帖子。我试图显示jQuery数据。在UI上，我得到日期参数，并对servlet进行ajax调用。servlet将处理并返回json数据。一旦我得到的数据，我想显示在数据表的结果。但是我的代码不起作用。我是新的数据。这是我的代码： servlet返回的json数据：
-
问题内容： 我正在尝试通过ajax和php调用一些数据库数据。但是ajax调用不起作用，我无法在网络上找到解决方案。 所以这是我的代码： test.php 如果我在浏览器中键入该网址： 通过jsonEncode返回的数据是正确的，但是当我使用jquery将其加载到html页面时，他无法读取数据。 test.html 提前致谢。 问题答案： 您的 变量 没有价值。您想使用 字符串 。也许您也希望能够
-
我使用一个自定义搜索函数的ajax查询，返回超文本标记语言数据成功调用。我想把这个数据附加到已经在页面上初始化的jQuery数据表中。当页面加载jQuery可数据显示，但是当我启动搜索功能，数据被附加到可数据，但不是排序，可搜索形式的可数据用户界面。ajax调用工作和数据返回时，我把成功的调用到console.log. 以下是HTML： 下面是带有Ajax调用的JQuery： }）； 这是从aja
-
问题内容： 我正在创建一个浏览大量图片的应用程序。至此，项目的那部分完成了，它对正确的图片进行了排序，过滤和加载，甚至将它们拆分为单独的页面以加快加载速度。 效果很好，但每页加载25张图片仍需要8秒钟以上。我已经进行了一些研究，得出的结论是，使用异步jQuery Ajax请求是最好的方式，以便尽可能快地同时加载所有请求。 到目前为止，这是我的代码： 此代码的问题在于，除了带有灰色边框的空白方形外，
-
问题内容： 所以我知道有很多类似的帖子，但是我认为这足以满足自己的疑问： 我正在用PHP和jQuery构建XLS导出器。我正在尝试使用jQuery发布一个数组（我相信它与GET查询字符串一样长），并用它在我的服务器上生成XLS文件，然后用户可以下载该文件。 过去，我使用隐藏的iframe来完成此操作，但是由于它们只是重定向到url，因此这要求我使用GET，这使我感到紧张。 我的问题是：如果这些文件
-
问题内容： 我写了一个wordpress插件，在模板中添加了一些注释功能。通过ajax，所有内容都应传输到wordpress数据库中。 问题是-ajax处理程序需要一个php文件，用于通过捕获查询 在用户传输查询时，ajax处理程序将如下所示调用php文件： 该 getvars.php 不知道WordPress的环境，因为它是由用户直接调用提交，我想补充的WordPress的环境类，包括是不是好作