用AJAX改变DROPDOWNLIST的值

最新推荐文章于 2021-08-05 14:49:26 发布
原创 最新推荐文章于 2021-08-05 14:49:26 发布 · 2.1k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#ajax #xmlhttprequest #function #webform #string #generator

本文介绍了一个使用AJAX技术动态更新DropdownList控件值的示例。具体实现了当文本框内容变化时，根据不同的参数请求服务器端的不同方法，并更新下拉列表。示例包含客户端JavaScript代码和服务器端C#处理逻辑。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

本例用2003写的，当text中的值改变时，而 改变DORPDOWNLIST中的值，实现代码如下：

index.asp

<%@ Page language="c#" Codebehind="Index.aspx.cs" AutoEventWireup="false" Inherits="Demo.WebForm1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
    <HEAD>
        <title>WebForm1</title>
        <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
        <meta name="CODE_LANGUAGE" Content="C#">
        <meta name="vs_defaultClientScript" content="JavaScript">
        <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
        <script>
         var httpRequest;
        function TextChanged()
        {
         var obj=document.getElementById("txtInput");
         var pra="2";
          createXMLHttpRequest();
             httpRequest.onreadystatechange = doContents;//调用doContents函数 
            httpRequest.open('GET', "request.aspx?pra="+pra, true);//根据不同的PRA值来调用不同的服务端方法;
            httpRequest.send(null); 
        }
        
        function doContents()
        {
        
         if(httpRequest.readystate==4)
         {
          if (httpRequest.status==200)
          {
            var str=httpRequest.responseText;
            AddDropDownListItem(str);
          }
         }
         
         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]));
                }
                
            }
         }
        
        }
        
        function CreateXmlRequestHttp()
        {
        if(window.XMLHttpRequest)// 在非IE浏览器中创建XMLHttpRequest对象
        {
            httpRequest=new XMLHttpRequest();
        }
        else if(window.ActiveXObject)
        {
            httpRequest=new  ActiveXObject("Microsoft.XMLHTTP");//通过MS ActiveX创建XMLHttpRequest<BR>
        }
        else
        {
            alert("你的浏览器不能使用AJAX运用！");
        }
        
        }
        
        function createXMLHttpRequest() 
        {
  
  if (window.XMLHttpRequest) 
  { // 在非IE浏览器中创建XMLHttpRequest对象
    httpRequest = new XMLHttpRequest();
  } else if (window.ActiveXObject) { //通过MS ActiveX创建XMLHttpRequest
    try {
      // 尝试按新版InternetExplorer方法创建
      httpRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e1) { // 创建请求的ActiveX对象失败
      try {
        // 尝试按老版InternetExplorer方法创建
        httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e2) {
        // 不能通过ActiveX创建XMLHttpRequest
      }
    }
  }
 
} 
        
        
        
        </script>
    </HEAD>
    <body MS_POSITIONING="GridLayout">
        <form id="Form1" method="post" runat="server">
            <input type="text" name="txtInput" id="txtInput" onblur="TextChanged()">
            <asp:DropDownList id="ddlSelectList" style="Z-INDEX: 101; LEFT: 192px; POSITION: absolute; TOP: 16px"
                runat="server"></asp:DropDownList>
        </form>
    </body>
</HTML>

request.cs 用来处理回调事件！

 

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

namespace Demo
{
    /// <summary>
    /// request 的摘要说明。
    /// </summary>
    public class request : System.Web.UI.Page
    {
        private void Page_Load(object sender, System.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@Ten;2@";
        }
        Web 窗体设计器生成的代码
    }
}
asp.net中dropdownlist使用AJAX联动
01-22
asp.net中dropdownlist使用AJAX联动
ASP.NET Ajax级联DropDownList实现代码
01-20
为了提供更好的用户体验，我们可以使用ASP.NET AJAX来实现无刷新的级联DropDownList。ASP.NET AJAX允许我们在客户端进行部分页面更新，从而避免了不必要的页面刷新。以下是实现步骤： 1. **创建XML数据文件**： ...
用Ajax实现DripDownList联动时，服务器端获取不到DropDownList的值（被清空）
用你的满腔热情去创造美好事物
12-17 1220
      以前就碰到这样一个问题用Ajax实现2个DropDownList的联动，当点击保存按钮时，发现那个DropDownList列表被清空了。我很郁闷，按理说，服务器端的控件都会有一个状态（ViewState），不会被清空的。网上找了资料，与一个同事做了测试，终于发现了一个问题。      如果在服务器端对一个服务器端控件（如DropDownList）进行绑定后，起状态将被保存；在客户端
