C#---ASP页面的下拉框模糊查询功能

2021-06-20 22:05

阅读:579

标签:result   box   rip   inpu   font   序列化   内部使用   基础   下拉框   

  • 基础方法支持:

一. DataTable 转换成 Json

  换句话说如何在ASP.NET将一个DataTable序列化为 Json数组,或者如何从一个DataTable返回一个Json字符串。  

  使用 JavaScriptSerializer.

  首先我们添加System.Web.Script.Serialization命名空间,如下:

    using System.Web.Script.Serialization;  

  JavaScriptSerializer这个类是由异步通信层内部使用来序列化和反序列化数据。如果序列化一个对象,就使用序列化方法。反序列化Json字符串,使用Deserialize或DeserializeObject方法。在这里,我们使用序列化方法得到Json格式的数据。代码以下:

 

public static class Data2Json
{
    public static String convertJson(DataTable dt)
    {
        JavaScriptSerializer javaScriptSerializer = new JavaScriptSerializer();
        javaScriptSerializer.MaxJsonLength = Int32.MaxValue;
        ArrayList arrayList = new ArrayList();
        foreach (DataRow dataRow in dt.Rows)
        {
            Dictionarystring, object> dictionary = new Dictionarystring, object>();
            foreach (DataColumn dataColumn in dt.Columns)
            {
                dictionary.Add(dataColumn.ColumnName, dataRow[dataColumn.ColumnName].ToString());
            }
            arrayList.Add(dictionary);
        }
        return javaScriptSerializer.Serialize(arrayList);
    }
}

 

 

二. 加入一般处理程序,将上一步的Json字符串写入HTTP响应输出流,传到前端页面

 

"C#" Class="Xcode" %>

using System;
using System.Web;
using SysManage;
using System.Data;
public class Xcode : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "application/json";
        string str = context.Request["type"];
        string sql = string.Format("select * from XCode where XCODE like ‘{0}%‘", str);
        Database dt = new Database();
        DataTable data = dt.ExecuteSql(sql);

        context.Response.Write(Data2Json.convertJson(data));
    }

    public bool IsReusable
    {
        get { return false; }
    }
}
  •  前端实现方法:

 其中要使用:jquery 的 autocomplete.js ,自行搜索引用即可

script type="text/javascript">

        function dataFind() {

            var fl = $("input[name=‘Rblflcode‘]:checked").val();
            $.ajax({
                contentType: "application/json",
                url: "../Xcode.ashx?type=" + fl,
                dataType: "json",
                success: function (msg) {
                    if (msg == null) {
                    }
                    else if (msg != null) {
                        jQuery(function ($) {
                            $("#flxzTb").autocomplete(msg, {
                                minChars: 0,
                                autoFill: false,         //是否选多个,用","分开
                                mustMatch: false,     //是否全匹配, 如数据中没有此数据,将无法输入
                                matchContains: true,         //是否全文搜索,否则只是前面作为标准
                                scrollHeight: 300,
                                scroll: true,
                                width: $("#flxzTb").width(),
                                multiple: false,
                                formatItem: function (row, i, max) {           //显示格式
                                    return "" + $("#flxzTb").width() + "px;float:left;font-style: normal;font-weight:normal;‘ >" + "[" + row.XCODE + "]---" + row.flmc  + " ";
                                },
                                formatMatch: function (row, i, max) {          //以什么数据作为搜索关键词,可包括中文,
                                    return row.flmc;
                                },
                                formatResult: function (row) {
                                    return  row.flmc ; //返回结果 
                                }
                            });
                        });
                    }
                }
            });
        }
script>

 

  其中  ID = flxzTb 的TextBox控件用于查询显示。 url: "../Xcode.ashx?type=" + fl, 调用 Xcode.ashx 来处理传入的 xcode 字段用于数据库筛选。

  当数据库中存有数据时,通过在TextBox框内键入内容会自动进行相应的内容匹配,以下拉的形式进行显示。

 

C#---ASP页面的下拉框模糊查询功能

标签:result   box   rip   inpu   font   序列化   内部使用   基础   下拉框   

原文地址:https://www.cnblogs.com/JesseP/p/10255322.html


评论


亲,登录后才可以留言!