jquery.autocomplete 根据拼音搜索
目前实现了可以根据汉字、字母搜索需要实现的是 输入拼音首字母 显示出相应数据
例如 输入x 列出西安、西宁、咸阳 ...........
目前代码：
1、添加引用
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.autocomplete.js"></script>
2、js
<script type="text/javascript">
/*==========用户自定义方法==========*/
var cityList;
//autocomplete选项
var options = {
minChars: 1,
max: 500,
width: 250,
matchContains: true,
formatItem: function(row, i, max) {//显示出来的项格式
return row.StationName;
},
formatMatch: function(row, i, max) {
return row.StationName+" "+row.AreaName+" "+row.TypeName+" "+row.ManStationName ; //用户输入的内容在哪些数据项里面搜索。例如现在是在 基站、区域、类型、负责人;
},
formatResult: function(row) {
return row.StationName;
}
};
//autocomplete初始化函数
function initAutoComplete(json) {
$("#inputName").autocomplete(json, options);
$("#inputName").result(function(event, data, formatted) {//data 选中的行json对象. formatted是formatMatch返回的值.
$("#inputId").val(data.StationID);
});
}
/*==========加载时执行的语句==========*/
$(function() {
//加载城市数据, 并在回调函数中用返回的数据初始化autocomplete
$.getJSON("products.ashx", {}, function(json) {
initAutoComplete(json);
})
});
</script>
3、JsonHelper.cs
public class JsonHelper
{
public static string ConvertDataTableToJson(DataTable dt)
{
StringBuilder JsonString = new StringBuilder();
//Exception Handling
if (dt != null && dt.Rows.Count > 0)
{
JsonString.Append("[ ");
for (int i = 0; i < dt.Rows.Count; i++)
{
JsonString.Append("{ ");
for (int j = 0; j < dt.Columns.Count; j++)
{
if (j < dt.Columns.Count - 1)
{
JsonString.Append( dt.Columns[j].ColumnName.ToString() + ":" + "\"" + dt.Rows[i][j].ToString() + "\",");
}
else if (j == dt.Columns.Count - 1)
{
JsonString.Append( dt.Columns[j].ColumnName.ToString() + ":" + "\"" + dt.Rows[i][j].ToString() + "\"");
}
}
/**/
/*end Of String*/
if (i == dt.Rows.Count - 1)
{
JsonString.Append("} ");
}
else
{
JsonString.Append("}, ");
}
}
JsonString.Append("]");
return JsonString.ToString();
}
else
{
return null;
}
}
}
4、products.ashx
public class products : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "application/json";
context.Response.Write(getProducts());
}
private string getProducts()
{
string re = JsonHelper.ConvertDataTableToJson(DBHelper.GetTable());
return re;
}
public bool IsReusable
{
get
{
return false;
}
}
}
先谢谢各位了
--------------------编程问答-------------------- jQuery autoComplete 自动完成 --------------------编程问答-------------------- 看看... --------------------编程问答-------------------- 呵呵 解决了 自己采用了一种笨办法 和大家分享下
autocomplete 用户输入的内容在哪些数据项里面搜索
我通过
#region 提取基站名称首字母
public DataTable GetStationInfo(DataTable dtInfo)
{
DataTable dt = new DataTable();
dt.Columns.Add("StationID", typeof(int));
dt.Columns.Add("StationName", typeof(string));
dt.Columns.Add("AreaName", typeof(string));
dt.Columns.Add("TypeName", typeof(string));
dt.Columns.Add("ManStationID", typeof(decimal));
dt.Columns.Add("ManStationName", typeof(string));
dt.Columns.Add("Spell", typeof(string));
foreach (DataRow dr in dtInfo.Rows)
{
DataRow row = dt.NewRow();
row["StationID"] = dr["StationID"].ToString();
row["StationName"] = dr["StationName"].ToString();
row["AreaName"] = dr["AreaName"].ToString();
row["TypeName"] = dr["TypeName"].ToString();
row["ManStationID"] = dr["ManStationID"].ToString();
row["ManStationName"] = dr["ManStationName"].ToString();
row["Spell"] = GetChineseSpell(dr["StationName"].ToString());
dt.Rows.Add(row);
}
return dt;
}
private string GetChineseSpell(string strText)
{
int len = strText.Length;
string myStr = "";
for (int i = 0; i < len; i++)
{
myStr += getSpell(strText.Substring(i, 1));
}
return myStr;
}
private string getSpell(string cnChar)
{
byte[] arrCN = Encoding.Default.GetBytes(cnChar);
if (arrCN.Length > 1)
{
int area = (short)arrCN[0];
int pos = (short)arrCN[1];
int code = (area << 8) + pos;
int[] areacode = { 45217, 45253, 45761, 46318, 46826, 47010, 47297, 47614, 48119, 48119, 49062, 49324, 49896, 50371, 50614, 50622, 50906, 51387, 51446, 52218, 52698, 52698, 52698, 52980, 53689, 54481 };
for (int i = 0; i < 26; i++)
{
int max = 55290;
if (i != 25) max = areacode[i + 1];
if (areacode[i] <= code && code < max)
{
return Encoding.Default.GetString(new byte[] { (byte)(65 + i) }).ToLower();
}
}
return "*";
}
else
return cnChar;
}
#endregion
用户输入的内容在我的数据项里面搜索 ，希望有深入了解autocomplete 的朋友们给出更好的答案 --------------------编程问答-------------------- 呵呵！
--------------------编程问答--------------------
mark --------------------编程问答-------------------- 楼上有什么问题吗 ？ --------------------编程问答-------------------- 我也想跟你学学怎么实现你说的功能，能说得清楚些吗 --------------------编程问答-------------------- --------------------编程问答-------------------- 看看。。。。 --------------------编程问答-------------------- 路过，来学习下 --------------------编程问答--------------------
借助现有的汉字转拼音的js文件，很容易就实现(autocompleteArray)的按拼音查找！！
如下：
1. 在 if( options.data != null ){ 下声明：
var stMatchSetsPy = {};
2.在 stMatchSets[sFirstChar].push(row); 下增加：
if (typeof(getSpell) == "function") //getSpell是转换拼音的方法
var _py = getSpell(sFirstChar).toLowerCase();
if( !stMatchSetsPy[_py] ) stMatchSetsPy[_py] = [];
stMatchSetsPy[_py].push(row);
}
3.在for( var k in stMatchSets ){ ... } 后面增加：
for( var k in stMatchSetsPy ){
options.cacheLength++;
addToCache(k, stMatchSetsPy[k]);
}
就这三步，就实现了autocompleteArray方法的拼音支出！！！！！
ajax没试过！！ --------------------编程问答-------------------- 忘了最重要的一步：
在方法：function matchSubset(s, sub) {
的第一行增加判断中文：
//isChinese是判断是否为中文，是就转化为拼音
if (isChinese(s)) s = getSpell(s); --------------------编程问答-------------------- 感觉好难懂哦，我现在网站要用一个首字母搜索的，无从下手
额 没人救， 只能自救了 --------------------编程问答-------------------- 感觉好难懂哦，我现在网站要用一个首字母搜索的，无从下手
额 没人救， 只能自救了 --------------------编程问答-------------------- 可以动态的通过汉字得到拼音
其实最简单的就是在数据表中增加一列拼音列 --------------------编程问答--------------------
补充：.NET技术 , ASP.NET
