首页 > 代码库 > UpdatePanel控件实现无刷新级联

UpdatePanel控件实现无刷新级联

2024-08-07 10:42:35   222人阅读

.master代码如下：

<%@ Master Language="VB" CodeFile="0_MST_ASPNET12.master.vb" Inherits="_0_MST_ASPNET12" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href=http://www.mamicode.com/"CSS/CSS_DEFAULT.css" rel="stylesheet" type="text/css" />>
.aspx代码如下：
<%@ Page Title="" Language="C#" MasterPageFile="~/0_MST_ASPNET12.master" AutoEventWireup="true" CodeFile="S4_UpdatePanel_ddls.aspx.cs" Inherits="Sample_code_S4_UpdatePanel_ddls" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="CPH_memo" Runat="Server">
    <strong>级联查询DropDownList:</strong>
    <ul>
        <li>ddl_p[省],内容不会改变,放在UpdatePanel外</li>
        <li>设置Triggers -> ddl_p</li>
        <li>ddl_c[市]数据绑定之后,会再次影响ddl_d的数据,所以绑定完成之后,需要强制ddl_d再次绑定数据</li>
        <li>掌握数据绑定在页面生命周期中的位置</li>
    </ul>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="cph_main" Runat="Server">
    <p class ="showtime">页面时间: <%=DateTime.Now.ToFileTime() %></p>
    请选择地区:
    <asp:DropDownList ID="ddl_p" runat="server" DataSourceID="ads_p" 
        DataTextField="p_name" DataValueField="p_id" AutoPostBack="True">
    </asp:DropDownList>
    <asp:AccessDataSource ID="ads_p" runat="server" DataFile="~/DATA/China.mdb" 
        SelectCommand="SELECT * FROM [T_Province]"/>

    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

    <asp:UpdatePanel ID="Upnl_ddls" runat="server" RenderMode="Inline" 
        UpdateMode="Conditional"> <%--RenderMode="Inline" 以流的方式显示（行显示）--%>
        <ContentTemplate>
            
            <asp:DropDownList ID="ddl_c" runat="server" DataSourceID="ads_c" 
                DataTextField="c_name" DataValueField="c_id" AutoPostBack="True" OnDataBound="load_d"><%--OnDataBound="load_d"强制绑定一下--%>
            </asp:DropDownList>
            <asp:AccessDataSource ID="ads_c" runat="server" DataFile="~/DATA/China.mdb" 
                SelectCommand="SELECT [c_name], [c_id] FROM [T_City] WHERE ([c_pid] = ?)">
                <SelectParameters>
                    <asp:ControlParameter ControlID="ddl_p" Name="c_pid" 
                        PropertyName="SelectedValue" Type="Int32" />
                </SelectParameters>
            </asp:AccessDataSource>

              <asp:DropDownList ID="ddl_d" runat="server" DataSourceID="ads_d"  OnDataBound="checkitems"
                DataTextField="d_name" DataValueField="d_id">
            </asp:DropDownList>
            <asp:AccessDataSource ID="ads_d" runat="server" DataFile="~/DATA/China.mdb" 
                SelectCommand="SELECT [d_id], [d_name] FROM [T_District] WHERE ([d_cid] = ?)">
                <SelectParameters>
                    <asp:ControlParameter ControlID="ddl_c" Name="d_cid" 
                        PropertyName="SelectedValue" Type="Int32" />
                </SelectParameters>
            </asp:AccessDataSource>

            <p class ="showtime">UpdatePanel时间: <%=DateTime.Now.ToFileTime() %></p>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID ="ddl_p" />
        </Triggers>
    </asp:UpdatePanel>


   


</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="cph_output" Runat="Server">
    <asp:Button ID="Button1" runat="server" Text="读取选择" onclick="Button1_Click" />
    <asp:Label ID="lbl_result" runat="server" />
</asp:Content>


注意点：
<span style="background-color: rgb(204, 0, 0);"> RenderMode="Inline" </span>
<span style="background-color: rgb(204, 0, 0);"> OnDataBound="load_d"</span>
.aspx.cs代码如下：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Sample_code_S4_UpdatePanel_ddls : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    //第二个DDL,数据绑定完成后,要求第三个DDL重新进行数据绑定
    protected void load_d(object sender, EventArgs e) {
        ddl_d.DataBind();
    }


    //最后一个DDL,如果内容为空,则不显示
    protected void checkitems(object s, EventArgs e) {
        if (ddl_d.Items.Count == 0) { ddl_d.Style["display"] = "none"; } else { ddl_d.Style.Remove("display"); }
    }


    //读取选择的按钮
    protected void Button1_Click(object sender, EventArgs e)
    {
        string _s = "您选择的是:" + ddl_p.SelectedItem.Text + " / " +  ddl_c.SelectedItem.Text + " / " + ddl_d.SelectedItem.Text + "。";

        lbl_result.Text = _s;
    }

}

效果如下：

UpdatePanel控件实现无刷新级联


联系
我们