Repeater - 重复器
五个模板:
HeaderTemplate - 在最上面,显示一次
FooterTemplate - 最下面,显示一次
ItemTemplate - 在中间,显示n次
AlternatingItemTemplate - 在中间,显示n次
SeperatorTemplate - - 在中间,显示n次

思路:
1.在aspx中,设置Repeater的模板。<%# Eval("属性名/列名")%>
2.在aspx.cs中设置Repeater的数据源。

数据展示:
一、Eval()的格式化显示
Eval("属性名/列名")
Eval("属性名/列名","格式化字符串")
格式化字符串:
日期型:yyyy-年,MM-月,dd-日,hh- mm- ss-
数值型:0-必须有值,没有则填0被位。 #-有就显示,没有就不显示。 <%# Eval("Price","{0:#.00}")%>

二、数据处理与外观展示
法一:在aspx.cs中定义一个public返回string的方法。在Repeater模板中使用<%# 方法名()%>调用方法。
1.定义方法
public string ShowNationName()
{
string nationCode = Eval("Nation").ToString();
var query = _Context.Nation.Where(p=>p.Code == nationCode);
if (query.Count() > 0)
{
return query.First().Name;
}
else
{
return "";
}
}
2.调用
<td align="center"><%# ShowNationName() %></td>

法二:扩展属性
1.定义一个partial类,在这个partial类中,扩展要显示出来的属性
2.在Repeater模板中,<%# Eval("扩展属性")%>

一、Label控件(类)
属性:
(一)布局:
Width: 既可用像素,也可用百分比 类型:Unit
Height:既可用像素,也可用百分比 类型:Unit Unit.Pixel(像素数) Unit.Percentage(百分比数)

(二)背景与前景
BackColor:(Color)背景色
ForeColor:(Color)文字色
Font
Name:字体名称
Size:字体大小
Bold:字体加粗
Italic:字体倾斜
UnderLine:字体加下划线

(三)边框
BorderColor:边框颜色
BorderStyle:边框样式
BorderWidth:边框宽度

(四)其它:
Text - 标签文字
Visable=是否可见
Enabled-是否可用。
CssClass - 样式表中的class

二、Literal:标签:
Text - 标签上的文字
Visible - 是否可见

三、文本框TextBox
拥有Label的所有属性。
TextMode - 文本框的类型。
SingleLine-单行
Multiline-多行
Password-密码
ReadOnly - 是否只读
MaxLength-最大输入的字符串

四、Button,按钮
拥有Label的所有属性。
OnClientClick-- 按钮点击时要执的JS脚本。
五、LinkButton超链接按钮。
拥有Label的所有属性。
OnClientClick-- 按钮点击时要执的JS脚本。
六、ImageButton图片按钮。
拥有Label的所有属性。
OnClientClick-- 按钮点击时要执的JS脚本。
ImageUrl-图片路径。

复合控件

DropDownList:下拉列表
ListBox:多行文本框
RadioButtonList:单选按钮
CheckBoxList:复选按钮

三大功能:
一.把数据填进去。
(一)可视化
(二)代码
1.循环数据,逐项添加
a.循环查出来的集合。
b.每次循环造一个ListItem对象。
c.把ListItem对象加到Items集合中去。

2.数据绑定。
a.把查出来的集合赋给DataSource属性。
b.设置DataTextField,DataValueField
c.调用DataBind()
(三)属性和方法
Items
DataSource :绑定查询
DataTextField:绑定前端显示
DataValueField :绑定后端显示的value值
DataBind(): 绑定关闭或者是结束
AppendDataBoundItem

(四)技巧:
添加“请选择”项

二.把选中的取出来。
(一)前提:在Page_Load中加上if(!IsPostBack){}
(二)使用属性取
SelectedValue,SelectedItem,SelectecIndex
(三)遍历取
1.遍历列表中的每一项。Items集合。
2.在循环中判断每一项的Selected属性。li.Selected==true
3.取出选中项的值。li.Value,li.Text;

