zoukankan      html  css  js  c++  java
  • 文本框与autocomplete结合使用

     

    JS脚本引用   

    <script src="/scripts/Jquery.autocomplete/jquery.autocomplete.js" type="text/javascript"></script>

     样式引用   

    <style type="text/css" media="all">
            @import url("/scripts/Jquery.autocomplete/css/jquery.autocomplete.css");
        </style>

    JS代码

           $(document).ready(function () {
                $("#<%=_SearchKeyGame.ClientID %>").autocomplete("./AjaxHandle/AutoComplete.ashx?type=game", {
                    minChars: 0,
                    max: 9,
                     150,
    
                    matchContains: true,
                    autoFill: false,
                    formatItem: function (row, i, max) {
    
                        return row.name;
                    },
    
                    formatMatch: function (row, i, max) {
                        return row.name + " ";
                    },
    
                    formatResult: function (row) {
                        return row.name;
                    }
    
                });
                jQuery("#<%=_SearchKeyGame.ClientID %>").result(function (event, data, formatted) {
                    if (data) {
                        jQuery("#_SearchKeyGame").attr("value", data.name);
                    }
                    else {
    
                    }
    
                });
    
                $("#<%=_SearchKeyPlat.ClientID %>").autocomplete("./AjaxHandle/AutoComplete.ashx?type=plat", {
                    minChars: 0,
                    max: 9,
                     150,
    
                    matchContains: true,
                    autoFill: false,
                    formatItem: function (row, i, max) {
                      
                        return  row.name;
                    },
    
                    formatMatch: function (row, i, max) {
                        return row.name + " ";
                    },
    
                    formatResult: function (row) {
                        return row.name;
                    }
    
                });
    

     AutoComplete。ashx返回JOSON值

        string queryStr = context.Request.QueryString["q"];
                context.Response.ContentType = "text/plain";
                context.Response.Cache.SetNoStore();
                string jsponString = "[";
                string where = string.Format(" (select  dbo.[f_GetPy](platname)) like '%{0}%' or platname like '%{0}%'", Common.Common.ToSql(queryStr));
                DataTable dt = new Models.Plat().GetDataTable(where,10);
                if (dt.Rows.Count > 0)
                {
                    for (int i = 0; i < dt.Rows.Count; i++)
                    {
                        jsponString += "{id:\"" + dt.Rows[i]["PlatID"].ToString() + "\",name:\"" + dt.Rows[i]["PlatName"].ToString() + "\"},";
                    }
                }
                jsponString = jsponString.Trim(new char[] { ',' });
    
                jsponString += "]";
                context.Response.Write(jsponString);
    
                context.Response.End();
  • 相关阅读:
    Python 之 raw_input()与input()区别
    Python基础语法
    在Cloudera Hadoop CDH上安装R及RHadoop(rhdfs、rmr2、rhbase、RHive)
    MapReduce 过程详解
    Cloudera Manager and CDH安装及配置
    RFC 目录
    聊一聊 tcp拥塞控制 九 fack
    聊一聊tcp 拥塞控制 八 相关数据结构&& 概念
    聊一聊 tcp 拥塞控制 七 转载
    udp connected socket
  • 原文地址:https://www.cnblogs.com/zgaspnet/p/2521323.html
Copyright © 2011-2022 走看看