动态添加DropDownList 的(通过ajax) 联动方式
数据库天地
10-18 230
page: &lt;form id="form1" runat="server"&gt; &lt;div&gt; &lt;asp:DropDownList ID="ddlType" onchange="JavaScript:selectChange(this.selectedIndex);" runat="server"&gt; &a
jQuery ajax方法绑定Dropdownlist
weixin_30483013的博客
03-06 253
过程 前台拖一个DropDownList 控件 为其绑定数据调用后面的ajax方法、　　 注意 data 的格式，json有标准，写错了不调用 前后参数传递要对应，名字一致，个数一致 susscess回调函数 返回的（data）是object ，可以alert 一下试试，如果返回json 需要通过data.d获取json 在后台cs 文件需引用System.Web.Serv...
c# dropdownlist json ajax
hejisan的专栏
04-18 452
public string CityJsonResult() { int provinceId = Request["provinceId"].ParseTo(1); List proviceList = new Services().GetList(provinceId, 2); Response.Cont
ASP.NET MVC3使用AJAX实现DropDownList级联效果
本文将介绍如何在ASP.NET MVC3框架中使用AJAX技术实现DropDownList控件的级联效果。这种效果通常用于当一个下拉列表的选择改变时，根据所选值动态更新另一个下拉列表的选项。 在ASP.NET MVC中，我们可以利用AJAX的...
AJAX实现dropdownlist无刷新动态绑定，联动
09-28
本文将详细讲解如何使用AJAX实现dropdownlist（下拉列表）的无刷新动态绑定以及联动效果。 一、AJAX基础 AJAX的核心是通过JavaScript在后台与服务器进行异步数据交换，无需刷新整个页面，即可更新部分网页内容。在...
MVC3 ASP.NET AJAX DropDownList 级联
10-30
- 接收前端通过Ajax请求传递的参数`typeSO`，该参数是用户在第一个DropDownList中选择的值。 - 使用`Convert.ToInt32`将字符串转换为整型ID，然后调用`DALsot.GetBySectionOfficeId(id)`获取与该ID相关的`...
dropdownlist 联动 ajax
11-12
- 当`ddl1`的值改变时，触发一个AJAX请求，将所选值作为参数传递给服务器。 2. **服务器端处理**： - `AjaxData.aspx.cs`是处理AJAX请求的后端代码，它接收来自前端的参数，通常是`ddl1`的选定值。 - 使用`...
dropdownlist ajax联动,asp.net省市三级联动的DropDownList+Ajax的三种框架(aspnet/Jquery/ExtJs)示例...
weixin_28835789的博客
08-05 491
本文主要列举了省市三级联动的DropDownList+Ajax的三种框架(aspnet/Jquery/ExtJs)示例。前段时间需要作一个的Web前端应用，需要用多个框架，一个典型的应用场景是省市三级联动，基于此应用，特将三种主要的ajax框架略作整理，方便有需要的朋友查阅。在示例之前，我们先设置一个演示数据源，新建一个项目，项目结构如图：主要文件如下：AreaModel.cs:using Sys...
根据textbox中的值，改变dropdownlist的选项
lee576的专栏
05-11 4153
前台: function Select(txtId,ddlId) { function myFunc() { //alert(document.getElementById(txtId).value); //alert(document.getElementById(ddlId).value);
用AJAX实现下拉框（DropDownList）的联动
宁静以致远,淡泊以明志
10-09 2325
目的：学习AJAX，用于实现在 选择“省份”下拉框时候，联动实现在“城市”下拉框中显示出相应的“城市”名称 。步骤1：在页面CS文件中的PAGE_LOGD方法中注册  protected void Page_Load(object sender, EventArgs e)   {        AjaxPro.Utility.RegisterTypeForAjax(typeof(cs文件的
asp.net jquery ajax数据操作 DropDownList级联
分享经验，共同进步.
11-25 5631
1、定义一个类 CityCounty.cs文件，如下： using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Runtime.Serialization; /// ///CityCounty 的摘要说明 /// [DataContract] pu
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值