(四)属性及方法
SelectedValue
SelectedItem
SelectedIndex

(五)技巧:
防止每次执行都会出现:总是取出第一项,列表中的数据每次会增加

三.设定某项为选中项。
(一)使用属性设置
SelectedValue,SelectedIndex
(二)遍历设置
1.遍历列表中的每一项。Items集合。
2.判断每一项的值是不是要设为选中的项的值。li.Value == ""
3.给每一项的Selected赋值。li.Selected=true;

个性化的属性:
ListBox
SelectionMode=Single/Multiple
RadioButtonList/CheckBoxList
RepeatDirection -- 布局方向
RepeatLayout - 使用Table布局还是Flow布局
RepeatColumns - 一行显示几列

下拉列表联动:
1.编写三个方法,用来填充三个下拉列表。
2.调用三个方法
a.在Page_Load中调用。
注意: 1.要加if(!IsPostBack){}.2.调用的先后次序。
b.在列表的事件中调用。
注意: 1.调用哪几个方法。第一级调后两级的填充。第二级调用每三级填充。
2.要设置下拉列表的自动提交。AutoPostBack

修改界面要做三件事:
1.添加民族。
2.查出这个人的信息,送到相应的控件中。
3.编写更新代码,送回数据库,跳转页面

验证:
一、非空验证 RequiredFieldValidator
ErrorMessage - 验证出错后的提示信息
ControlToValidate - 要验证的控件的ID
Display - 显示方式。Static-不显示也占空间。Dynamic-不显示不占空间
InitialValue - 验证的初始值,被验证控件的值与此值相同的话,就认为是空

场景:
(一)填没填
(二)初始值变没变:通过设置InitialValue来实现

二、对比验证 CompareValidator
ErrorMessage - 验证出错后的提示信息
ControlToValidate - 要验证的控件的ID
Display - 显示方式。Static-不显示也占空间。Dynamic-不显示不占空间
ControlToCompare - 要对比的控件的ID
ValueToCompare - 要对比的值
Operator - 对比的运算符
Type - 输入的对比类型

场景:
1.两个控件的值进行对比。
2.控件输入的值和固定值进行对比

三、范围验证 RangeValidator
ErrorMessage - 验证出错后的提示信息
ControlToValidate - 要验证的控件的ID
Display - 显示方式。Static-不显示也占空间。Dynamic-不显示不占空间
MaximumValue - 范围的上限
MinimumValue - 范围的下限
Type - 类型

四、正则表达式验证 RegularExpressionValidator
ErrorMessage - 验证出错后的提示信息
ControlToValidate - 要验证的控件的ID
Display - 显示方式。Static-不显示也占空间。Dynamic-不显示不占空间
ValidationExpression - 验证表达式

五、验证汇总 ValidationSummary
ShowMessageBox - 是否以对话框的形式显示汇总的错误信息
ShowSummary - 是否在页面上显示汇总的错误信息

六、自定义验证
ErrorMessage - 验证出错后的提示信息
ControlToValidate - 要验证的控件的ID
Display - 显示方式。Static-不显示也占空间。Dynamic-不显示不占空间
ClientValidationFunction - 客户端验证函数的函数名。(不要加括号)

客户端验证函数的规范:
function 函数名(事件源,事件数据)
{
事件数据.Value -- 要被给证的值。该验证控件所要验证的那个输入框中的值。
事件数据.IsValid -- 告诉验证控件,验证是否通过。
}

function zhiShu(a, b) { //a-事件源,b-事件数据
//步骤
//1.把要被验证的值取出来。
var s = b.Value;
//2.进行验证
var isOK = false;
if (isNaN(s) == false) { //首先要看是不是个数字
var zc = 0;
var num = parseInt(s);
for (var i = 1; i <= num; i++) { //从1开始到数值本身,挨个整除,如果能被整除就记录一下zc++;
if (num % i == 0) {
zc++;
}
}
if (zc == 2) {
isOK = true;
}
else {
isOK = false;
}
}
else {
isOK = false;
}

//3.告诉验证控件是否验证通过。
b.IsValid = isOK;
}

两个应用技巧:
1.防止按钮激发验证控件。
默认情况下,3类按钮都会激发验证。
如果不想激发验证:给按钮的CauseValidation=false

2.验证分组的问题。
把输入控件(文本框,单选,多选)、验证控件(非空,对比,范围,正则,自定义,汇总)、按钮的ValidationGroup属性设成相同的值。它们就变成一组了。

文件上传
控件:
FileUpload - 控件,界面+方法+属性
Button/LinkButton/ImageButton

FileUpload控件:
1.SaveAs("要上传到服务器的绝对路径") 方法:上传文件。
般需要使用Server.MapPath()进行相对路径与绝对路径之间的转换。

2.FileName属性:要上传文件的绝文件名,不带路径。

3.FileBytes属性:上传文件的内容,即二进制数据。

场景:
一、单文件上传到服务器硬盘
最简单的上传:
string path = Server.MapPath( "uploads/aaa.txt"); //需要路径映射
FileUpload1.SaveAs(path);
问题:所有上传文件都叫aaa.txt。如何保持文件原有的名子?

优化一:使用FileUpload的FileName属性,获取出上传文件的客户端的名子。
string fileName = FileUpload1.FileName; //取得文件上传之间在客户端的名子。
string path = Server.MapPath("uploads/" + fileName);
FileUpload1.SaveAs(path);
问题:如果不同用户上传同一文件名的文件,如何避免覆盖?
优化二:不同用户,在同是时间传相同的文件名。
在文件名中使用用户名加以区分:
string fileName = DateTime.Now.ToString("yyyyMMddhhmmss") +Session["user"].ToString() + FileUpload1.FileName; //取得文件上传之间在客户端的名子。
string path = Server.MapPath("uploads/" + fileName);
FileUpload1.SaveAs(path);
问题:上传文件大于4M就会报错。 //默认上传文件的最大大小是4096K
优化三:扩容。
在Web.Config中配置上传请求的最大长度。
<system.web>
<httpRuntime maxRequestLength="40960"/> //默认是4096
</system.web>

作业:回去查找资源:C#如何上传大文件?

二、多文件上传到服务器硬盘
(一)简单实现:
思路:遍历页面Form中的每个控件,判断是否是FileUpload,如果是的话就把它强制转化为FileUpload类型,再按单文件上传逐个上传即可。
int i = 1; //上传文件的流水号
foreach (Control ctrl in this.form1.Controls) //遍历Form中的每个控件
{
if (ctrl is FileUpload) //看一下ctrl 对象是不是FileUpload类型
{
FileUpload file = (FileUpload)ctrl; //强制转化为FileUpload类型

//单文件上传的代码
string fileName = DateTime.Now.ToString("yyyyMMddhhmmssms") +i.ToString("0000") + file.FileName;
string path = Server.MapPath("uploads/" + fileName);
file.SaveAs(path);

i++;
}
}
问题:没有选择上传文件的也会在服务器端生成一个0k的文件。

(二)优化:把没有选择上传文件的给跳过去.
int i = 1;
foreach (Control ctrl in this.form1.Controls)
{
if (ctrl is FileUpload) //看一下ctrl 对象是不是FileUpload类型
{
FileUpload file = (FileUpload)ctrl;

if (file.HasFile) //判断每个控件中是否选择了上传的文件。
{
string fileName = DateTime.Now.ToString("yyyyMMddhhmmssms") + i.ToString("0000") + file.FileName;
string path = Server.MapPath("uploads/" + fileName);
file.SaveAs(path);

i++;
}
}
}
三、上传文件到数据库的Image字段
第一步:把文件的二进制数据取出来。FileUpload1.FileBytes (byte[])
第二步:送到数据库中去。 //ADO.NET或Linq2Sql

