程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> .NET實例教程 >> AjaxPro實現三級聯動

AjaxPro實現三級聯動

編輯:.NET實例教程
效果圖:

數據庫結構圖:(Access)

                              

Html代碼:

<%@ Page Language="C#" AutoEventWireup="true"  EnableEventValidation="false"  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">
<!--更新日期2007-5-12-->
<html XMLns="http://www.w3.org/1999/xHtml" >
<head runat="server">
    <meta http-equiv="Content-Type" content="text/Html; charset=gb2312" />
  &nbsp; <title>AJaxPro實現無刷新三級聯動</title>
    <script language="Javascript" type="text/Javascript">
      <!--
       // ACLOUD 常用JS函數
       function getBid(s){
    return document.getElementById(s);
  }
  function getBmc(s){
    return document.getElementByName(s);
  }
  
       //顯示分類列表
    function showNext(sid,obj)
        {
          if(sid==null || sid=="" || sid.length<1)return;
          var slt =getBid(obj);
       var v = _Default.getNextClass(sid).value; // 類的名稱
       //alert(v);
       //return;
       if (v != null){     
    if(v != null && typeof(v) == "object" && v.Tables != null)
     {  
         slt.length = 0;
         slt.options.length = 0;
         slt.options.add(new Option("請選擇",0));
         //加了個“請選擇”主要為了觸發onchange事件
         if(obj=="ddl2"){
         getBid("ddl3").options.length=0;
         getBid("ddl3").options.add(new Option("請選擇",0));
         }   
      for(var i=0; i<v.Tables[0].Rows.length; i++)
        {
         var txt = v.Tables[0].Rows[i].txt; //這個地方需要注意區分大小寫
         

var vol = v.Tables[0].Rows[i].vol; //跟dataset表的列名稱要一致
          slt.options.add(new Option(txt,vol));
        }
     }
     } 
     return;
         }
        
         //JS方法取值
        
        -->
</script>
</head>

<body>
    <form id="form1" runat="server">
    <div>
      <table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
        <tr>
          <td width="99" height="35">&nbsp;</td>
          <td >
              省份<ASP:DropDownList ID="ddl1" runat="server">
              </ASP:DropDownList>
              城市<ASP:DropDownList ID="ddl2" runat="server">
              </ASP:DropDownList>
              區域<ASP:DropDownList ID="ddl3" runat="server">
              </ASP:DropDownList></td>
        </tr>
        <tr>
          <td height="30">&nbsp;</td&gt;
        &nbsp; <td >&nbsp;</td>
        </tr>
        <tr>
          <td height="50">&nbsp;</td>
          <td >&nbsp;</td>
        </tr>
      </table>
   
    </div>
    </form>
</body>
</Html>

Web.config文件代碼:

<configuration>
 <aPPSettings>
  <add key="dbpath" value="~/App_Data/class.mdb"/>
    <add key="website" value="blog.etao8.cn"/>
 </aPPSettings>
 <connectionStrings/>
 <system.web>
    <!--for AJaxnet-->
    <httpHandlers>
      <add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AJaxPro.2"/>
    </httpHandlers>


  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved