Webform——页面局部刷新

有一些数据控件,每次更改它的值后,都会重新查询数据库,然后再重新显示出来。 这样每次都会刷新全部页面,如果是一些信息量很庞大的页面,就会出现卡顿的现象,为了避免这种情况,就用到了局部刷新。 所用到的控件为:AJAX扩展里面的ScriptManagerUpdatePanel。

   ScriptManager就是封装好的JS代码,可以直接拿来用。

   UpdatePanel,要局部刷新的部分放在这里面去。

在这张图片里,省市区三个下拉列表就被放在了UpdatePanel里面,从而实现了局部刷新这里的信息。

在用到UpdatePanel控件时,有一个属性非常重要!!

UpdateMode:指明是否是每次异步时都刷新,还是特定情况下刷新。

当UpdarePanel的值为Conditional时,要刷新的特定部位:  UpdatePanel1.Update();  加上这句代码,想刷新哪就能刷新哪了。

下面说一下中国省市三级联动,只局部刷新下拉列表的部分:

 protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {

        string Pro = DropDownList1.SelectedValue.ToString(); //加载市辖
        BindCity1(Pro); //根据选定的省份加载市辖

        string City = DropDownList2.SelectedValue.ToString();//加载市区
        BindCity2(City);//根据选定的市辖加载市区
        UpdatePanel1.Update();//有条件的刷新
    }
    protected void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)
    {
        string City = DropDownList2.SelectedValue.ToString();//加载市区
        BindCity2(City);//根据选定的市辖加载市区
        UpdatePanel1.Update();//有条件的刷新
    }

时间: 2024-12-21 00:16:48

Webform——页面局部刷新的相关文章

关于页面局部刷新例程

RS技术的一个具体例子 在前面的帖子中,我介绍了RS的基本工作原理,显然如果将RS技术运用在一个 网站的设计中将会有很多非凡的作用(尤其是它的那个最大的优点,可以在不刷新 页面的情况下调用服务端的代码).正是因为这个特点,你就可以象在编写一个 传统的C/S模式的程序一样,对数据库的数据进行处理了(我想大家一定很想知道具体应该如何来实现了,下面将给出一个具体的例子,调试这个破程序几乎快把我给累死,呵呵.) 从前面的描述可以看到,要使用RS技术就需要客户端和服务端满足下面两个条件: 1.客户端只需要

jquery实现页面局部刷新

后台管理中总是使用frameset进行分成部分进行管理,但是感觉很不好用,尤其是页面间调转还要判断window.parent,太令我费神了,于是学习使用XMLHttpRequest进行页面局部刷新.代码如下: Java代码   <html> <head> <script type="text/javascript"> window.onload = function(){ document.getElementById("email&quo

使用ajax与iframe嵌套实现页面局部刷新

使用ajax与iframe嵌套实现页面局部刷新.该javascript代码仅供参考,需按自己需要修改.?1. [代码]javascript代码 function cj_start(depname,groupid){    var urls = "<%=path%>/userGather.action";    var status = "";    var html_1 = "<iframe frameborder=\"0\&q

基于H5 pushState和Ajax完美实现页面局部刷新

众所周知使用Ajax可以局部刷新提高用户体验,然而url不跟随改变是其一大弊端. 如果修改浏览器地址栏的url,同时不刷新整个页面就完美了. 先来看看什么是pushState? 给history对象增加一个状态. window.history.pushState(stateData, 'title', 'newUrl'); // stateData用于事件参数 window.addEventListener('popstate', function(){ var state = window.h

web应用页面关闭子页面局部刷新父页面(layer生成子页面)

主页面:main.html   main.js子页面:page.html   page.js 当子页面关闭时需要局部刷新主页面时,可以现在main.html定义一个隐藏的<input type="hidden" id="refreshBtn" onclick="freshPage()"/><!-- 用于子窗口刷新当前页 -->在main.js中添加:    /**      * 刷新当前页面      */    func

JavaWeb-----------Ajax页面局部刷新(三)

元旦节即将过去,现在继续回来写我的总结复习笔记,今天我们通过ajax技术来获取数据库里的用户信息,并 实现局部刷新到网页上.那么首先就是封装一个ajax的库 function rpajax(url,successrsp) { var xhr=windows.XMLRequest ? new XMLHttoRequest(): new ActiveXObject('Microsoft.XMLHTTP');//首先还是从创建一个ajax对象开始,考虑到浏览器的兼容性 使用了以上两种方式 xhr.op

HTML页面局部刷新

/.事件响应刷新:有请求才会刷新 1.通过JS HTML DOM或jQuery获取HTML元素,通过DOM方法或jQuery方法监听页面事件,获取用户请求: 2.通过Ajax将用户请求提交至服务器,服务器处理后返回结果,再由Ajax接收数据: 3.通过DOM方法或jQuery方法将数据载入页面,事件响应刷新完成. $('#input_date').keypress(function(e){ if(e.keyCode=='13'){ $.ajax({ type: "POST", url:

AjaxAnyWhere 实现页面局部刷新

这个比较jquery.单纯ajax异步简单多了,不多说了直接上代码. 需要引入:ajaxanywhere-1.2.1.jar (最新)和 /ajaxAnyWhereDemo/WebRoot/js/aa.js  ,免费下载地址http://download.csdn.net/detail/xuke6677/8064977 目录结构如下: 1.ListBean.java 实体类    <strong><span style="font-family:System;font-size

实现单文件上传,页面局部刷新

实现单文件上传,页面不刷新 1.html <form name="fjUploadForm" enctype="multipart/form-data" method="post" action="fjFileInsert.action" onsubmit="return check()" target="fjUploadIFrame"> <input type=&qu