程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> 關於.NET >> 用戶輸入查詢與拼音首字母的結合,提高用戶的操作體驗

用戶輸入查詢與拼音首字母的結合,提高用戶的操作體驗

編輯:關於.NET

我們在界面設計的時候,不管是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

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved