DataGrid in Add mode
DataGrid in Edit mode
DataGrid in Design mode
DataGrid in HTML mode
<asp:datagrid id="dgExpenses" runat="server" ShowFooter="True" BorderStyle="Ridge" BorderColor="LightGray"
BorderWidth="1px" DataKeyField="ExpenseID" AutoGenerateColumns="False" AllowSorting="True"
HeaderStyle-Wrap="false" HeaderStyle-Font-Bold="true" HeaderStyle-BackColor="LightGrey" AlternatingItemStyle-BackColor="Linen"
CellPadding="2" GridLines="Horizontal" Width="490px" CssClass="tn10">
<EditItemStyle BackColor="#66FFFF"></EditItemStyle>
<AlternatingItemStyle BackColor="Linen"></AlternatingItemStyle>
<HeaderStyle Font-Bold="True" Wrap="False" BackColor="LightGray"></HeaderStyle>
<FooterStyle BackColor="LightGray"></FooterStyle>
<Columns>
<asp:TemplateColumn SortExpression="ExpenseDate" HeaderText="Date1">
<ItemTemplate>
<asp:Label id=lblExpenseDate runat="server" CssClass="tn10" Text='<%# DataBinder.Eval(Container, "DataItem.ExpenseDate", "{0:d}") %>'>
</asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox id="tbExpenseDateF" runat="server" Text="bonny1" CssClass="tn10" Width="75px" ReadOnly="True"></asp:TextBox>
<asp:HyperLink id="lnkCalendarF" runat="server" ImageUrl="images/im_calendar.gif"></asp:HyperLink>
<asp:RequiredFieldValidator id="rfvtbExpenseDateF" runat="server" CssClass="hr10" ControlToValidate="tbExpenseDateF"
ErrorMessage="Please select a date" Display="Dynamic"></asp:RequiredFieldValidator>
</FooterTemplate>
<EditItemTemplate>
<asp:TextBox id=tbExpenseDate runat="server" CssClass="tn10" Width="75px" Text='<%# DataBinder.Eval(Container, "DataItem.ExpenseDate", "{0:d}") %>' ReadOnly="True">
</asp:TextBox>
<asp:HyperLink id="lnkCalendar" runat="server" ImageUrl="images/im_calendar.gif"></asp:HyperLink>
<asp:RequiredFieldValidator id="rfvtbExpenseDate" runat="server" CssClass="hr10" ControlToValidate="tbExpenseDate"
ErrorMessage="Please select a date" Display="Dynamic"></asp:RequiredFieldValidator>
</EditItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn SortExpression="PMethodName" HeaderText="Payment Method1">
<ItemTemplate>
<asp:Label id=lblPMethodName runat="server" CssClass="tn10" Text='<%# Container.DataItem("PMethodName") %>'>
</asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:DropDownList id="ddlPMethodF" runat="server" CssClass="tn10" DataTextField="PMethodName" DataValueField="PMethodID"></asp:DropDownList>
<asp:comparevalidator id="cvddlPMethodF" runat="server" CssClass="hr10" Type="Integer" Operator="GreaterThan"
ValueToCompare="0" Display="Dynamic" ErrorMessage="Please select a payment method" ControlToValidate="ddlPMethodF"></asp:comparevalidator>
</FooterTemplate>
<EditItemTemplate>
<asp:DropDownList id="ddlPMethod" runat="server" CssClass="tn10" DataTextField="PMethodName" DataValueField="PMethodID"></asp:DropDownList>
<asp:comparevalidator id="cvddlPMethod" runat="server" CssClass="hr10" Type="Integer" Operator="GreaterThan"
ValueToCompare="0" Display="Dynamic" ErrorMessage="Please select a payment type" ControlToValidate="ddlPMethod"></asp:comparevalidator>
</EditItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn SortExpression="ECategoryName" HeaderText="Expense Category">
<ItemTemplate>
<asp:Label id=lblECategoryName runat="server" CssClass="tn10" Text='<%# Container.DataItem("ECategoryName") %>'>
</asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:DropDownList id="ddlECategoryF" runat="server" CssClass="tn10" DataTextField="ECategoryName"
DataValueField="ECategoryID"></asp:DropDownList>
<asp:comparevalidator id="cvddlECategoryF" runat="server" CssClass="hr10" Type="Integer" Operator="GreaterThan"
ValueToCompare="0" Display="Dynamic" ErrorMessage="Please select an expense category" ControlToValidate="ddlECategoryF"></asp:comparevalidator>
</FooterTemplate>
<EditItemTemplate>
<asp:DropDownList id="ddlECategory" runat="server" CssClass="tn10" DataTextField="ECategoryName" DataValueField="ECategoryID"></asp:DropDownList>
<asp:CompareValidator id="cvddlECategory" runat="server" CssClass="hr10" Type="Integer" Operator="GreaterThan"
ValueToCompare="0" Display="Dynamic" ErrorMessage="Please select an expense category" ControlToValidate="ddlECategory"></asp:CompareValidator>
</EditItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn SortExpression="ExpenseAmount" HeaderText="Amount">
<ItemStyle HorizontalAlign="Right"></ItemStyle>
<ItemTemplate>
<asp:Label id=lblExpenseAmount runat="server" CssClass="tn10" Text='<%# DataBinder.Eval(Container, "DataItem.ExpenseAmount", "{0:C}") %>'>
</asp:Label>
</ItemTemplate>
<FooterStyle HorizontalAlign="Right"></FooterStyle>
<FooterTemplate>
<asp:TextBox id="tbExpenseAmountF" runat="server" CssClass="tn10r" Width="65px" Text=""></asp:TextBox>
<asp:RequiredFieldValidator id="rfvtbExpenseAmountF" runat="server" CssClass="hr10" Display="Dynamic" ErrorMessage="Please enter an amount"
ControlToValidate="tbExpenseAmountF"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator id="revaltbExpenseAmountF" runat="server" CssClass="hr10" Display="Dynamic" ErrorMessage="Please use only numbers"
ControlToValidate="tbExpenseAmountF" ValidationExpression="[0-9.]*"></asp:RegularExpressionValidator>
</FooterTemplate>
<EditItemTemplate>
<asp:TextBox id=tbExpenseAmount runat="server" CssClass="tn10" Width="65px" Text='<%# DataBinder.Eval(Container, "DataItem.ExpenseAmount", "") %>'>
</asp:TextBox>
<asp:RequiredFieldValidator id="rfvtbExpenseAmount" runat="server" CssClass="hr10" Display="Dynamic" ErrorMessage="Please enter an amount"
ControlToValidate="tbExpenseAmount"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator id="revaltbExpenseAmount" runat="server" CssClass="hr10" Display="Dynamic" ErrorMessage="Please use only numbers"
ControlToValidate="tbExpenseAmount" ValidationExpression="[0-9.]*"></asp:RegularExpressionValidator>
</EditItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn SortExpression="ExpenseCurrencyText" HeaderText="Curr">
<ItemStyle HorizontalAlign="Left"></ItemStyle>
<ItemTemplate>
<asp:Label id=lblExpenseCurrency runat="server" CssClass="tn10" Text='<%# DataBinder.Eval(Container, "DataItem.ExpenseCurrencyText", "") %>'>
</asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:DropDownList id="ddlExpenseCurrencyF" runat="server" CssClass="tn10" DataValueField="ExpenseCurrency">
<asp:ListItem Value="1">CAN</asp:ListItem>
<asp:ListItem Value="2">US</asp:ListItem>
</asp:DropDownList>
</FooterTemplate>
<EditItemTemplate>
<asp:DropDownList id="ddlExpenseCurrency" runat="server" CssClass="tn10" DataValueField="ExpenseCurrency">
<asp:ListItem Value="1">CAN</asp:ListItem>
<asp:ListItem Value="2">US</asp:ListItem>
</asp:DropDownList>
</EditItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemTemplate>
<asp:LinkButton id="lnkbutEdit" runat="server" Text="<img border=0 src=images/im_edit.gif alt=edit>"
CommandName="Edit" CausesValidation="false"></asp:LinkButton>
</ItemTemplate>
<EditItemTemplate>
<asp:LinkButton id="lnkbutUpdate" runat="server" Text="<img border=0 src=images/im_update.gif alt=save/update>"
CommandName="Update"></asp:LinkButton>
<asp:LinkButton id="lnkbutCancel" runat="server" Text="<img border=0 src=images/im_cancel.gif alt=cancel>"
CommandName="Cancel" CausesValidation="false"></asp:LinkButton>
</EditItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemStyle HorizontalAlign="Center"></ItemStyle>
<ItemTemplate>
<asp:LinkButton id="lnkbutDelete" runat="server" Text="<img border=0 src=images/im_delete.gif alt=delete>"
CommandName="Delete" CausesValidation="false"></asp:LinkButton>
</ItemTemplate>
<FooterStyle HorizontalAlign="Center"></FooterStyle>
<FooterTemplate>
<asp:Button id="btnAddRow" runat="server" CssClass="hb9" Text="ADD" CommandName="AddANewRow"></asp:Button>
</FooterTemplate>
</asp:TemplateColumn>
</Columns>
</asp:datagrid>
Next > > Code Behind ASP.Net (VB)
