62,046
社区成员
发帖
与我相关
我的任务
分享GridView 弹出div层，实现插入数据和编辑数据
点击GridView中的插入按钮，弹出一个div层，插入数据，提交将数据插入数据库。
点击GridView中的编辑按钮，弹出一个div层，带有原始数据，提交将数据更新至数据库。
最好有测试通过的代码。
点击GridView中的编辑按钮，弹出一个div层，带有原始数据，提交将数据更新至数据库。
最好有测试通过的代码。
...全文
请发表友善的回复…
发表回复
H_Gragon 2012-07-20
- 打赏
- 举报
楼主也可以弹出窗口啊（窗口中可以包含你添加数据的页面或修改数据的页面），也能达到同样的效果！
孟子E章 2012-07-20
- 打赏
- 举报
你自己描述的不是很清楚了吗？
你哪里不会呢
点击是onclick
弹出层方法很多，一个方法是style.display显示，里面的内容ajax获取或者提交就可以了，
你哪里不会呢
点击是onclick
弹出层方法很多，一个方法是style.display显示，里面的内容ajax获取或者提交就可以了，
shift0930 2012-07-20
- 打赏
- 举报
在protected void btnSub_Click(object sender, EventArgs e)
{
//写存入数据库的代码
}事件中保存完数据，再执行Bangding（）函数，Bangding（）中需要去数据库取对应数据，实现GridView的绑定。
{
//写存入数据库的代码
}事件中保存完数据，再执行Bangding（）函数，Bangding（）中需要去数据库取对应数据，实现GridView的绑定。
shift0930 2012-07-20
- 打赏
- 举报
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
namespace aspTest
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Bangding();
}
private void Bangding()
{
this.GridView1.DataSource = CreatTable();
this.GridView1.DataBind();
}
private DataTable CreatTable()
{
DataTable dt = new DataTable();
dt.Columns.Add("test1");
dt.Columns.Add("test2");
dt.Columns.Add("test3");
DataRow dr = dt.NewRow();
dr[0] = "111111";
dr[1] = "22222";
dr[2] = "33333";
dt.Rows.Add(dr);
DataRow dr1 = dt.NewRow();
dr1[0] = "44444";
dr1[1] = "55555";
dr1[2] = "66666";
dt.Rows.Add(dr1);
return dt;
}
protected void Add_Click(object sender, EventArgs e)
{
ClientScript.RegisterStartupScript(ClientScript.GetType(), "myscript", "<script>show('divModify');</script>");
}
protected void Modify_Click(object sender, EventArgs e)
{
LinkButton link = sender as LinkButton;
ClientScript.RegisterStartupScript(ClientScript.GetType(), "myscript", "<script>show('divModify');</script>");
//通过link.CommandArgument到数据库找到对应行的数据，付给div中的Textbox
}
protected void btnSub_Click(object sender, EventArgs e)
{
//写存入数据库的代码
}
protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
//
}
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="aspTest.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<script type="text/jscript">
function show(name) {
document.getElementById(name).style.display = "";
return false;
}
function hide(name) {
document.getElementById(name).style.display = "none";
}
</script>
<body>
<form id="form1" runat="server">
<div>
<table width="100%">
<tr>
<td>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
BorderColor="#CCCCCC" BorderWidth="1px" CellPadding="0" CellSpacing="1"
EmptyDataRowStyle-Font-Size="Small"
OnPageIndexChanging="GridView1_PageIndexChanging"
PageSize="5" Width="99%">
<Columns>
<asp:BoundField DataField="test1" HeaderText="推荐人">
<HeaderStyle Font-Bold="False" ForeColor="White"
HorizontalAlign="left" Width="10%" />
<ItemStyle HorizontalAlign="left" />
</asp:BoundField>
<asp:BoundField DataField="test1" DataFormatString="{0:yy-MM-dd HH:mm}"
HeaderText="推荐日期">
<HeaderStyle Font-Bold="False" ForeColor="White"
HorizontalAlign="left" Width="10%" />
<ItemStyle HorizontalAlign="left" />
</asp:BoundField>
<asp:BoundField DataField="test1" HeaderText="推荐理由">
<HeaderStyle Font-Bold="False" ForeColor="White"
HorizontalAlign="left" Width="20%" />
<ItemStyle HorizontalAlign="left" />
</asp:BoundField>
<asp:TemplateField HeaderText="操作" ShowHeader="False">
<ItemTemplate>
<asp:LinkButton ID="Add" runat="server" CausesValidation="False" OnClick="Add_Click" Text="新增"></asp:LinkButton>
<asp:LinkButton ID="Modify" runat="server" CausesValidation="False"
CommandArgument='<%# Eval("test1") %>' OnClick="Modify_Click" Text="修改"></asp:LinkButton>
</ItemTemplate>
<HeaderStyle CssClass="IOP_DG_Header_01" Font-Bold="False" ForeColor="White"
HorizontalAlign="left" Width="20%" />
<ItemStyle CssClass="IOP_DG_Item_01" HorizontalAlign="left" />
</asp:TemplateField>
</Columns>
</asp:GridView>
</td>
</tr>
</table>
</div>
<div id="divModify" class="IOP_DataGrid_03" style="z-index: 100; display:none; left:15%; top: 9%; width: 550px; height:300px; position: absolute; background-color:#DEE4F7; overFlow:auto; ">
<table height="60%" width="100%">
<tr>
<td align=center valign="middle">
<table width="100%" height="50%">
<tr>
<td width="35%" align="right" height="30px" valign="middle">
<asp:Label ID="Label6" runat="server" Text="Test1："></asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txt1" runat="server" width="200px" Height="19px"></asp:TextBox>
</td>
</tr>
<tr>
<td width="35%" align="right" height="30px" valign="middle">
<asp:Label ID="Label7" runat="server" Text="Test2："></asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txt2" runat="server" width="200px" Height="19px" ></asp:TextBox>
</td>
</tr>
<tr>
<td width="35%" align="right" height="30px" valign="middle">
<asp:Label ID="Label9" runat="server" Text="Test3："></asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txt3" runat="server" width="200px" Height="19px"></asp:TextBox>
</td>
</tr>
<tr>
<td align="center" colspan=2 height="30px" valign="middle">
<asp:Button ID="btnSub" runat="server" Text="确定" CausesValidation="False" CssClass="IOP_Input01" OnClick="btnSub_Click"/>
<asp:Button ID="btnCan" runat="server" Text="取消" CausesValidation="False" CssClass="IOP_Input01" OnClientClick='hide("divModify")'/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
有些具体操作数据库的方法还得你直接去写。
shift0930 2012-07-20
- 打赏
- 举报
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
namespace aspTest
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Bangding();
}
private void Bangding()
{
this.GridView1.DataSource = CreatTable();
this.GridView1.DataBind();
}
private DataTable CreatTable()
{
DataTable dt = new DataTable();
dt.Columns.Add("test1");
dt.Columns.Add("test2");
dt.Columns.Add("test3");
DataRow dr = dt.NewRow();
dr[0] = "111111";
dr[1] = "22222";
dr[2] = "33333";
dt.Rows.Add(dr);
DataRow dr1 = dt.NewRow();
dr1[0] = "44444";
dr1[1] = "55555";
dr1[2] = "66666";
dt.Rows.Add(dr1);
return dt;
}
protected void Add_Click(object sender, EventArgs e)
{
ClientScript.RegisterStartupScript(ClientScript.GetType(), "myscript", "<script>show('divModify');</script>");
}
protected void Modify_Click(object sender, EventArgs e)
{
LinkButton link = sender as LinkButton;
ClientScript.RegisterStartupScript(ClientScript.GetType(), "myscript", "<script>show('divModify');</script>");
//通过link.CommandArgument到数据库找到对应行的数据，付给div中的Textbox
}
protected void btnSub_Click(object sender, EventArgs e)
{
//写存入数据库的代码
}
protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
//
}
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="aspTest.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<script type="text/jscript">
function show(name) {
document.getElementById(name).style.display = "";
return false;
}
function hide(name) {
document.getElementById(name).style.display = "none";
}
</script>
<body>
<form id="form1" runat="server">
<div>
<table width="100%">
<tr>
<td>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
BorderColor="#CCCCCC" BorderWidth="1px" CellPadding="0" CellSpacing="1"
EmptyDataRowStyle-Font-Size="Small"
OnPageIndexChanging="GridView1_PageIndexChanging"
PageSize="5" Width="99%">
<Columns>
<asp:BoundField DataField="test1" HeaderText="推荐人">
<HeaderStyle Font-Bold="False" ForeColor="White"
HorizontalAlign="left" Width="10%" />
<ItemStyle HorizontalAlign="left" />
</asp:BoundField>
<asp:BoundField DataField="test1" DataFormatString="{0:yy-MM-dd HH:mm}"
HeaderText="推荐日期">
<HeaderStyle Font-Bold="False" ForeColor="White"
HorizontalAlign="left" Width="10%" />
<ItemStyle HorizontalAlign="left" />
</asp:BoundField>
<asp:BoundField DataField="test1" HeaderText="推荐理由">
<HeaderStyle Font-Bold="False" ForeColor="White"
HorizontalAlign="left" Width="20%" />
<ItemStyle HorizontalAlign="left" />
</asp:BoundField>
<asp:TemplateField HeaderText="操作" ShowHeader="False">
<ItemTemplate>
<asp:LinkButton ID="Add" runat="server" CausesValidation="False" OnClick="Add_Click" Text="新增"></asp:LinkButton>
<asp:LinkButton ID="Modify" runat="server" CausesValidation="False"
CommandArgument='<%# Eval("test1") %>' OnClick="Modify_Click" Text="修改"></asp:LinkButton>
</ItemTemplate>
<HeaderStyle CssClass="IOP_DG_Header_01" Font-Bold="False" ForeColor="White"
HorizontalAlign="left" Width="20%" />
<ItemStyle CssClass="IOP_DG_Item_01" HorizontalAlign="left" />
</asp:TemplateField>
</Columns>
</asp:GridView>
</td>
</tr>
</table>
</div>
<div id="divModify" class="IOP_DataGrid_03" style="z-index: 100; display:none; left:15%; top: 9%; width: 550px; height:300px; position: absolute; background-color:#DEE4F7; overFlow:auto; ">
<table height="60%" width="100%">
<tr>
<td align=center valign="middle">
<table width="100%" height="50%">
<tr>
<td width="35%" align="right" height="30px" valign="middle">
<asp:Label ID="Label6" runat="server" Text="Test1："></asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txt1" runat="server" width="200px" Height="19px"></asp:TextBox>
</td>
</tr>
<tr>
<td width="35%" align="right" height="30px" valign="middle">
<asp:Label ID="Label7" runat="server" Text="Test2："></asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txt2" runat="server" width="200px" Height="19px" ></asp:TextBox>
</td>
</tr>
<tr>
<td width="35%" align="right" height="30px" valign="middle">
<asp:Label ID="Label9" runat="server" Text="Test3："></asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txt3" runat="server" width="200px" Height="19px"></asp:TextBox>
</td>
</tr>
<tr>
<td align="center" colspan=2 height="30px" valign="middle">
<asp:Button ID="btnSub" runat="server" Text="确定" CausesValidation="False" CssClass="IOP_Input01" OnClick="btnSub_Click"/>
<asp:Button ID="btnCan" runat="server" Text="取消" CausesValidation="False" CssClass="IOP_Input01" OnClientClick='hide("divModify")'/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
有些具体操作数据库的方法还得你直接去写。
