网站教学 提纲总结到ajax结束后面还有

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

原文地址:https://www.cnblogs.com/tianxuan/p/4756224.html