欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

ASP.NET简化编辑界面解决思路及实现代码

程序员文章站 2024-03-31 18:11:22
简化用户操作界面,添加功能一般没法简化,但是如果是在gridview做显示,编辑,更新与删除,会让用户在编辑,需要点击编辑铵钮,再进行编辑,或是取消编辑。 为了解决这个问...

简化用户操作界面,添加功能一般没法简化,但是如果是在gridview做显示,编辑,更新与删除,会让用户在编辑,需要点击编辑铵钮,再进行编辑,或是取消编辑。

为了解决这个问题,insus.net想到一些改进的方法。可以参考下面演示:

以下内容于2011-11-07 9:20添加:

上面实现,只是使用table加上gridview来组合。

其中,gridveiw直接使用itemtemplate模版,省略了edititemtemplate模版。事件也省略了onrowediting与onrowcancelingedit事件。

如下所示:

ASP.NET简化编辑界面解决思路及实现代码

然后把edititemtemplate的内容搬至itemtemplate模版中,并替换。

ASP.NET简化编辑界面解决思路及实现代码

完整代码参考如下:

复制代码 代码如下:

<asp:table id="table1" runat="server" cssclass="table" cellpadding="2" cellspacing="0">
<asp:tableheaderrow height="20" backcolor="#efebde" borderwidth="1" bordercolor="#c0c0c0">
<asp:tableheadercell backcolor="#efebde" borderwidth="1" bordercolor="#c0c0c0">
chinese name
</asp:tableheadercell>
<asp:tableheadercell backcolor="#efebde" borderwidth="1" bordercolor="#c0c0c0" width="50%">
english name
</asp:tableheadercell>
<asp:tableheadercell backcolor="#efebde" borderwidth="1" bordercolor="#c0c0c0" width="10%">
edit
</asp:tableheadercell>
</asp:tableheaderrow>
<asp:tablerow height="20">
<asp:tablecell borderwidth="1" bordercolor="#c0c0c0">
<asp:textbox id="txt_cname" runat="server" />
</asp:tablecell>
<asp:tablecell borderwidth="1" bordercolor="#c0c0c0">
<asp:textbox id="txt_ename" runat="server" />
</asp:tablecell>
<asp:tablecell borderwidth="1" bordercolor="#c0c0c0">
<asp:button id="buttoninsert" text="insert" runat="server" onclick="buttoninsert_click" />
</asp:tablecell>
</asp:tablerow>
</asp:table>
<div style="margin-top: 3px; margin-bottom: 3px; padding: 3px;">
</div>
<asp:gridview id="gvcuttertype" runat="server" datakeynames="cuttertypeid" autogeneratecolumns="false"
cellpadding="2" cellspacing="0" width="100%" borderwidth="0" bordercolor="#c0c0c0"
onrowdeleting="gvcuttertype_ondeletecommand" onrowupdating="gvcuttertype_onupdatecommand"
rowstyle-height="20" showheader="false">
<columns>
<asp:templatefield>
<itemstyle borderwidth="1" bordercolor="#c0c0c0" />
<itemtemplate>
<asp:textbox id="txtcname" runat="server" text='<%# eval("cname") %>'></asp:textbox>
</itemtemplate>
</asp:templatefield>
<asp:templatefield>
<itemstyle borderwidth="1" bordercolor="#c0c0c0" width="50%" />
<itemtemplate>
<asp:textbox id="txtename" runat="server" text='<%# eval("ename") %>'></asp:textbox>
</itemtemplate>
</asp:templatefield>
<asp:templatefield headertext="编辑">
<itemstyle borderwidth="1" bordercolor="#c0c0c0" width="5%" />
<itemtemplate>
<asp:button id="button1" runat="server" commandname="update" text="update" />
</itemtemplate>
</asp:templatefield>
<asp:templatefield headertext="删除">
<itemstyle borderwidth="1" bordercolor="#c0c0c0" width="5%" />
<itemtemplate>
<asp:button id="button2" runat="server" commandname="delete" text="delete" />
</itemtemplate>
</asp:templatefield>
</columns>
</asp:gridview>

xxx.aspx.cs:
复制代码 代码如下:

protected void buttoninsert_click(object sender, eventargs e)
{
//do insert something
}

protected void gvcuttertype_onupdatecommand(object sender, gridviewupdateeventargs e)
{
//do update something
}

protected void gvcuttertype_ondeletecommand(object sender, gridviewdeleteeventargs e)
{
//do delete something
}