Datalist增删改查——联系人管理

关于Datalist,其实和Repeater差不多,都是存放数据的控件,相比较下,Datalist和Repeater虽然都是用的模板,但是Datalist比之多了Edit模板,也就是编辑栏的模板,事件中也多了Edit,Update,Cancel以及Delete,可以说更加智能,更全面了,但是也有很多的不方便,不够灵活,复杂程度高。

下面就用联系人管理来详细说一下 Datalist的用法:

联系人管理要求:实现对联系人的增删改查。

    ① 当点击编辑时,编辑模板会覆盖原来的模板,而不会跳转页面。点击更新后,原来的模板重新覆盖掉编辑模板。点击取消,打回到原来的模板。总之就是不会跳转页面

②当点击"添加新人员"时,会在当前页面出现增加人员编辑栏原"添加新人员"按钮隐藏掉,当输入好人物信息后,点击添加。  增加人物编辑栏消失掉,原"添加新人员"按钮出现,并且"添加新人员"按钮要随着联系人列表高度的增长而相对下移。注意要在增加人物编辑栏加上非空验证,非空验证请注意分组!!!
    ③当点击删除时,弹出对话框"是否确认删除?"

   Datalist增删改查——联系人管理

Datalist增删改查——联系人管理

  Datalist增删改查——联系人管理

Datalist增删改查——联系人管理

Datalist增删改查——联系人管理

   下面是代码:  在这里数据库有两个表,其中一个表是联系人列表,一个表是分组列表。主外键关系。