四、从数据库中的Image字段中取出来,显示在页面上。
1.选做一个显示图片的页面。例如:ShowPic.aspx.
这个页面根据传来的主键值,查询出图片数据,并Response.OutputStream显示在界面。
protected void Page_Load(object sender, EventArgs e)
{
if (Request["id"] != null)
{
string index = Request["id"].ToString();
//主要做是:
//1.读取某一条Photo表的数据记录。
var query = _Context.Photo.Where(p => p.Ids.ToString() == index);
Photo data = query.First();
byte[] pic = data.Content.ToArray();
//2.把二进制数据直接输出到界面上。
Response.OutputStream.Write(pic, 0, pic.Length); //向输出流里输出二进制数据
Response.End();
}
}
2.在另一个界面上,放一个Image控件,让该Image控件的ImageUrl指向上面的那个页面,并传指定的值过去。
HTML代码:
<asp:DropDownList ID="DropDownList1" runat="server">
</asp:DropDownList>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="显示" />
<br />
<asp:Image ID="Image1" runat="server" />
C#代码:
//填充下拉列表.略
//“显示”按钮上的代码
protected void Button1_Click(object sender, EventArgs e)
{
Image1.ImageUrl = "ShowPic.aspx?id=" + DropDownList1.SelectedValue;
}

如何做验证吗?
思路:
1.也是需要两个页面。一个页面是用来画验证码的;另外一个页面是用来展现文本框和验证验的。
2.使用画图技术中的知识点,画随机数图片。随机数需要事选保存在Session中,检查验证码是否正确就要使用session中的值进行对比。
3.点击验证码刷新如何实现?
function dochange(img) {
var temp = Math.random(); //JS生成随机数的代码。
img.setAttribute("src","yzm.aspx?id="+temp);
}

作业:找C#生成验证码的代码。

JQuery
一、语法的基本结构:
第一步:导入JQuery脚本包。
第二步:写JQuery的ready事件
$(document).ready(function(){
//在这里面写代码。
});

注意:
1.JQuery的触发时机。。。。。。。。。
2.非侵入性的编码方式。
3.链式结构的编码方式。
4.集合式操作。操作选择器选择出来的一组对象。
二、具体语法
(一)找到元素
选择器的种类:同样式表(CSS3.0)
第一类:基本选择器
1.最最基本的:标签,ID选择器,class选择器
2.组合选择器:空格(后代),逗号,标签名.class,> (子级选择器)
第二类: 过虑选择器
1.基本过滤(按照HTML标记的书写顺序来过滤)
:first - 第一个
:last - 最后一个
:eq(索引号) - 任意一个
:lt(索引号) - 小于某个索引号
:gt(索引号) - 大于某个索引号
:odd - 奇数个
:even - 偶数个
:not(选择器) - 排除

2.属性过滤
[属性名] - 选择拥有这个属性的元素
[属性名=值] - 找属性名是某个值的
[属性名!=值]
[属性名*=值] - 属性值中包含某个值
[属性名^=值] 属性值是以..开头
[属性名$=值] 属性值是...结尾

3.内容过滤
:has(选择器) - 开始与结束标记之间是否包含某类子元素,如果包含,就选择出来。
:contains(字符串) - 开始与结束标记之间是否包含某段文字,如何包含就选择出来。
(二)DOM操作
1.操作元素本身
操作属性,操作样式,操作内容
(1)操作属性:
a.获取属性值:var s = xxx.attr("属性名");
b.添加属性:attr("属性名","属性值")
c.移除属性:removeAttr("属性名")

(2)操作样式:
1).操作样式的class选择器
addClass("class选择器的名")
removeClass("class选择器的名")
toggleClass("class选择器的名") 切换样式
2).操作内联样式
css("样式名") 获得样式值
css("样式名","样式值") 设置和替换样式

