左边是部门菜单(treeview结构)右边是部门员工列表想页面无刷新实现点击部门节点刷新员工列表,就目前俺掌握的知识知道实现这东西得要ajax技术?有没有具体或类似的列子什么的?谢谢啦

解决方案 »

  1.   

    ajax无刷新
      

  2.   

    最简单的方法,在页面上拖个updatepanel,然后把你要实现无刷新的控件拖到里面。
      

  3.   

    你看下下面的例子,好好学学:
    HTML代码:
    <!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>
        <title>无标题页</title>
        <script type="text/javascript" language="javascript">
       var XmlHttp;
       function createXMLHttpRequest()
       {
       
      try{
      XmlHttp=new ActiveXObject("Msxml2.XMLHTTP");}
      catch(e)
      {
      
      try{
      XmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
      
      catch(oc)
      {
      XmlHttp=null;
      }
      }
      if(!XmlHttp && typeof XMLHttpRequest !="undefined")
      {
      
      XmlHttp=new XMLHttpRequest();
      }
      return XmlHttp; 
       
      } 
        
        
        
        
        
        function handle()
        {
      
        if(XmlHttp.readyState==4){           if(XmlHttp.status==200)
        { 
        
        var citystring=XmlHttp.responseText;
        var cityarray=citystring.split(",");
        while(document.getElementById("city").options.length>0)
        {
       document.getElementById("city").options.remove(0); 
        }
        for(var j=0;j<cityarray.length;j++)
        {
        var ooption=document.createElement("OPTION");
        ooption.text=cityarray[j];
        ooption.value=cityarray[j];
        document.getElementById("city").add(ooption);
        
        }
        }
        
        
        else{
        
        
        alert("页面请求异常");
        
        }
        }
        }
        function request(str)
        {
        
        var url="~/getbook.aspx?bk="+escape(str);
    alert(url);
        createXMLHttpRequest();
        XmlHttp.onreadystatechange=handle;
        XmlHttp.open("GET",url,true);
        XmlHttp.send(null);
        
        
        
        }
        
        
        
        </script>
    </head>
    <body>
    <select id="pro" onchange="request(this.value)"><option value="0">选择类型</option>
    <option value="hn">河南省</option>
    <option value="gd">广东省</option></select>
    <br />
    <select id="city"></select>
    </body>
    </html>
    getbook.aspx.CS代码:
    using System;
    using System.Data;
    using System.Configuration;
    using System.Collections;
    using System.Web;
    using System.Web.Security;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;public partial class getbook : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string bk, result = "";
            bk = Request.QueryString["bk"].ToString().Trim();
            if (bk != "")
            {
                switch (bk)
                {
                    case "hn":
                        result = "郑州,洛阳,开封";
                        break;                case "gd":
                        result = "广州,深圳,珠海";
                        break;            }            
                Response.Write(result);        }    }
    }getbook.aspx代码:
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="getbook.aspx.cs" Inherits="getbook" %>
      

  4.   

    肯定是要 ajax 的效果了 可以vs自带的 也可以用别的
      

  5.   


    JQuery zTree 行政区划异步加载树形目录
    Default.aspx
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="zTree._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>JQuery zTree行政区划</title>
        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script src="js/jquery.ztree-2.6.min.js" type="text/javascript"></script>    <script type="text/javascript">
            var zTree;
            var setting = {
                async: true,
                asyncUrl: "getSubtree.ashx",
                asyncParam: ["id"],
                isSimpleData: true,
                treeNodeKey: "id",
                treeNodeParentKey: "pId",
                showLine: true
            };
            $(document).ready(function(){
                setting.expandSpeed = "fast";
                zTree = $("#tree").zTree(setting, null);
            });
        </script>
    </head>
    <body>
        <ul id="tree" class="tree" style="width:300px; overflow:auto;"></ul>
    </body>
    </html>getSubTree.ashx
    using System;
    using System.Collections;
    using System.Data;
    using System.Linq;
    using System.Web;
    using System.Web.Services;
    using System.Web.Services.Protocols;
    using System.Xml.Linq;
    using System.Threading;namespace zTree
    {
        /// 
        /// $codebehindclassname$ 的摘要说明
        /// 
        [WebService(Namespace = "http://tempuri.org/")]
        [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
        public class getSubtree : IHttpHandler
        {        public void ProcessRequest(HttpContext context)
            {
                context.Response.ContentType = "text/plain";
                string id = context.Request.Form["id"];
                dbOperator dbopt = new dbOperator();
                if (string.IsNullOrEmpty(id)) id = "0";
                string s = dbopt.getIdData(dbopt.getDataTableById(id));
                context.Response.Write(s);
            }        public bool IsReusable
            {
                get
                {
                    return false;
                }
            }
        }
    }dbOperator.cs
    using System;
    using System.Data;
    using System.Configuration;
    using System.Linq;
    using System.Web;
    using System.Web.Security;
    using System.Web.UI;
    using System.Web.UI.HtmlControls;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using System.Xml.Linq;
    using System.Data.OleDb;
    using System.Text;namespace zTree
    {
        public class dbOperator
        {
            static string cs = ConfigurationManager.ConnectionStrings["ualscxaxConnectionString"].ConnectionString;        public DataTable getDataTableById(string id)
            {
                OleDbDataAdapter da = new OleDbDataAdapter("SELECT t.*, (SELECT COUNT(1) FROM area WHERE pid = t.id) AS sub FROM area AS t WHERE pid = @id", cs);
                da.SelectCommand.Parameters.AddWithValue("@id", id);
                DataTable dt = new DataTable();
                da.Fill(dt);
                da.Dispose();
                return dt;
            }        public string getIdData(DataTable dt)
            {
                StringBuilder sb = new StringBuilder();
                if (dt.Rows.Count > 0)
                {
                    for (int i = 0; i < dt.Rows.Count; ++i)
                    {
                        int id = (int)dt.Rows[i]["id"];
                        int pid = (int)dt.Rows[i]["pid"];
                        string name = dt.Rows[i]["item"].ToString();
                        string sub = ((int)dt.Rows[i]["sub"] > 0).ToString().ToLower();
                        string s = string.Format("{{id:{0},pId:{1},name:'{2}',isParent:{3}}},", id, pid, name,sub);
                        sb.Append(s);
                    }
                    --sb.Length;
                }
                return "[" + sb.ToString() + "]";
            }
        }
    }
      

  6.   

    iframe可以实现<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Wage_Main.aspx.cs" Inherits="Wage_Main" %><!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>
    <frameset rows="100,*" cols="*" framespacing="0" frameborder=10 border="0" bordercolor="#FF0000">
        <frame src="Wage_Main_Top.aspx" name="left" scrolling="no" >
        <frame name="main" scrolling="No" src="Wage_Welcome.aspx" >
        <noframes>
            <body>
                <p>
                    看不到?</p>
            </body>
        </noframes>
    </frameset>
    </html>
    iframe
    菜单
      

  7.   

    用VS的updatepanel控件就好了  就像3楼说的那样
      

  8.   

      托用AJAX控件
        两个;ScriptManager  ;UpdatePanel
      ScriptManager拖到页面最上方就行了
         <UpdatePanel> 
       里面是你的部门员工
    </UpdatePanel>
       就这样就行了。
      

  9.   

    AJAX控件,最简单,也很实用,不会AJAX的话,这也是个不错的选择