|
This article describes how to use TextBox, RequiredFieldValidator and ValidatorCalloutExtender and GridView. Step 1: Register AjaxContrlToolkit <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %> Step 2: Add ScriptManager <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> Step 3: Create gridview with two ItemTemplates. First template will contain TextBox, RequiredFieldValidator and ValidatorCalloutExtender and Second template will contain Button. < asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnRowDataBound="GridView1_RowDataBound" onrowcommand="GridView1_RowCommand"> <Columns> <asp:BoundField HeaderText="Type" DataField="ProductId" /> <asp:TemplateField> <ItemTemplate> <asp:TextBox runat="server" ID="MyTextBox" BorderStyle="solid" BorderWidth="1px" BorderColor="#a9a9a9" /> <asp:Label runat="server" ID="lblDisplay" ForeColor="Brown"/> <asp:RequiredFieldValidator runat="server" ID="MyReq" ControlToValidate="MyTextBox" Display="None" ErrorMessage="<b>Required Field Missing</b><br />A name is required." /> <ajaxToolkit:ValidatorCalloutExtender runat="Server" ID="NReqE1" TargetControlID="MyReq" HighlightCssClass="ValidatorCalloutHighlight" /> </ItemTemplate> </asp:TemplateField> <asp:TemplateField> <ItemTemplate> <asp:Button runat="server" ID="btn" commandname="Add" Text="Add" BorderStyle="solid" BorderWidth="1px" BorderColor="#a9a9a9" /> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView>Step 4: Bind TextBox, RequiredFieldValidator and Button with validation group. ValidationGroup name should be unique for each pair of TextBox and Button in the gridview row. To give unique name to ValidationGroup of each pair of TextBox and Button, we need to bind the TextBox and Button GridView1_RowDataBound. protected void GridView1_RowDataBound(object sender, System.Web.UI.WebControls.GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.DataRow) { TextBox tbx = (TextBox)e.Row.FindControl("MyTextBox"); RequiredFieldValidator rfv = (RequiredFieldValidator) e.Row.FindControl("MyReq"); Button btn = (Button)e.Row.FindControl("btn"); string validationGroupText = "ValidationTest" + (e.Row.DataItemIndex + 1).ToString(); tbx.ValidationGroup = validationGroupText; rfv.ValidationGroup = validationGroupText; btn.ValidationGroup = validationGroupText; } }Step 5: Fill GridView with data. protected void FillGridView() { DataTable table = new DataTable(); table.Columns.Add("ProductId", typeof(int)); table.Rows.Add(1); table.Rows.Add(2); table.Rows.Add(3); table.Rows.Add(4); table.Rows.Add(5); GridView1.DataSource = table; GridView1.DataBind(); } Step 6: Call FillGridView() on Page_Load protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) FillGridView(); }Step 7: Add RowCommand method which will get the text from TextBox and fill the label. protected void GridView1_RowCommand(Object sender, GridViewCommandEventArgs e) { if (e.CommandName == "Add") { GridViewRow row = (GridViewRow)((Button)e.CommandSource).NamingContainer; ((Label)row.FindControl("lblDisplay")).Text = ((TextBox)row.FindControl("MyTextBox")).Text; ((TextBox)row.FindControl("MyTextBox")).Visible = false; } } Live Demo
|