无刷新查询联动

最新推荐文章于 2017-10-04 18:21:11 发布
最新推荐文章于 2017-10-04 18:21:11 发布
阅读量398 收藏
点赞数
分类专栏： Asp.net Ajax 文章标签： xmlhttprequest function dataset input null javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yjinzaghi/article/details/2313672
版权

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <script language="JavaScript" type="text/javascript">
   HTTPRequest = function ()
   {
           var xmlhttp=null;
           try
           {
              xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
           }
           catch (_e)
           {
              try
               {
                 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
               }
               catch (_E)
               {    }
           }
           if (!xmlhttp && typeof XMLHttpRequest != 'undefined')
            {
             try
             {
                xmlhttp = new XMLHttpRequest();
             }
              catch (e)
              {
                xmlhttp = false;
           }  }
           return xmlhttp;
        }
        function ask(url, fieldToFill, lookupField)
         {
           var http = new HTTPRequest();
              http.open("GET", url, false);
           http.onreadystatechange = function()
           {
             handleHttpResponse(http, fieldToFill, lookupField)
           };
           http.send(null);
        }
        function handleHttpResponse(http, fieldToFill, lookupField)
        {
          if (http.readyState == 4)
          {
            result = http.responseText;
            var text;
            text = result.substring(6, 0);
            if(text !="沒有這個類型")
            {
              if ( -1 != result.search("null") )
                 {
              lookupField.style.borderColor = "red";
               fieldToFill.value = "";
              }
             else
             {
              lookupField.style.borderColor = "";
              fieldToFill.value = result;
                }
             }
            else
            {
                fieldToFill.value ="";
            }
           }
         }
        var codeField = null;
        function codechanged()
        {
         codeField = document.getElementById("codecode");
         var code = codeField.value;
         //code.length == 2?updateBooklist(code):code.length == 5?updateBook(code):"";
         if(code.length == 2)
         {
             updateBooklist(code);
         }
         else if(code.length == 5)
         {
             updateBook(code);
         }
         
        }
        function updateBooklist(code)
         {
         var booklistField = document.getElementById("booklist");
         ask("BookAjax.aspx?id="+code, booklistField, codeField);
        }
        function updateBook(code)
         {
         var bookField = document.getElementById("book");
         ask("BookAjax.aspx?id="+code, bookField, codeField);
        }
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table width="300">
            <tr>
                <td style="width: 90px">
                    编号：</td>
                <td style="width: 187px">
                    <input id="codecode" type="text" οnkeyup="codechanged()" /></td>
             
            </tr>
            <tr>
                <td style="width: 90px">
                    分类：</td>
                <td style="width: 187px">
                    <input id="booklist" type="text"  /></td>
              
            </tr>
            <tr>
                <td style="width: 90px; height: 22px">
                    书名：</td>
                <td style="width: 187px; height: 22px">
                    <input id="book" type="text" /></td>
              
            </tr>
        </table>
   
    </div>
    </form>
</body>
</html>
 

 

BookAjax.aspx:

 protected void Page_Load(object sender, EventArgs e)
    {
        if (Request["id"].Length == 2)
        {
            SelectCity("select leiming from biao1 where bianhao ="+Request["id"]);
        }
        else if (Request["id"].Length == 5)
        {
            SelectCity("select shuming from biao2 where ListBianhao =" + Request["id"]);
        }
    }
    public void SelectCity(string strSql)
    {
        SqlConnection con = new SqlConnection(ConfigurationSettings.AppSettings["ConnectionString"]);
        SqlCommand cmd = new SqlCommand(strSql);
        cmd.Connection = con;
        SqlDataAdapter da = new SqlDataAdapter();
        DataSet ds = new DataSet();
        da.SelectCommand = cmd;
        con.Open();
        da.Fill(ds);
        if (ds.Tables[0].Rows.Count !=0)
        {
            Response.Write(ds.Tables[0].Rows[0][0]);
        }
        else
        {
            Response.Write("沒有這個類型");
        }
        con.Close();

    }

