是否有可能重新加载服务器端的jQuery数据表?
问题描述:
编辑:经过进一步的研究,这听起来像fnReloadAjax不应该用于服务器端的jQuery数据表。我应该使用fnDraw。但是,fnDraw使用相同的sAjaxSource重新加载数据表。有没有办法用新的sAjaxSource 重新加载服务器端数据表,并且不需要每次都重新初始化它?是否有可能重新加载服务器端的jQuery数据表?
原始的问题
我想实现一个服务器端处理jQuery的数据表时遇到麻烦的数据刷新。我在构建这个应用程序的过程中意识到,使用服务器来处理数据表要比客户端快得多。 O_O
获得数据刷新,我不再使用fnReloadAjax功能...
$("#researchTableJSON").dataTable().fnReloadAjax("store_handler.ashx?cmd=99&pubId=2&sub=0");
现在我用...
testJsonDatatable('6','1');
的Javascript
初始化表
function testJsonDatatable(pubId, sub) {
//$.fn.dataTableExt.oStdClasses.sWrapper = "display";
$("#researchTableJSON").dataTable({
"bProcessing": true,
"bServerSide": true,
"bDestroy": true,
"sAjaxSource": "/store/Data.ashx?pubId=" + pubId + "&sub=" + sub,
"bJQueryUI": true,
"sScrollY": "450px",
"bPaginate": false,
//"bSort": false,
"bInfo": true,
"aoColumns": [
{ "sWidth": "400px", "sClass": "center" },
{ "sWidth": "80px", "sClass": "center" },
{ "sWidth": "61px", "sClass": "center", "bSortable": false }
]
});
C#.NET
<%@ WebHandler Language="C#" Class="Data" %>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
public class Data : IHttpHandler
{
private HttpRequest Request;
private HttpResponse Response;
public void ProcessRequest(HttpContext context)
{
Request = context.Request;
Response = context.Response;
var pubId = Request["pubId"];
var sub = Request["sub"];
// Paging parameters:
var iDisplayLength = int.Parse(Request["iDisplayLength"]);
var iDisplayStart = int.Parse(Request["iDisplayStart"]);
// Sorting parameters
var iSortCol = int.Parse(Request["iSortCol_0"]);
var iSortDir = Request["sSortDir_0"];
// Search parameters
var sSearch = Request["sSearch"];
// Fetch the data from a repository (in my case in-memory)
var products = Product.GetProducts(pubId, sub);
// Define an order function based on the iSortCol parameter
Func<Product, object> order = product => iSortCol == 0 ? (object)product.Title : product.Price;
// Define the order direction based on the iSortDir parameter
products = "desc" == iSortDir ? products.OrderByDescending(order) : products.OrderBy(order);
// prepare an anonymous object for JSON serialization
var result = new
{
iTotalRecords = products.Count(),
iTotalDisplayRecords = products.Count(),
aaData = products
.Where(p => p.Title.Contains(sSearch)) // Search: Avoid Contains() in production
//.Where(p => p.Id.ToString().Contains(sSearch))
.Select(p => new[] { p.Title, p.Price.ToString(), p.Action })
//.Skip(iDisplayStart) // Paging
//.Take(iDisplayLength)
};
var serializer = new JavaScriptSerializer();
var json = serializer.Serialize(result);
Response.ContentType = "application/json";
Response.Write(json);
}
public bool IsReusable { get { return false; } }
}
public class Product
{
public string Title { get; set; }
public string Price { get; set; }
public string Action { get; set; }
public static IEnumerable<Product> GetProducts(string pubId, string sub)
{
/*for (int i = 0; i < 57; i++)
{
yield return new Person { Id = i, Name = "name " + i };
}*/
decimal price;
int count = 1;
using (SqlConnection oConn = new SqlConnection(ConfigurationManager.ConnectionStrings["TpsRead"].ConnectionString))
{
SqlDataReader reader;
SqlCommand oCommand = new SqlCommand();
oCommand.Connection = oConn;
oCommand.CommandText = "select distinct pi.pid, pi.display_title, pi.price_ppp, pi.price_sub from tps..sh_pid_info pi inner join tps..sh_pid_detail pd on pi.pid = pd.sub_pid where [email protected] and pi.price_ppp is not null and pi.active > 0 order by display_title";
oCommand.CommandType = CommandType.Text;
oCommand.Parameters.Add("@pubid", SqlDbType.VarChar).Value = pubId;
oConn.Open();
reader = oCommand.ExecuteReader();
while (reader.Read())
{
if (sub == "0")
{
//check if price_ppp is null
if (string.IsNullOrEmpty(reader["price_ppp"].ToString()))
price = 0m;
else
price = Convert.ToDecimal(reader["price_ppp"].ToString());
}
else
{
//check if price_sub is null
if (string.IsNullOrEmpty(reader["price_sub"].ToString()))
price = 0m;
else
price = Convert.ToDecimal(reader["price_sub"].ToString());
}
price = price/100;
yield return new Product { Title = reader["display_title"].ToString(), Price = price.ToString("C"), Action = "<td align=\"center\"><a href=\"JavaScript:void(0)\" onclick=\"addToCart('p_" + reader["pid"].ToString() + "','" + pubId + "')\"><img src=\"/images/store/add-to-cart.png\" alt=\"Add to Cart\" id=\"add-to-cart" + reader["pid"].ToString() + "\" style=\"cursor: pointer\" title=\"Add to Cart\" border=\"0\" /></a></td>" };
//count++;
}
}
}
}
答
尝试重写fnServerData:fnServer的http://www.datatables.net/usage/callbacks#fnServerData
默认的实现是非常简单,只需通过传递它的参数到$就调用。你可以在你的覆盖中做同样的事情,除了将url属性设置为你的自定义值。
然后,您应该能够像您所说的那样调用fnDraw,并且它将使用您的自定义Ajax源而不重新初始化整个表。
// These are essentially globals right now.
// They can be modified before your fnDraw call.
// You may want to namespace them or find another way to encapsulate.
pubId = ...;
sub = ...;
$("#researchTableJSON").dataTable({
// your other init properties here
fnServerData: function (url, data, callback, settings) {
settings.jqXHR = $.ajax({
"url": "/store/Data.ashx?pubId=" + pubId + "&sub=" + sub,
"data": data,
"success": function (json) {
$(settings.oInstance).trigger('xhr', settings);
callback(json);
},
"dataType": "json",
"cache": false
});
}
});