我們在界面設計的時候,不管是Web的還是Winform的程序,為了方便用戶對各種數據進行操作,提高用戶的操作體驗,都是一個永恆不變的話題,需要盡可能地提高。本文拋磚引玉,介紹本人在Web和Winform中使用拼音簡碼以及智能提示的具體例子,對這個話題進行探討。
在下面的Web界面中,我們可以通過拼音首字母或者部分中文內容,來模糊搜索(類似Google搜索的智能提示),一個方便用戶搜索,第二個有效利用Ajax技術來提高用戶的體驗。
用戶可以輸入中文,一樣有智能提示。
在Winform界面中,同樣也可以做到智能提示,由於Winform中的響應速度比較快,我們可以根據輸入的首字母或者部分中文快速更新列表內容即可,如下圖所示。
其實以上兩個,都是需要一個Sql函數,就是把中文轉換為首字母的函數,以便能夠快速搜索內容,下面我列出SqlServer和Oracle的轉換首字母的函數。以飨讀者。
SqlServer的漢字轉拼音碼的函數:
代碼
--
-- Definition for user-defined function f_GetPy :
--
GO
create function [dbo].f_GetPy(@str nvarchar(4000))
returns nvarchar(4000)
as
begin
declare @strlen int,@re nvarchar(4000)
declare @t table(chr nchar(1) collate Chinese_PRC_CI_AS,letter nchar(1))
insert into @t(chr,letter)
select '吖 ', 'A ' union all select '八 ', 'B ' union all
select '嚓 ', 'C ' union all select '咑 ', 'D ' union all
select '妸 ', 'E ' union all select '發 ', 'F ' union all
select '旮 ', 'G ' union all select '铪 ', 'H ' union all
select '丌 ', 'J ' union all select '咔 ', 'K ' union all
select '垃 ', 'L ' union all select '嘸 ', 'M ' union all
select '拏 ', 'N ' union all select '噢 ', 'O ' union all
select '妑 ', 'P ' union all select '七 ', 'Q ' union all
select '呥 ', 'R ' union all select '仨 ', 'S ' union all
select '他 ', 'T ' union all select '屲 ', 'W ' union all
select '夕 ', 'X ' union all select '丫 ', 'Y ' union all
select '帀 ', 'Z '
select @strlen=len(@str),@re= ' '
while @strlen> 0
begin
select top 1 @re=letter+@re,@strlen=@strlen-1
from @t a where chr <=substring(@str,@strlen,1)
order by chr desc
if @@rowcount=0
select @re=substring(@str,@strlen,1)+@re,@strlen=@strlen-1
end
return(@re)
end
Oracle的漢字轉拼音首字母的函數:
代碼
CREATE OR REPLACE FUNCTION F_PINYIN(P_NAME IN VARCHAR2) RETURN VARCHAR2 As
V_COMPARE VARCHAR2(100);
V_RETURN VARCHAR2(4000);
FUNCTION F_NLSSORT(P_WORD IN VARCHAR2) RETURN VARCHAR2 As
BEGIn
RETURN NLSSORT(P_WORD, 'NLS_SORT=SCHINESE_PINYIN_M');
END;
BEGIn
FOR I IN 1..NVL(LENGTH(P_NAME), 0) LOOP
V_COMPARE := F_NLSSORT(SUBSTR(P_NAME, I, 1));
IF V_COMPARE >= F_NLSSORT('吖') AND V_COMPARE <= F_NLSSORT('驁') THEn
V_RETURN := V_RETURN || 'A';
ELSIF V_COMPARE >= F_NLSSORT('八') AND V_COMPARE <= F_NLSSORT('簿') THEn
V_RETURN := V_RETURN || 'B';
ELSIF V_COMPARE >= F_NLSSORT('嚓') AND V_COMPARE <= F_NLSSORT('錯') THEn
V_RETURN := V_RETURN || 'C';
ELSIF V_COMPARE >= F_NLSSORT('咑') AND V_COMPARE <= F_NLSSORT('鵽') THEn
V_RETURN := V_RETURN || 'D';
ELSIF V_COMPARE >= F_NLSSORT('妸') AND V_COMPARE <= F_NLSSORT('樲') THEn
V_RETURN := V_RETURN || 'E';
ELSIF V_COMPARE >= F_NLSSORT('發') AND V_COMPARE <= F_NLSSORT('猤') THEn
V_RETURN := V_RETURN || 'F';
ELSIF V_COMPARE >= F_NLSSORT('旮') AND V_COMPARE <= F_NLSSORT('腂') THEn
V_RETURN := V_RETURN || 'G';
ELSIF V_COMPARE >= F_NLSSORT('妎') AND V_COMPARE <= F_NLSSORT('夻') THEn
V_RETURN := V_RETURN || 'H';
ELSIF V_COMPARE >= F_NLSSORT('丌') AND V_COMPARE <= F_NLSSORT('攈') THEn
V_RETURN := V_RETURN || 'J';
ELSIF V_COMPARE >= F_NLSSORT('咔') AND V_COMPARE <= F_NLSSORT('穒') THEn
V_RETURN := V_RETURN || 'K';
ELSIF V_COMPARE >= F_NLSSORT('垃') AND V_COMPARE <= F_NLSSORT('擽') THEn
V_RETURN := V_RETURN || 'L';
ELSIF V_COMPARE >= F_NLSSORT('嘸') AND V_COMPARE <= F_NLSSORT('椧') THEn
V_RETURN := V_RETURN || 'M';
ELSIF V_COMPARE >= F_NLSSORT('拏') AND V_COMPARE <= F_NLSSORT('瘧') THEn
V_RETURN := V_RETURN || 'N';
ELSIF V_COMPARE >= F_NLSSORT('筽') AND V_COMPARE <= F_NLSSORT('漚') THEn
V_RETURN := V_RETURN || 'O';
ELSIF V_COMPARE >= F_NLSSORT('妑') AND V_COMPARE <= F_NLSSORT('曝') THEn
V_RETURN := V_RETURN || 'P';
ELSIF V_COMPARE >= F_NLSSORT('七') AND V_COMPARE <= F_NLSSORT('裠') THEn
V_RETURN := V_RETURN || 'Q';
ELSIF V_COMPARE >= F_NLSSORT('亽') AND V_COMPARE <= F_NLSSORT('鶸') THEn
V_RETURN := V_RETURN || 'R';
ELSIF V_COMPARE >= F_NLSSORT('仨') AND V_COMPARE <= F_NLSSORT('蜶') THEn
V_RETURN := V_RETURN || 'S';
ELSIF V_COMPARE >= F_NLSSORT('侤') AND V_COMPARE <= F_NLSSORT('籜') THEn
V_RETURN := V_RETURN || 'T';
ELSIF V_COMPARE >= F_NLSSORT('屲') AND V_COMPARE <= F_NLSSORT('鶩') THEn
V_RETURN := V_RETURN || 'W';
ELSIF V_COMPARE >= F_NLSSORT('夕') AND V_COMPARE <= F_NLSSORT('鑂') THEn
V_RETURN := V_RETURN || 'X';
ELSIF V_COMPARE >= F_NLSSORT('丫') AND V_COMPARE <= F_NLSSORT('韻') THEn
V_RETURN := V_RETURN || 'Y';
ELSIF V_COMPARE >= F_NLSSORT('帀') AND V_COMPARE <= F_NLSSORT('咗') THEn
V_RETURN := V_RETURN || 'Z';
END IF;
END LOOP;
RETURN V_RETURN;
END;
使用代碼大概如下所示:
使用例子1:
代碼
/// <summary>
/// 根據商品名稱獲取商品列表
/// </summary>
/// <param name="goodsType">商品類型</param>
/// <returns></returns>
public List<GoodsInfo> FindByName(string goodsName)
{
string sql = string.Format("Name like '%{0}%' or dbo.f_GetPy(Name) like '{0}%' ", goodsName);
return this.Find(sql);
}
使用例子2(基於Ajax的Web智能提示):
數據庫訪問層的代碼如下所示:
代碼
/// <summary>
/// 獲取公司名稱
/// </summary>
/// <param name="topCount"></param>
/// <param name="name"></param>
/// <returns></returns>
public List<string> GetTopCompanyName(int topCount, string name)
{
string sql = string.Format(@"Select * from (Select Company_Name from tb_enterprise where Company_Name like '%{1}%' or F_PINYIN(Company_Name) like '%{1}%' )
WHERE ROWNUM <= {0} ORDER BY ROWNUM ASC", topCount, name);
DataTable dt = SqlTable(sql);
List<string> list = new List<string>();
foreach (DataRow row in dt.Rows)
{
list.Add(row[0].ToString());
}
return list;
}
Web前台部分頁面如下所示:
代碼
<td align="left" style="background-color: #F1F6FF; width: 200px;">
<asp:TextBox ID="txtCompanyName" runat="server" Width="200"></asp:TextBox>
<cc1:AutoCompleteExtraExtender ID="AutoCompleteExtraExtender1" runat="server" ServiceMethod="GetCompanyNameList"
TargetControlID="txtCompanyName" AsyncPostback="false" UseContextKey="True" AutoPostback="true"
MinimumPrefixLength="2" CompletionInterval="10" OnItemSelected="AutoCompleteExtraExtender1_ItemSelected">
</cc1:AutoCompleteExtraExtender>
</td>
Web後台頁面的代碼如下所示:
代碼
[System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()]
public static string[][] GetCompanyNameList(string prefixText, int count, string contextKey)
{
//獲取自動完成的選項數據
List<string[]> list = new List<string[]>();
List<string> nameList = BLLFactory<Enterprise>.Instance.GetTopCompanyName(count, prefixText.ToUpper());
for (int i = 0; i < nameList.Count; i++)
{
string[] Respuesta = new string[2];
Respuesta[0] = nameList[i];
Respuesta[1] = i.ToString();
list.Add(Respuesta);
}
return list.ToArray();
}
protected void AutoCompleteExtraExtender1_ItemSelected(object sender, EventArgs e)
{
//TextBox txtCompanyName = FindControl(this.AutoCompleteExtraExtender1.TargetControlID) as TextBox;
//string companyName = txtCompanyName.Text;
//根據用戶選項更新顯示相關內容
BindData();
}
這樣就可以,在界面上輸入幾個簡單的英文字符或者中文名稱,就會有智能提示的列表出現,選擇其中一個可以顯示相關的信息了。
由於在Web開發中,為了實現Ajax的智能提示效果,需要一個特殊的類庫,地址如下所示:http://files.cnblogs.com/wuhuacong/AutoCompleteExtra.rar