ajax 基础2
连接数据库实现分页功能
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
#table {
width: %;
background-color: blue;
text-align: center;
font-weight: bold;
}
</style>
<script src="jquery-1.7.2.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table id="table">
<thead style="color: white;">
<tr>
<td>用户名</td>
<td>密码</td>
<td>昵称</td>
<td>性别</td>
<td>生日</td>
<td>年龄</td>
<td>民族</td>
<td>班级</td>
</tr>
</thead>
<tbody style="background-color: white" id="tbody">
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<tr>
<td><%#Eval("username") %></td>
<td><%#Eval("password") %></td>
<td><%#Eval("nick") %></td>
<td><%#Eval("sexstar") %></td>
<td><%#Eval("birthday") %></td>
<td><%#Eval("age") %></td>
<td><%#Eval("nationname") %></td>
<td><%#Eval("classname") %></td>
</tr>
</ItemTemplate>
</asp:Repeater>
</tbody>
</table>
<input type="button" value="上一页" id="btn1" disabled="disabled" />
<input type="button" value="下一页" id="btn2" />
当前第<span id="span"></span>页
</div>
</form>
</body>
</html>
<script type="text/javascript">
var pagecount = ;
var pagenumber = ;
document.getElementById("btn1").onclick = function () {
document.getElementById("btn2").disabled = "";
pagenumber--;
Change(pagecount, pagenumber);
if (pagenumber <= ) {
document.getElementById("btn1").disabled = "disabled";
}
else {
document.getElementById("btn1").disabled = "";
} };
document.getElementById("btn2").onclick = function () { $.ajax({
url: "ajax/Hand2.ashx",
data: {},
type: "post",
dataType: "json",
success: function (data1) { document.getElementById("btn1").disabled = "";
pagenumber++;
Change(pagecount, pagenumber);
if (pagenumber >= parseInt(data1.aaa)) {
document.getElementById("btn2").disabled = "disabled";
}
else {
document.getElementById("btn2").disabled = "";
}
}
}) };
function Change(count, number) {
$.ajax({
url: "ajax/Hand.ashx",
data: { "count": count, "number": number },
type: "post",
dataType: "json",
success: function (data) {
document.getElementById("tbody").innerHTML = "";
for (i in data) {
var end = "<tr>";
end += "<td>" + data[i].username + "</td>";
end += "<td>" + data[i].password + "</td>";
end += "<td>" + data[i].nickname + "</td>";
end += "<td>" + data[i].sex + "</td>";
end += "<td>" + data[i].birthday + "</td>";
end += "<td>" + data[i].age + "</td>";
end += "<td>" + data[i].nation + "</td>";
end += "<td>" + data[i].class + "</td>";
end += "</tr>"; document.getElementById("tbody").innerHTML += end;
}
document.getElementById("span").innerHTML = number;
}
});
} </script>
public partial class Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Repeater1.DataSource = new UsersData().select(,);
Repeater1.DataBind();
}
}
}
用Repeater绑定初始数据
<%@ WebHandler Language="C#" Class="Hand" %> using System;
using System.Web;
using System.Collections.Generic; public class Hand : IHttpHandler { public void ProcessRequest (HttpContext context) {
int c = Convert.ToInt32(context.Request["count"]);
int n = Convert.ToInt32(context.Request["number"]); string json = "["; List<WindowsFormsApplication1.App_Code.Users> ulist = new WindowsFormsApplication1.App_Code.UsersData().select(c,n);
int count = ;
foreach (WindowsFormsApplication1.App_Code.Users u in ulist)
{
if (count > )
{
json += ",";
}
json += "{\"username\":\"" + u.Username+ "\",\"password\":\"" + u.Password+ "\",\"nickname\":\"" + u.Nick + "\",\"sex\":\"" + (u.Sex ? "男" : "女") + "\",\"birthday\":\"" + u.Birthday.ToString("yyyy年MM月dd日") + "\",\"nation\":\"" + u.NationName + "\",\"class\":\"" + u.ClassName + "\",\"age\":\"" + u.age + "\"}";
count++;
} json += "]";
context.Response.Write(json);
context.Response.End(); } public bool IsReusable {
get {
return false;
}
} }
Hand.ashx
<%@ WebHandler Language="C#" Class="Hand2" %> using System;
using System.Web; public class Hand2 : IHttpHandler { public void ProcessRequest (HttpContext context) {
string json1;
System.Collections.Generic.List<WindowsFormsApplication1.App_Code.Users> Ulist = new WindowsFormsApplication1.App_Code.UsersData().Select();
int a = Ulist.Count;
string maxpage = (Math.Ceiling(a / 3.0)).ToString();
json1 = "{\"aaa\":\"" + maxpage + "\"}";
context.Response.Write(json1);
context.Response.End();
} public bool IsReusable {
get {
return false;
}
} }
Hand2.ashx
ajax 基础2的更多相关文章
- 史上最全的Ajax基础详解
同步请求和异步请求 先解释一下同步和异步的概念: 同步是指:发送方发出数据后,等接收方发回响应以后才发下一个数据包的通讯方式. 异步是指:发送方发出数据后,不等接收方发回响应,接着发送下个数据包的通讯 ...
- 【Java EE 学习 31】【JavaScript基础增强】【Ajax基础】【Json基础】
一.JavaScript基础增强 1.弹窗 (1)使用window对象的showModelDialog方法和showModelessDialog方法分别可以弹出模式窗口和非模式窗口,但是只能在IE中使 ...
- Ajax基础知识《一》
对于网站开发人员,一定不会陌生的Ajax技术,本篇就让我们认识一下它,或许在日后的开发过程中我们就可以使用到.Ajax在那方面使用的比较多呢?答案:表单注册,传统的表单注册,有时需要填写大量的信息,当 ...
- Ajax基础2
什么是服务器 网页浏览过程的分析 如何配置自己的服务器程序(AMP) 什么是Ajax 无刷新数据读取 异步,同步 Ajax基础(2) 使用Ajax 基础请求显示txt的文件 字符集编码 缓存,阻止缓存 ...
- ajax基础语法、ajax做登录、ajax做用户名验证是否可用、ajax做关键字查询动态显示、ajax做用表格显示数据并增加操作列
AJAX: AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ...
- Ajax基础--JavaScript实现
ajax原理 1.ajax 即“Asynchronous JavaScript and XML”(异步 JavaScript 和 XML),也就是无刷新数据读取. 通俗地讲就是:AJAX 通过在后台与 ...
- jQuery基础---Ajax基础教程(二)
jQuery基础---Ajax进阶 内容提纲: 1.加载请求 2.错误处理 3.请求全局事件 4.JSON 和 JSONP 5.jqXHR 对象 发文不易,转载请注明出处! 在 Ajax 基础一篇中, ...
- jQuery基础---Ajax基础教程
jQuery基础---Ajax基础 内容提纲: 1.Ajax 概述 2.load()方法 3.$.get()和$.post() 4.$.getScript()和$.getJSON() 5.$.ajax ...
- Ajax基础知识(二)
接上一篇 Ajax基础知识(一) 在上一篇博客里,抛弃了VS中新建aspx页面,拖个button写上C#代码的方式.使用ajax的方式,异步向服务器请求数据.我们让服务器只简单的返回一个" ...
- 原生AJAX基础讲解及兼容处理
原文:原生AJAX基础讲解及兼容处理 AJAX = Asynchronous JavaScript and XML (异步的JavaScript和XML). AJAX不是新技术 ,但却是热门的技术.它 ...
随机推荐
- java 参数传值
基本数据类型参数的传值,参数为基本数据类型 class Computer{ int add(int x,int y){ return x+y; } } public class Example4_6 ...
- CSS3简介
选择器 盒模型 背景和边框 文字特效 2d/3d转换 动画 多列布局 用户界面
- AngularJS vs. jQuery,看看谁更胜一筹
http://www.apjs.net/ http://docs.angularjs.cn/api/ng/function 本文由PHP100中文网编译,转载请看文末的转载要求,谢谢合作!除非特别声明 ...
- java工程开发之图形化界面之(第三课)
上面我们讲述了通过JOptionPane进行文本I/O操作,一个是通过JOptionPane来获取的 参考链接:http://blog.sina.com.cn/s/blog_993d254201013 ...
- [转]PHP经验——PHPDoc PHP注释的标准文档
文档翻译自:http://en.wikipedia.org/wiki/Phpdoc 标记 用途 描述 @abstract 抽象类的变量和方法 @access public, private or ...
- 用DIV+CSS做网页里要设置body和*规定内容
body{}表示是对body标签的设置,就是<html><head></head><body></body></html> 里面 ...
- iOS数据持久化之数据库:SQLite和FMDB
SQLite: SQLite是一款轻量级型的数据库,资源占用少.性能良好和零管理成本,具有零配置(无需安装和管理配置).独立(没有额外依赖).储存在单一磁盘文件中的一个完整的数据库.源码完全的开源.比 ...
- Attrib命令,可以让文件夹彻底的隐藏起来
Attrib命令,可以让文件夹彻底的隐藏起来,就算是在文件夹选项中设置了显示隐藏文件夹,也无法显示出来的.只能通过路径访问的方式打开文件夹.如上图,就是attrib命令的隐藏文件夹和显示文件夹的两条命 ...
- Oracle获取系统时间及格式化
Oracle 获取当前日期及日期格式 获取系统日期: SYSDATE() 格式化日期: TO_CHAR(SYSDATE(),'YY/MM/DD HH24:MI:SS) ...
- PAT (Advanced Level) 1060. Are They Equal (25)
模拟题.坑点较多. #include<iostream> #include<cstring> #include<cmath> #include<algorit ...