yjinzaghi
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
实现无刷新联动例子汇总
09-03
【无刷新联动】技术在现代Web开发中广泛应用于提高用户体验，尤其是在数据交互频繁的场景下。无刷新联动意味着用户在操作一个元素时，无需等待整个页面重新加载，而是仅更新与该操作相关的部分区域，从而加快了交互...
.net2003+ajax 无刷新区域下拉列表
lem's Blog
04-12 1485
1创建三张页面main.aspx、callservershen.aspx、callservershi.aspx在main.aspx页面中放两个下拉列表  然后写javascript script>var xmlhttp=false;var DrpInfo="";function GetXmlHttp()...{  if(window.ActiveXObject)   .
JSF实现无刷新二级联动
xiao__oaix的博客
10-04 2655
效果： 在添加图书页，有一个图书分类的下拉框，选择某分类后会自动刷新出子分类。 要点： JSF有一个"bug"：如果页面中包含了下拉框，则提交表单时，JSF会在应用请求值阶段就对下拉框选择的值进行验证(事实上应该在转换完毕后进行验证)。如果这个值不是可选的值之一，则会抛出校验失败的异常。所以BookBean必须设置在SessionScoped上。 代码： addBook.xhtm
蓝驿轨迹无刷新联动
10-14
"蓝驿轨迹无刷新联动"是一种在网页中实现省市区选择联动效果的技术，它通过Ajax和XML技术，实现了用户在选择省份时，城市和区县选项自动更新，无需页面整体刷新，提高了用户体验。这种技术主要涉及到以下几个核心...
Jquery实现无刷新DropDownList联动实现代码
10-29
这篇文章主要讲述如何使用Jquery实现两个下拉列表（DropDownList）之间的无刷新联动效果。这种技术常用于Web应用开发中，比如在一个下拉列表中选择一个选项时，另一个下拉列表将根据所选项动态地显示相应的内容。 ...
联动无刷新联动
03-29
【联动无刷新联动】是一种常见的前端交互技术，它结合了数据联动和页面无刷新更新的特性，提高了用户体验。在这个项目中，我们通过实例演示了一种简单易懂的联动效果，并利用Ajax技术实现了页面的无刷新更新，使得...
DropDownList年月二级联动无刷新
03-22
本示例中的"DropDownList年月二级联动无刷新"技术，是实现一个高效的用户界面交互功能，即在选择年份时，月份的下拉列表会即时更新，而无需整个页面重新加载，极大地提升了用户体验。 首先，我们要理解“二级联动”...
Mixing JSTL and JSF in Web Applications
Allin's blog
02-12 931
JavaServer Pages Standard Tag Library (JSTL) is a library of standard tags that you can place on JavaServer Pages (JSP). The tags encapsulate functionality commonly used in Web applications. JSTL supp
开始做JSF
Middleware
07-18 970
现在终于对JSF有了一个比较详细的了解，有时候真佩服老外的设计能力：一个Web应用能抽象成这样，而且API的设计有很多讲究，什么是Interface，什么是Abstract,什么是实类，厉害你看FacesServlet竟然是实类，service()里是LifeCycle.execute(),Lifecycle.render()真是抽象的牛不过相对于服务器来讲JSF还是比较简单，实现也比较容易，但是
JSF其他功能二级联动
爱代码 爱生活
09-01 1655
<br />GLP调查表其他联动功能设计思路<br /> <br />实现功能：<br />1：选择下拉框中的其他项，文本域出现；选择的是非其他项，文本徐消失。<br /> <br />2：如果下拉框的值在下拉项中没有匹配到，下拉框的值显示为其他，真正的值显示在输入框中。<br /> <br /> <br />实现方法：<br /> <br />function showQita(obj,number) {<br />if(obj.value=='other'){                      
无刷新分页加存储过程
杨军（yjinzaghi）的专栏
04-22 837
 function InitAjaxSalesList()  {   var ajax = null;   try   {    ajax = new ActiveXObject("Microsoft.XMLHTTP");   }   catch (e)   {    try    {     ajax = new ActiveXObject("Msxml4.XMLHTTP");    }    
实现层移动（div ）
杨军（yjinzaghi）的专栏
04-22 674
    未命名頁面    a{   color:#000;   font-size:12px;text-decoration:none} a:hover{   color:#900;   text-decoration:underline} body{background:;filter:progid:DXImageTransform.Microsoft.Gradient(gradientTyp
随意拖动图片
杨军（yjinzaghi）的专栏
04-22 584
http://images.163.com/homepage/logo.gif" alt="" /> js   //为Number增加一个属性,判断当前数据类型是否是数字    Number.prototype.NaN0=function(){return isNaN(this)?0:this;}    //全局变量    var iMouseDown=false;    var
AJAX 的天气查询
杨军（yjinzaghi）的专栏
04-22 582
    Untitled Page              function makeRequest()       {        http_request = false;       // alert(url);         if (window.XMLHttpRequest)         {             http_request = new XMLHttpReque
菜单的隐藏和显示
杨军（yjinzaghi）的专栏
04-22 549
    未命名頁面         #D1 { BACKGROUND-COLOR: lightgreen;  BORDER-BOTTOM: white 2px outset;  BORDER-LEFT: white 2px outset;  BORDER-RIGHT: white 2px outset;  BORDER-TOP: white 2px outset;  LEFT: 0px; PO
自动锁定提交按钮
杨军（yjinzaghi）的专栏
05-26 499
.aspx     function ButonClicks(Button)             {                 var   mybutton=document.getElementById(Button);                 mybutton.disabled=true;                      mybutton.value ="提
C#实现中国地区三级联动下拉菜单无刷新技术
在C#中实现中国地区三级联动下拉...这种无刷新联动下拉菜单设计有助于提升用户体验，尤其是在大量数据或复杂层级的选择场景中，减少了页面重载导致的性能损耗。同时，它也体现了前端与后端的交互和数据驱动开发的理念。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值