前几天,要求在HR系统中添加一个可以对每月第一个上班日进行登记管理的WEB窗口,哎,一见WEB窗口我就头痛,没有办法,硬着头皮上阵,网上寻找了一些资料,马马虎虎完成了以下窗口界面:
可以在一个窗口上进行记录的添加、修改和删除,当编辑或者删除、修改时也可以先有提示,为了防止用户乱输入,我让用户通过下拉框来选择年、月、日。
下面就是详细的设计过程:
1 在APP_CODE目录下添加一个辅助类,类中实现了3个静态方法,分别是取年、月、日,以作为年、月、日下拉框中的项:
public class FirstWorkDayAssist
{
public static List<suYear> getYear()
{
List<suYear> list = new List<suYear>();
for (int i = 2007; i <= 2020; ++i)
{
suYear temp = new suYear();
temp.FYear = i.ToString();
list.Add(temp);
}
return list;
}
public static List<suMonth> getMonth()
{
List<suMonth> list = new List<suMonth>();
for (int i = 1; i <= 12; ++i)
{
suMonth temp = new suMonth();
temp.FMonth = i.ToString();
list.Add(temp);
}
return list;
}
public static List<suDay> getDay()
{
List<suDay> list = new List<suDay>();
for (int i = 1; i <= 31; ++i)
{
suDay temp = new suDay();
temp.FDay = i.ToString();
list.Add(temp);
}
return list;
}
}
public class suYear
{
private string _fYear;
public string FYear
{
get { return _fYear; }
set { _fYear = value; }
}
}
public class suMonth
{
private string _fMonth;
public string FMonth
{
get { return _fMonth; }
set { _fMonth = value; }
}
}
public class suDay
{
private string _fDay;
public string FDay
{
get { return _fDay; }
set { _fDay = value; }
}
}
2 在ASP窗口中添加一个GRIDVIEW,GRIDVIEW如下:
<asp:GridView ID="GridView1" runat="server" AllowPaging="True"
AutoGenerateColumns="False" OnRowCancelingEdit="GridView1_RowCancelingEdit"
OnRowDataBound="GridView1_RowDataBound" OnRowDeleting="GridView1_RowDeleting"
OnRowEditing="GridView1_RowEditing" OnRowUpdating="GridView1_RowUpdating"
ShowFooter="True" Width="542px" BorderColor="Coral" BorderWidth="1px" Font-Size="10pt" >
<Columns>
<asp:TemplateField HeaderText="年">
<EditItemTemplate>
<asp:DropDownList ID ="ddl1" runat="server" SelectedValue='<%# Bind("FYear") %>' DataSourceID="ObjectDataSource1" DataTextField="FYear" DataValueField="FYear">
</asp:DropDownList>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" TypeName="FirstWorkDayAssist" SelectMethod="getYear">
</asp:ObjectDataSource>
</EditItemTemplate>
<FooterTemplate>
<asp:DropDownList ID ="ddl2" runat="server" DataSourceID="ObjectDataSource1" DataTextField="FYear" DataValueField="FYear">
</asp:DropDownList>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" TypeName="FirstWorkDayAssist" SelectMethod="getYear">
</asp:ObjectDataSource>
</FooterTemplate>
<ItemStyle BorderWidth="2px" />
<HeaderStyle BorderWidth="2px" />
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("FYear") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="月">
<EditItemTemplate>
<asp:DropDownList ID ="ddl3" runat="server" SelectedValue='<%# Bind("FMonth") %>' DataSourceID="ObjectDataSource2" DataTextField="FMonth" DataValueField="FMonth">
</asp:DropDownList>
<asp:ObjectDataSource ID="ObjectDataSource2" runat="server" TypeName="FirstWorkDayAssist" SelectMethod="getMonth">
</asp:ObjectDataSource>
</EditItemTemplate>
<FooterTemplate>
<asp:DropDownList ID ="ddl4" runat="server" DataSourceID="ObjectDataSource2" DataTextField="FMonth" DataValueField="FMonth">
</asp:DropDownList>
<asp:ObjectDataSource ID="ObjectDataSource2" runat="server" TypeName="FirstWorkDayAssist" SelectMethod="getMonth">
</asp:ObjectDataSource>
</FooterTemplate>
<ItemStyle BorderWidth="2px" />
<HeaderStyle BorderWidth="2px" />
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("FMonth") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="第一个工作日">
<EditItemTemplate>
<asp:DropDownList ID ="ddl5" runat="server" SelectedValue='<%# Bind("FDay") %>' DataSourceID="ObjectDataSource3" DataTextField="FDay" DataValueField="FDay">
</asp:DropDownList>
<asp:ObjectDataSource ID="ObjectDataSource3" runat="server" TypeName="FirstWorkDayAssist" SelectMethod="getDay">
</asp:ObjectDataSource>
</EditItemTemplate>
<FooterTemplate>
<asp:DropDownList ID ="ddl6" runat="server" DataSourceID="ObjectDataSource3" DataTextField="FDay" DataValueField="FDay">
</asp:DropDownList>
<asp:ObjectDataSource ID="ObjectDataSource3" runat="server" TypeName="FirstWorkDayAssist" SelectMethod="getDay">
</asp:ObjectDataSource>
</FooterTemplate>
<ItemStyle BorderWidth="2px" />
<HeaderStyle BorderWidth="2px" />
<ItemTemplate>
<asp:Label ID="Label3" runat="server" Text='<%# Bind("FDay") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="操作" ShowHeader="False">
<EditItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="True" CommandName="Update"
Text="更新"></asp:LinkButton>
<asp:LinkButton ID="LinkButton2" runat="server" CausesValidation="False" CommandName="Cancel"
Text="取消"></asp:LinkButton>
</EditItemTemplate>
<FooterTemplate>
<asp:LinkButton ID="LinkButton3" runat="server" CausesValidation="False" OnClick="Button2_Click"
OnClientClick="return confirm('确认要添加吗?');" Text="添加"></asp:LinkButton>
<%--<asp:Button ID="Button2" runat="server" O Text="添加" />--%>
</FooterTemplate>
<ItemStyle BorderWidth="2px" />
<HeaderStyle BorderWidth="2px" />
<ItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Edit"
Text="编辑"></asp:LinkButton>
<asp:LinkButton ID="LinkButton3" runat="server" CausesValidation="False" CommandName="Delete"
OnClientClick="return confirm('确认要删除吗?');" Text="删除"></asp:LinkButton>
<%--<asp:LinkButton ID="LinkButton2" runat="server" CausesValidation="False" CommandName="Select"
Text="选择"></asp:LinkButton>--%>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<RowStyle ForeColor="ForestGreen" />
<SelectedRowStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
<HeaderStyle BackColor="White" Font-Bold="False" ForeColor="Black" />
<AlternatingRowStyle BackColor="#EFEFFF" />
<FooterStyle BackColor="#C0C0FF" />
</asp:GridView>
注意,所有的项都为TemplateField,里面都定义了ItemTemplate、EditItemTemplate和FooterTemplate,其中ItemTemplate为正常浏览时的显示,EditItemTemplate为处于编辑状态的形式,而FooterTemplate则是为了用来添加记录;定义了3个ObjectDataSource,使下拉框和相应的数据源绑定,如绑定月份:
<asp:DropDownList ID ="ddl3" runat="server" SelectedValue='<%# Bind("FMonth") %>' DataSourceID="ObjectDataSource2" DataTextField="FMonth" DataValueField="FMonth">
</asp:DropDownList>
<asp:ObjectDataSource ID="ObjectDataSource2" runat="server" TypeName="FirstWorkDayAssist" SelectMethod="getMonth">
</asp:ObjectDataSource>
3 CS文件中代码实现:
由于平时喜欢在GUI和DB之间添加一些业务逻辑类,所以我针对这个有用定义了一个简单的类:
class suFirstWorkDay
{
private string _fId;
public string FId
{
get { return _fId; }
set { _fId = value; }
}
private string _fYear;
public string FYear
{
get { return _fYear; }
set { _fYear = value; }
}
private string _fMonth;
public string FMonth
{
get { return _fMonth; }
set { _fMonth = value; }
}
private string _fDay;
public string FDay
{
get { return _fDay; }
set { _fDay = value; }
}
public suFirstWorkDay(string id, string year, string month, string day)
{
_fId = id;
_fYear = year;
_fMonth = month;
_fDay = day;
}
}
在数据显示时,用GRIDVIEW来保定数据源List<suFirstWorkDay>来实现。
其它代码如下,请自己认真查看:
public partial class Trace_FirstWorkDay : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
//if (userid < 0)
//{
// Mess.Alert("你没有权限查看数据!", Page); return;
//}
if (!this.IsPostBack)
{
GridViewBind();