2012-06-21 37 views
1

我在ASP.NET網頁用下面的代碼,Default.aspx的keyup事件稱爲數據庫功能和填充列表框

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script src="../Scripts/jquery-1.7.2.min.js" type="text/javascript"></script> 
    <script src="SearchHandler.js" type="text/javascript"></script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <asp:TextBox ID="search" runat="server"></asp:TextBox> 
     <asp:ListBox ID="listbox" runat="server" SelectionMode="Multiple"></asp:ListBox> 
    </form> 
</body> 
</html> 

在我SearchHandler.js,我有這樣的代碼:

$(document).ready(function() { 
    $('#search').keyup(function() { 
     //..do something here and populate listbox from database query result. 
     //..call C# function GetItems(), passing input as parameter and use to populate ListBox. 
    }); 
}); 

Functions.cs

public class Functions 
{ 
    Database db = new Database(); 
    public List<string> GetItems(string searchinput) 
    { 
     List<string> items = db.DoSomething(searchinput); 
     return items; 
    } 
} 

對不起,我對此很新,但是如何完成上面的代碼來填充同一頁面上的列表框?基本上,每當用戶在文本框中輸入密鑰時,列表框的內容都會刷新。我想從類文件中調用C#函數GetItems()

新的編輯:

基本上GetItems()需要一個按鍵輸入,每次按下一個鍵,它會觸發一個數據庫查詢檢索相關記錄。我有一個表像之下(例如):

TableA 
Name  Country 
Tom  England 
Bill  USA 
John  Australia 
Jim  China 
Harry  Belgium 
Johnathan France 

因此,當有人在搜索框中,「澳大利亞」和「法國」進入「約翰」將在列表框中。

SELECT Country FROM TableA WHERE Name LIKE '%John%' 

編輯21/06/12:如果我不使用KeyUp事件,並使用一個按鈕事件相反,這將使它成爲一個更好的方案?

+0

[使用jQuery到C#中的結果]的可能的重複(http://stackoverflow.com/questions/7740545/using-the-result-from-jquery-into-c-sharp) - 另一種方式但是原則是一樣的。 –

+0

@ Mr.Disappointment您能否提供一個示例,因爲我不太瞭解所發佈的參考信息。謝謝。 – RiceBucket

回答

2

我的第一反應就是不這樣做。每次有人在列表中輸入字母時進行數據庫調用對於您的數據庫訪問而言都將非常昂貴,並且會將您的性能降低到可怕的程度。即使你使用ajax調用 - 你也無法在一段時間內得到迴應。所以我會給你一些廣泛的建議:

  1. 可以有多少條目?你可以將它們加載到JS數組中,並在JS中搜索它們?可能不會,否則你不需要做這個過程。

  2. 從DB獲取列表一次,並將其存儲爲序列化對象。然後搜索這個對象的相關選項。在網站初始化中加載這些數據。

  3. 一旦你輸入了一個字符 - 或者也許是2,取決於你的數據 - 做一個ajax調用來獲得整個相關選項列表。從那裏開始,在JS中使用這個列表來限制基於進一步的輸入。

調整,直到它運作良好。如果需要的話,我可以提供更多的細節。

根據更多細節編輯。

我會建議在第一次按鍵時,加載所有與此單個字符相關的條目。從那裏開始,你可以搜索已加載的匹配列表,從中縮小匹配。

您應該啓動一個ajax查詢,以便第一次獲得所有引用,並且在返回之前不對其他任何引用進行操作。

您可能還希望在應用程序加載時將整個列表加載到內存中,並在需要時採用此子集。可能每個初始字符需要26個條目,但對於這個尺寸,這可能是OTT。它可能取決於你從數據庫調用和選擇中獲得的性能。

這是相當複雜的,但應該產生你需要的答覆界面。

+0

嗨Schroedingers貓,目前的數據只有350條記錄,但這是動態數據,所以可能會有更多或更少。選項1是否兼容?對於選項2,我不太瞭解輸入後如何更新列表框,我們刷新整個頁面?對於選項3,是否意味着獲取每條記錄並將其夾入某種JS數組,然後在其上搜索? – RiceBucket

+0

他們不是選項,他們是點。如果數據是動態的,則2將不合適。 3意味着將數據的一個子集放入一個js數組中 - 只有那些以輸入的條目開頭的條目。如果您將它們全部加載到列表框中,您是否可以不搜索它們,而不必返回服務器? –

+0

我已經更新了我原來的問題。我不確定這是否能夠進一步澄清我試圖達到的目標。或者,如果你能指出我在正確的方向實現這種情況? – RiceBucket

0

不太清楚,但你可能會尋找這樣的事情http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/AutoComplete/AutoComplete.aspx

編輯:沒關係我誤解你的問題,不過,我想看看周圍的Ajax庫,看看是否能找到合適的或者是你可以適應的東西滿足您的需求。祝你好運。

編輯:如果您將列表放入更新面板中,則可以在該事件中刷新它。 http://weblogs.asp.net/jeffreyzhao/archive/2008/04/26/refresh-the-updatepanel-using-javascript-code.aspx