后台读取前台下拉框选项值(DropDownList)

最新推荐文章于 2024-04-20 19:26:14 发布

dd_zhouqian

最新推荐文章于 2024-04-20 19:26:14 发布

阅读量1.5w

点赞数 1

文章标签： ajax DROPDOWNLIST 后台读取

纠结于到底是原创还是转载发表，考虑再三，最终还是选择以转载发表，本文参考来自于【fanfengchimo】的

http://blog.csdn.net/fanfengchimo/article/details/2078101的博客文章

及【jack86514】的http://blog.csdn.net/jack86514/article/details/1906436的博客文章。

本人的开发环境为win7+vs2010旗舰版+IE9

现文章整合后如下

1.vs2010创建web网站

2.default.aspx

<%@ Page Language="C#" EnableEventValidation="false"  AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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>
        <script type="text/javascript">
            var httpRequest;
            //输入编辑框失去焦点时，触发ajax加载下拉框(DropDownList)事件
            function TextChanged() {
                var obj = document.getElementById("txtInput");
                var pra = "2";
                createXMLHttpRequest();
                //调用doContents函数
                httpRequest.onreadystatechange = doContents; 
                //根据不同的PRA值来调用不同的服务端方法
                httpRequest.open('GET', "request.aspx?pra=" + pra, true); 
                httpRequest.send(null);
            }
            //将ajax返回数据加载到下拉框(DropDownList)中
            function doContents() {
                if (httpRequest.readystate == 4) {
                    if (httpRequest.status == 200) {
                        var str = httpRequest.responseText;
                        AddDropDownListItem(str);
                    }
                }
                //添加数据到下拉框(DropDownList)中
                function AddDropDownListItem(str) {
                    var objItem = str.split('@');
                    var obj = document.getElementById("ddlSelectList");
                    obj.options.length = 0;
                    var i;
                    for (i = 0; i < objItem.length; i++) {
                        var item = objItem[i].split(';');
                        if (item[0] != "" && item[1] != "") {
                            obj.options.add(new Option(item[0], item[1]));
                        }
                    }
                    obj.options.options[0].selected = true;
                    document.getElementById('Hidden1').value = obj.options[0].innerText;
                }
            }
            //创建XMLHttpRequest对象
            function createXMLHttpRequest() {
                    httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
                    //httpRequest = new ActiveXObject("Msxml2.XMLHTTP");
            }
            //将选中下拉框(DropDownList)的值赋给隐藏控件(Hidden1)
            function func1() {
                var itemText;
                var obj = document.getElementById("ddlSelectList");
                for (var i = 0; i < obj.options.length; i++) 
                {
                    if (obj.options[i].selected) {
                        itemText = obj.options[i].innerText;
                        document.getElementById('Hidden1').value = itemText;
                    }
                }
            }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    </div>
    <p>
        <input id="txtInput" type="text" οnblur="TextChanged();"/>
        <asp:DropDownList ID="ddlSelectList" runat="server" Height="34px" Width="208px" οnchange="func1();">
        </asp:DropDownList>
        <input id="Hidden1" type="hidden" name="Hidden1" />
    </p>
    <asp:Button ID="Button1" runat="server" οnclick="Button1_Click" Text="Button" />
    </form>
</body>
</html>

注意本页面中需要在第一行增加【EnableEventValidation="false"】,以解决页面出现【回发或回调参数无效】的问题。具体见下图

3.default.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 _Default : System.Web.UI.Page
{
    protected void Button1_Click(object sender, EventArgs e)
    {
        Response.Write(Request.Form["Hidden1"]);
    }
}

4.request.aspx

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

<!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>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    </div>
    </form>
</body>
</html>

5.request.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 request : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Response.Clear();
        string pra = Request.QueryString["pra"].ToString();

        if (pra == "1")
        {
            Response.Write(GetString1());
        }
        else
        {
            Response.Write(GetString2());
        }
        Response.End();
    }

    private string GetString1()
    {
        return "First;1@Second;2@";
    }

    private string GetString2()
    {
        return "Third;1@Nine;2@Ten;3@";
    }
}

以上代码已在上述开发环境进行测试。现记录下来，方便以后查找。目前后台(button事件)代码每次读取前台【Hidden1】隐藏控件的数值时，页面都会刷新一次，个人感觉实用性不是很好。