asp:ScriptManager runat="server" ID="SM" EnablePartialRendering="true"
/asp:ScriptManager 这个是为了实现新增多条记录时实现无刷新!
table id="tbList"
设施设备
/td
td colspan="7"
asp:UpdatePanel ID="updatePanel1" runat="server"
ContentTemplate
asp:Button ID="addEquipmentBtn" runat="server" Text="新增" OnClick="AddEquipment_Click"/
asp:Repeater ID="rptInstallationEquipment" runat="server" OnItemCommand="rptInstallationEquipment_ItemCommand" OnItemDataBound="rptInstallationEquipment_ItemDataBound"
HeaderTemplate
table id="tblInstallationEquipment" width="100%"
/th
/th
日期时间
/th
详细内容
/th
/th
处理结果
/th
/th
/tr
/HeaderTemplate
ItemTemplate
asp:Label runat="server" ID="EquipmentSortOrder" Text=' %#Container.ItemIndex + 1% ' /asp:Label
/td
asp:DropDownList runat="server" ID="EquipmentType"
asp:ListItem Value="lanwhy" lanwhy /asp:ListItem
asp:ListItem Value="8023" 8023 /asp:ListItem
/asp:DropDownList
/td
asp:TextBox ID="FaultDateTime" Text=' %#Eval("FaultDateTime") % ' isAddRedStar="false" runat="server" validator="required,pattern[date]"
/asp:TextBox
/td
asp:TextBox runat="server" ID="DetailContent" Text=' %#Eval("DetailContent") % '
MaxLength="1000" TextMode="MultiLine" validator="length[1,1000]" /asp:TextBox
/td
asp:TextBox runat="server" ID="FaultSortOrder" Text=' %#Eval("FaultSortOrder") % ' /asp:TextBox
/td
asp:TextBox runat="server" ID="Result" Text=' %#Eval("Result") % ' MaxLength="1000" TextMode="MultiLine" validator="length[1,1000]" /asp:TextBox
/td
asp:Button ID="btnDelete" runat="server" Text="删除" CommandName="EquipmentDeleteInfo"
CommandArgument=' %#Container.ItemIndex + 1% ' /
asp:HiddenField runat="server" ID="hidInstallationEquipmentID" Value=' %#Eval("InstallationEquipmentID") % ' /
/td
/tr
/ItemTemplate
FooterTemplate
/table
/FooterTemplate
/asp:Repeater
/ContentTemplate
/asp:UpdatePanel
/td
/tr
/table
后台代码
添加设施设备 也就是新增按钮的点击事件
protected void AddEquipment_Click(object sender, EventArgs e)
DataTable dt = this.CopyFormDetailData();
DataRow dr = dt.NewRow();
dt.Rows.Add(dr);
ViewState.Add("EquipmentData", dt);
DetailDataBinds();
protected DataTable CopyFormDetailData()
if ((ViewState["EquipmentData"] as DataTable) == null)
DataTable dtView = new DataTable();
dtView.Columns.Add("InstallationEquipmentID", typeof(string));
dtView.Columns.Add("EquipmentCode", typeof(string));
dtView.Columns.Add("EquipmentName", typeof(string));
dtView.Columns.Add("FaultDateTime", typeof(string));
dtView.Columns.Add("DetailContent", typeof(string));
dtView.Columns.Add("FaultSortOrder", typeof(string));
dtView.Columns.Add("Result", typeof(string));
dtView.Rows.Add(dtView.NewRow());
ViewState.Add("EquipmentData", dtView);
DataTable dt = (ViewState["EquipmentData"] as DataTable).Clone();
foreach (RepeaterItem ri in this.rptInstallationEquipment.Items)
DataRow dr = dt.NewRow();
dr["InstallationEquipmentID"] = (ri.FindControl("hidInstallationEquipmentID") as HiddenField).Value;
dr["EquipmentCode"] = (ri.FindControl("EquipmentType") as DropDownList).SelectedValue;
dr["EquipmentName"] = (ri.FindControl("EquipmentType") as DropDownList).SelectedItem.Text;
dr["FaultDateTime"] = (ri.FindControl("FaultDateTime") as TextBox).Text;
dr["DetailContent"] = (ri.FindControl("DetailContent") as TextBox).Text;
dr["FaultSortOrder"] = (ri.FindControl("FaultSortOrder") as TextBox).Text;
dr["Result"] = (ri.FindControl("Result") as TextBox).Text;
dt.Rows.Add(dr);
return dt;
protected void DetailDataBinds()
DataTable dt = ViewState["EquipmentData"] as DataTable;
rptInstallationEquipment.DataSource = dt;
rptInstallationEquipment.DataBind();
删除设施设备数据
protected void rptInstallationEquipment_ItemCommand(object sender, RepeaterCommandEventArgs e)
if (e.CommandName == "EquipmentDeleteInfo")
DataTable dt = new DataTable();
dt = this.CopyFormDetailData();
dt.Rows.RemoveAt(e.Item.ItemIndex);
this.rptInstallationEquipment.DataSource = dt;
this.rptInstallationEquipment.DataBind();
int cnt = this.rptInstallationEquipment.Items.Count;
if (cnt 0)
((Button)this.rptInstallationEquipment.Items[cnt - 1].FindControl("btnDelete")).Focus();
else
this.addEquipmentBtn.Focus();
绑定设施设备数据
protected void rptInstallationEquipment_ItemDataBound(object sender, RepeaterItemEventArgs e)
{ //因为专业和处理结果每次新增新行时都会有默认值,不做处理的话会把上一行的数据覆盖
TextBox txtResult = (TextBox)e.Item.FindControl("Result");
if (txtResult != null)
txtResult.Text = "未修复";
DataRowView drv = (DataRowView)e.Item.DataItem;
if (!string.IsNullOrWhiteSpace(drv["Result"].ToString()))
txtResult.Text = drv["Result"].ToString();
DropDownList dropEquipmentType = (DropDownList)e.Item.FindControl("EquipmentType");
if (dropEquipmentType != null)
dropEquipmentType.DataBind();
DataRowView drv = (DataRowView)e.Item.DataItem;
//保持下拉框选择的项
if (!string.IsNullOrWhiteSpace(drv["EquipmentName"].ToString()))
dropEquipmentType.Items.FindByText(drv["EquipmentName"].ToString()).Selected = true;
}
可以看出,第一次点击新增时,增加了序号为1的行,输入数据后,再次点击新增按钮,发现序号1的行的数据还是会保持!
之前没接触这种用法时,可以用JavaScript或者JQuery实现这种新增多行的需求,当进行项目开发时,学会了这种,可以很容易实现这种需求,快捷完成增删改查!
点击删除按钮可以删除整行
下面简单介绍下使用JQuery的方式实现增加多条记录
table
th colspan="10"
近期工作安排
input type="button" onclick="addSecurity()" value="增加" /
/th
/tr
td colspan="10"
table width="100%" id="tabSecurity"
/th
事件情况
/th
处理意见
/th
责任单位
/th
/th
/tr
/table
/td
/tr
/table
//增加近期工作安排
function addSecurity() {
var trNum = $("#tabSecurity tr").length;
var html = ' tr ';
html += ' td ' + trNum + ' /td ';
html += ' td textarea validator="required,length[1,2000]" /textarea /td ';
html += ' td textarea validator="required,length[1,2000]" /textarea /td ';
html += ' td input type="hidden" / textarea validator="required" /textarea /td ';
html += ' td input type="button" value="删除" / /td ';
html += ' /tr ';
$("#tabSecurity").append(html);
//tabSecurity.ResetHeight();
function deleteSecurity(_this) {
$(_this).parent().parent().remove();
$("#tabSecurity tr").each(function (index, element) {
if (index 0) {
$(this).find('td').eq(0).html(index);
function getItemDetail() {
var resultArray = [];
$("#tabSecurity tr").each(function (index, element) {
if (index 0) {
var entity = {};
entity.ORDER = $(this).children().eq(0).html();
entity.EVENTNOTE = $(this).children().eq(1).children().eq(0).val();
entity.DealProposal = $(this).children().eq(2).children().eq(0).val();
entity.RESORGIDS = $(this).children().eq(3).children().eq(0).val();
resultArray.push(entity);
return resultArray;
}
如何获取repeater中多行数据?
List InstallationEquipmentInfo listInstallationEquipmentInfo = new List InstallationEquipmentInfo ();
foreach (Control record in this.rptInstallationEquipment.Items)
InstallationEquipmentInfo installationEquipmentInfo = new InstallationEquipmentInfo();
installationEquipmentInfo.EquipmentCode = ((DropDownList)record.FindControl("EquipmentType")).SelectedValue;
installationEquipmentInfo.EquipmentName = ((DropDownList)record.FindControl("EquipmentType")).SelectedItem.Text;
installationEquipmentInfo.EquipmentSortOrder = ((Label)record.FindControl("EquipmentSortOrder")).Text;
installationEquipmentInfo.DetailContent = ((TextBox)record.FindControl("DetailContent")).Text;
installationEquipmentInfo.FaultDateTime = ((TextBox)record.FindControl("FaultDateTime")).Text.ToString();
installationEquipmentInfo.FaultSortOrder = ((TextBox)record.FindControl("FaultSortOrder")).Text;
installationEquipmentInfo.Result = ((TextBox)record.FindControl("Result")).Text;
listInstallationEquipmentInfo.Add(installationEquipmentInfo);
}