一聚教程网:一个值得你收藏的教程网站

热门教程

ajax实现三级联动菜单代码

时间:2022-06-25 04:07:56 编辑:袖梨 来源:一聚教程网

类似的三级绑定,但在修改信息的时候,绑定然后再提交,下拉框的值总会消失,或者就是回传以后,下拉框的值也会消失,这两天又遇到同样的问题,所以下决心把这个彻底搞定。

本实例用的是jquery+ashx实现。


第一种情况,只有提交的情况

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Area.asp教程x.cs" Inherits="Area" %>



    无标题页
   
   


   


   

    <select name="province" id="province" onchange="doChange('province','city','0','')">省
   
   
   

   


三个select分别用于显示省,市,县

以下是GetArea.ashx代码

<%@ WebHandler Language="C#" Class="GetArea" %>

using System;
using System.Web;
using System.Data;
using GeodonHelper;

public class GetArea : IHttpHandler {
   
    public void ProcessRequest (HttpContext context) {
        string startValue = "{"items":[";
        string endValue = "]}";
        if (context.Request.QueryString["pid"] == null || !ValidateHelper.IsInteger(context.Request.QueryString["pid"].ToString()))
        {
            context.Response.Write(startValue + "{value:"",text:"参数错误"}" + endValue);
            context.Response.End();
        }
        else
        {
            int pid = int.Parse(context.Request.QueryString["pid"].ToString());

            string middleValue = "";
            //DBHelper是我自己写的数据库教程操作类库,目前支持MSSQL MySql,Access,SQlite,此处的代码可以换成你自己的数据库操作代码。

            DBHelper sh = DBHelper.CreateInstance();

            string sql = "select Id,AreaName from Area where ParentId=@pid";
            sh.Params.Add("@pid", pid);
            DataTable tb = sh.ExecuteDataTable(sql);
            int count = tb.Rows.Count;
            if (count == 0)
            {
                context.Response.Write(startValue + "{value:"",text:"没有数据"}" + endValue);
                context.Response.End();
            }
            else
            {
                for (int i = 0; i < count; i++)
                {
                    middleValue += ",{value:"" + tb.Rows[i]["Id"].ToString().Trim() + "",text:"" + tb.Rows[i]["AreaName"].ToString().Trim() + ""}";
                }

                middleValue = middleValue.Substring(1);
                context.Response.Write(startValue + middleValue + endValue);
                context.Response.End();
            }
        }
    }
 
    public bool IsReusable {
        get {
            return true;
        }
    }

}

 

提交数据的时候用Request["province"],Request["city"],Request["area"]

第二种情况:修改信息先从数据库获取省市县编号,然后绑定三个select,然后再提交数据.

aspx页面

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Edit.aspx.cs" Inherits="Edit" %>



    无标题页
   
   


   


   

   
   
   
   

            onclick="btn_submit_Click" /> http://www.111com.net
   

   
   

 

因为要为每个select赋值,而这个赋值又只能在ajax加载成功之后进行,所以我采取的办法是写三个方法,分别用于加载省,市,县

下面是aspx.cs代码

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using GeodonHelper;

public partial class Edit : System.Web.UI.Page
{
    public string province = "", city = "", area = "";
    protected void Page_Load(object sender, EventArgs e)
    {
        if (Request.QueryString["id"] != null)
        {
            province = "97";
            city = "279";
            area = "1469";
        }
    }
    protected void btn_submit_Click(object sender, EventArgs e)
    {
        lbl_msg.Text = Request["province"] + "&" + Request["city"] + "&" + Request["area"];
    }
}

 

ajax加载数据用的还是GetArea.ashx。 

热门栏目