将asp.net webform发送到JQuery Autocomplete的最佳实践 [英] Best pratice to send asp.net webform to JQuery Autocomplete
问题描述
我想要做的是从MS SQL Customer表Email列中检索所有电子邮件，并使用JQuery自动完成功能填充它们。当前系统使用的是VB.NET 2.0。
What I want to do is retrieve all emails from MS SQL Customer table Email column and populate them in using JQuery autocomplete feature. The current system is using VB.NET 2.0.
我所做的就是获取所有电子邮件并将它们放入DataTable并循环并将它们放入由分隔的字符串中。将该字符串放入隐藏的框中。 JQuery从该隐藏框中检索值并使用array = emails.split（，）;构建数组。这是代码。
What I have done is get all emails and put them in DataTable and loop through and put them in the string delimited by ",". Put that string into hidden box. JQuery retrieve value from that hidden box and build an array using "array = emails.split(",");". Here is the code.
它在开发服务器上工作得非常好，因为我们只有2000多条记录，但是当我将它放在有效的服务器上时它会永远加载80,000多条记录。
It works pretty good on development server since we have only 2,000+ records but it is loading forever when I put that on the live server where there are 80,000+ records.
前端
<script type="text/javascript">
$(function() {
var emails = $("#EmailList").val();
var emailList = emails.split(",");
$(".email-autocomplete").autocomplete({
source: emailList
});
});
</script>
<asp:TextBox class="email-autocomplete" ID="txtEmailAddress"
runat="server" style="width:300px"></asp:TextBox>
<asp:HiddenField ID="EmailList" runat="server" />
后端
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
FetchEmailList()
End Sub
Private Sub FetchEmailList()
Dim dt As Data.DataTable = GetCustomers()
Dim i As Integer
Dim _emails As String
For i = 0 To dt.Rows.Count()-1
If IsDBNull(dt.Rows(i).Item("Email")) = False Then
_emails &= dt.Rows(i).Item("Email") & ","
End If
Next
If _emails.length > 0 Then
EmailList.Value = _emails.substring(0,_emails.length-1)
End If
End Sub
我想出了两个解决方案 -
I come up with two solutions -
-
我从数据库服务器检索电子邮件，我将使用函数TableToStr并将所有由，分隔的电子邮件放在一个字段中，VB.NET获取该值并将其放入隐藏框中。在这里，我们可以通过后端的数据表删除循环。但是，JQuery仍然需要拆分该字符串来构建数组。
When I retrieve emails from database server, I will use function TableToStr and put all emails delimited by "," in one field and VB.NET get that values and put it in hidden box. Here we can remove Looping through datatable in back end. However, JQuery still needs to "split" that string to build an array.
从DB获取电子邮件，构建JSON并将其返回给JQuery。（我有在使用C＃的ASP.NET MVC3中完成，使用返回JSON非常简单，但需要在VB.NET 2.0中进行一些研究。
Get emails from DB, build JSON and return it to JQuery.(I have done that in ASP.NET MVC3 with C# which is pretty easy using "return JSON" but need to do some researches how to do it in VB.NET 2.0).
当我们的数据源非常大时，处理自动完成的最佳做法是什么。
What is the best practice to deal with autocomplete when our data source is quite large.
推荐答案
首先，我会将您的后端代码移动到一个通用的HttpHandler（.ashx）文件，然后通过AJAX从jQuery自动完成中调用该文件。此外，缓存AJAX响应将提高性能。
First off, I would move your back end code to a generic HttpHandler (.ashx) file, then call that file from the jQuery autocomplete via AJAX. Also, caching the AJAX response will increase the performance.
<script type="text/javascript>
$(function() {
var cache = {},
lastXhr;
$(".email-autocomplete").autocomplete({
minLength: 2,
source: function( request, response ) {
var term = request.term;
if ( term in cache ) {
response( cache[ term ] );
return;
}
lastXhr = $.getJSON( "getEmails.ashx", request, function( data, status, xhr ) {
cache[ term ] = data;
if ( xhr === lastXhr ) {
response( data );
}
});
}
});
});
</script>
*改编自jQuery UI演示
*adapted from the jQuery UI demo
JSON响应可能很简单： {emailils：[email1 @ email.com，email2 @email.com，email3 @email.com]}
The JSON response could be something as simple as:{ "emails" : ["email1@email.com", "email2@email.com", "email3@email.com"]}
此外，你的后端代码也应该使用 StringBuilder 而不是'& ='。我发现字符串追加是一个巨大的性能损失。
Also, your back end code should also use StringBuilder rather than '&='. I have found string appends to be a huge performance hit.
这篇关于将asp.net webform发送到JQuery Autocomplete的最佳实践的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