(3)操作内容
1)表单元素:
取值:var s = xxxx.val()
赋值:xxx.val("值")
2)非表单元素:
取值:var s = xxx.html(); var s = xxx.text();
赋值:xxx.html("值");xxx.text("值")

<textarea>dsfasdfasdf</textarea>

2.操作相关元素
找相关元素:父、子、兄弟、前、后
操作相关元素:添加、复制、删除、替换
(三)事件与动画
(四)Ajax异步通信

DOM操作
操作相关元素:
里:children(),find("选择器")
外:parent(),parents("选择器")
下:next(),nextAll(选择器)
上:prev(),prevAll("选择器")

附加:集合操作
first(),last(),eq(n)

元素的添加、复制、替换、移除
添加:append(元素对象),prepend(元素对象),after(元素对象),before(元素对象)
复制:clone()
移除:
清空 empty() - 保留外围的元素,把子元素和内容全都清除掉。
移除 remove() - 把元素全都删除。
替换:

使用JQuery实现Ajax效果
一、结构:
两块代码:服务端代码,客户端代码(发请求之前的代码-主调代码,发请求之后的代码-回调代码)。
一般来说,我们要先写服务端,再写客户。客户代码,先写主调,再写回调。
问题:如何解决跨语言的数据交换?——XML 可扩展的标记语言。

附加:XML语言
是什么东西? - 文本格式数据载体。
语法注意:
1. 标签自定义一般是双标签。单标签一定要以/>结尾
2.大小写敏感。
3.只能有一个根元素。

(一)服务端代码:
//第一步:获取传来的数据
//第二步:处理数据生成结果
//第三步:Response写入XML字符串

(二)客户端代码
$.ajax({
url:"要调用服务端的路径",
data:{key:value,key:value},
type:"POST",
dataType:"XML",
beforeSend:function(data){
//提交服务器之前触发,通常用来在这个地方显示加载动画
},
success:function(data){ //data代表服务端返回来的数据xml
//解析XML:解析服务端返回来的XML数据

//显示HTML:在页面上把解析出来的XML内容显示出来。
},
error:function(data){
//服务器端执行出错。
},
complete:function(data){
//不管成功还是失败,总会走这里。
}

});

举例:
一、返回简单数据
1.不需要提供请求数据
2.需要提供请求数据
二、返回复杂数据
1.不需要提供请求数据
2.需要提供请求数据
(一)返回对象
(二)返回集合

作业:使用Ajax实现数据删除
一、.ashx文件
1.获取要删除的主键值
2.执行删除
3.输出XML <?xml version='1.0'?><root>true</root>

二、.aspx文件
(一)HTML
使用Repeater显示数据
删除按钮可以使用超链接来做(也可使用button/submit),class="del"
(二)JQuery
给每个删除按钮加上click事件。$(".del").click(function(){});
var tr = $(this).parents("tr"); //在主调中找到当前删聊按钮所在的行。
主调:在每个click事件中,调用ajax向.ashx发请求删除数据。
回调:解析返回xml文件,跟返回true/false.删除指向的table行。 注意:回调函数中不能用this
var isOK = $(data).find("root").text();
if(isOK == true)
{
$(tr).remove();
}

