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();
}