分组隐藏的是分组编号,显示的是分组名称。  为了获取点击编辑后 下拉列表首先选中的值,这里加了一个隐藏域用来存储分组的ID

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
DataList1.DataSource = new ContactsBF().Select();
DataList1.DataBind();
DropDownList2.DataSource = new ContactsBF().SelectGroup(); //下拉列表要显示的值
DropDownList2.DataTextField = "Name";
DropDownList2.DataValueField = "id";
DropDownList2.DataBind();
}
} protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e) //在数据被绑定时激发 (实现多表联合查询,通过编号显示名字)
{
if (e.Item.ItemType == ListItemType.EditItem) //判断一下是不是编辑项的模板
{
if (e.Item.ItemIndex > -) //从身体开始,不从表头开始,因为表头的索引为-1
{
//找到隐藏域的值
HtmlInputHidden lt = (HtmlInputHidden)e.Item.FindControl("Hidden1");
//找到下拉列表
DropDownList dp = (DropDownList)e.Item.FindControl("DropDownList1");
//为下拉列表赋值
List<Groups> list = new ContactsBF().SelectGroup();
dp.DataSource = list;
dp.DataTextField = "Name";
dp.DataValueField = "id";
dp.SelectedValue = lt.Value;
dp.DataBind();
}
}
else
{
if (e.Item.ItemIndex > -)
{
Literal lt = (Literal)e.Item.FindControl("Literal1"); //找到这个控件
//写方法查询名字
string GroupName = new ContactsBF().ToName(Convert.ToInt32(lt.Text));// 显示名字
lt.Text = GroupName; //重新赋值
LinkButton a = (LinkButton)e.Item.FindControl("LinkButton2");
a.Attributes.Add("onclick", "return confirm(\"是否确认删除?\")"
); }
}
}
protected void DataList1_EditCommand(object source, DataListCommandEventArgs e) //当点击编辑按钮的时候,Item模版替换为Edit模板
{
DataList1.EditItemIndex= e.Item.ItemIndex; //获取每列的索引,替换为Edit模板
//重新绑定
DataList1.DataSource = new ContactsBF().Select();
DataList1.DataBind();

}
protected void DataList1_UpdateCommand(object source, DataListCommandEventArgs e) //点击更新按钮时触发
{
if (e.Item.ItemIndex > -)
{ //找到隐藏域的值,隐藏的值是主键,要通过主键修改
HtmlInputHidden lt = (HtmlInputHidden)e.Item.FindControl("Hidden2");
//首先先获取到文本框以及下拉列表的值
TextBox txt1 = (TextBox)e.Item.FindControl("TextBox1");
TextBox txt2 = (TextBox)e.Item.FindControl("TextBox2");
DropDownList dp = (DropDownList)e.Item.FindControl("DropDownList1");
new ContactsBF().Update(Convert.ToInt32(lt.Value), txt1.Text, txt2.Text, (dp.SelectedIndex+));
//修改完毕,要打回到原来的页面
Response.Redirect("Default.aspx");
}
}
protected void DataList1_CancelCommand(object source, DataListCommandEventArgs e)//取消
{
//直接打回到原来的界面
Response.Redirect("Default.aspx");
}
protected void DataList1_DeleteCommand(object source, DataListCommandEventArgs e) //删除
{
if(e.Item.ItemIndex>-)
{
HtmlInputHidden lt = (HtmlInputHidden)e.Item.FindControl("Hidden3");
new ContactsBF().Delete(Convert.ToInt32(lt.Value));
Response.Redirect("Default.aspx");
}
} protected void Button2_Click(object sender, EventArgs e) //当点击添加的时候
{
string name = TextBox3.Text;
string tel = TextBox4.Text;
int groupid = DropDownList2.SelectedIndex;
new ContactsBF().Insert(name,tel,groupid+);
Response.Redirect("Default.aspx");
}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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>
</head>
<style>
.aa
{
position:relative;
top:10px;
left:245px;
width:420px;
height:100px; }
.bb
{
position:relative;
top:10px;
left:245px;
width:420px;
height:0px; }
</style>
<body>
<form id="form1" runat="server">
<div >
<center><h1>联系人管理</h1>
<%--一旦生成DataList 就是生成了一个N行1列的表格--%>
<asp:DataList ID="DataList1" runat="server" OnItemDataBound="DataList1_ItemDataBound" OnEditCommand="DataList1_EditCommand" OnUpdateCommand="DataList1_UpdateCommand" OnCancelCommand="DataList1_CancelCommand" OnDeleteCommand="DataList1_DeleteCommand">
<HeaderTemplate>
<table width="860px" border="" cellpadding="" cellspacing="">
<tr>
<td width="200px">姓名</td>
<td width="200px">电话</td>
<td width="300px">分组</td>
<td>操作</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table width="860px" >
<tr>
<td width="200px"><input id="Hidden3" type="hidden" runat="server" value='<%#Eval("id") %>'/><%#Eval("Name") %></td>
<td width="200px"><%#Eval("Tel") %></td>
<td width="300px"><asp:Literal ID="Literal1" runat="server" Text='<%#Eval("GroupId") %>'></asp:Literal></td>
<td><asp:LinkButton ID="LinkButton1" runat="server" CommandName="Edit">编辑</asp:LinkButton>&nbsp;&nbsp;<asp:LinkButton ID="LinkButton2" runat="server" CommandName="Delete" >删除</asp:LinkButton></td>
</tr>
</table>
</ItemTemplate>
<FooterTemplate></FooterTemplate> <%-- 编辑栏!!!--%>
<EditItemTemplate>
<table width="860px" >
<tr>
<td width="200px"><br/><input id="Hidden2" type="hidden" runat="server" value='<%#Eval("id") %>'/><asp:TextBox ID="TextBox1" runat="server" Text='<%#Eval("Name") %>'></asp:TextBox><asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="名字不能为空" ControlToValidate="TextBox1"></asp:RequiredFieldValidator></td>
<td width="200px"><asp:TextBox ID="TextBox2" runat="server" Text='<%#Eval("Tel") %>'></asp:TextBox></td>
<td width="300px"><input id="Hidden1" type="hidden" runat="server" value='<%#Eval("GroupId") %>'/><asp:DropDownList ID="DropDownList1" runat="server" ></asp:DropDownList></td>
<td><asp:LinkButton ID="LinkButton1" runat="server" CommandName="Update">更新</asp:LinkButton>&nbsp;&nbsp;<asp:LinkButton ID="LinkButton2" runat="server" CommandName="Cancel">取消</asp:LinkButton></td>
</tr>
</table>
</EditItemTemplate> <%--编辑项模板--%>
</asp:DataList></center>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<div class="bb" id="div2">
<input id="Button1" type="button" value="添加新人员" onclick="xianshi()" />
</div>
</div>
<div class="aa" id="div1" style="visibility:hidden" >
姓名:<asp:TextBox ID="TextBox3" runat="server" ValidationGroup="aa"></asp:TextBox><asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="姓名不能为空" ControlToValidate="TextBox3" ValidationGroup="aa"></asp:RequiredFieldValidator><br/>
电话:<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox><br />
分组:<asp:DropDownList ID="DropDownList2" runat="server" ></asp:DropDownList><br/>
<asp:Button ID="Button2" runat="server" Text="添加" OnClick="Button2_Click" ValidationGroup="aa" />
</div>
</form>
</body>
</html>
<script src="Script/jquery-1.11.2.min.js"></script>
<script>
function xianshi()
{
var a = document.getElementById("div1"); //获取到这个对象
//下面给这个对象移除属性
a.removeAttribute("style");
var b = document.getElementById("div2");
//下面给这个对象添加属性
b.setAttribute("style", "visibility:hidden");
}
</script>

    

上一篇:MYSQL集群的搭建


下一篇:lvs持久性工作原理和配置