网站教学 提纲总结到ajax结束后面还有的更多相关文章

  1. ASP.NET动态网站制作(26)-- Ajax

    前言:这节课讲解关于Ajax的相关内容. 内容: 1.当点击页面中的一个按钮提交数据或请求数据的时候,整个页面的信息都会提交(不管信息是否是提交或者请求的数据,页面中所有的数据都提交),这样耗用的时间 ...

  2. Java-如何挖取某个网站中的ajax请求信息

    通常情况,通过网络爬虫挖取到的基本为网页静态内容,而动态ajax取数的内容是我个人暂时不知如何一次性把网站中的ajax获取 这里介绍的是某个网站中的某一个ajax多某个table刷新,期数据,并提供其 ...

  3. 掌握 Ajax,第 1 部分: Ajax 入门简介

    转:http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro1.html 掌握 Ajax,第 1 部分: Ajax 入门简介 理解 Ajax 及其工作 ...

  4. JavaScript学习总结【12】、JS AJAX应用

    1.AJAX 简介 AJAX(音译为:阿贾克斯) = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技 ...

  5. jQuery基础---Ajax基础教程

    jQuery基础---Ajax基础 内容提纲: 1.Ajax 概述 2.load()方法 3.$.get()和$.post() 4.$.getScript()和$.getJSON() 5.$.ajax ...

  6. c# http请求ajax页面

    我们在用Http请求的时候,某些页面是ajax加载的,所以请求过来的页面数据不完整.也就是说ajax局部加载数据的地方,我们请求不到,这时候该怎么办呢? WebDriver+phantomjs 这两个 ...

  7. jQuery基础---Ajax基础

    内容提纲: 1.Ajax 概述 2.load()方法 3.$.get()和$.post() 4.$.getScript()和$.getJSON() 5.$.ajax()方法 6.表单序列化 发文不易, ...

  8. 一文搞懂Ajax,附Ajax面试题

    目录 前言 正文 Ajax是什么东西? 实现核心/工作原理:XMLHttpRequest对象 XMLHttpRequest大致用法 创建XMLHttpRequest对象 发送请求 服务器响应 1. r ...

  9. jQuery源码分析系列(31) : Ajax deferred实现

    AJAX的底层实现都是浏览器提供的,所以任何基于api上面的框架或者库,都只是说对于功能的灵活与兼容维护性做出最优的扩展 ajax请求的流程: 1.通过 new XMLHttpRequest 或其它的 ...

随机推荐

  1. 常见的transformation 和 Action

    常见transformation map 将RDD中的每个元素传入自定义函数,获取一个新的元素,然后用新的元素组成新的RDD filter 对RDD中每个元素进行判断,如果返回true则保留,返回fa ...

  2. JVM --字节码的加载

    ClassLoader类加载器 常见的类加载器有BootStrapClassLoader<-ExtClassLoader<-AppClassLoader<-用户ClassLoader ...

  3. spoj 1812 lcsII (后缀自动机)

    spoj 1812 lcsII (后缀自动机) 题意:求多个串的lcs,最多10个串,每个串最长10w 解题思路:后缀自动机.先建好第一个串的sam,然后后面的串拿上去跑(这个过程同前一题).sam上 ...

  4. STL 源代码剖析 算法 stl_algo.h -- equal_range

    本文为senlie原创,转载请保留此地址:http://blog.csdn.net/zhengsenlie equal_range(应用于有序区间) ------------------------- ...

  5. PHP - 拒绝低版本PHP

    //判断PHP版本是否太低 if (PHP_VERSION < '4.1.0') { echo 'Version is to Low!'; exit; }

  6. Java进阶02 异常处理

    链接地址:http://www.cnblogs.com/vamei/archive/2013/04/09/3000894.html 作者:Vamei 出处:http://www.cnblogs.com ...

  7. ajax动态加载的图标

    http://www.ajaxload.info/ 这个网站可以动态生成ajax加载样式的小图片,git格式,挺不错推荐给大家

  8. 不包含SDK头文件, 补全API定义

    /// @file main.cpp /// @brief 不包含SDK头文件, 补全API定义 #ifdef __cplusplus extern "C" { #endif /* ...

  9. 浏览器打开URL的方式和加载过程

    不同浏览器的工作方式不完全一样,大体上,浏览器的核心是浏览器引擎,目前市场占有率最高的几种浏览器几乎都使用了不同的浏览器引擎:IE使用的是Trident.Firefox使用的是Gecko.Safari ...

  10. hdu 4081 Qin Shi Huang's National Road System (次小生成树的变形)

    题目:Qin Shi Huang's National Road System Qin Shi Huang's National Road System Time Limit: 2000/1000 M ...