locked
Validation on dynamically created item template with textbox in gridview RRS feed

  • Question

  • User1192570106 posted

    Hi All,

    I want to apply Validation on dynamically created item templates with textboxes in gridview and show red border as validation message.

    Thank in advance.

    Tuesday, December 12, 2017 1:44 PM

All replies

  • User475983607 posted

    Simply drag the validation control to the template field or markup and apply the appropriate style.

    https://msdn.microsoft.com/en-us/library/bb426882.aspx

    Tuesday, December 12, 2017 2:38 PM
  • User-335504541 posted

    Hi Pratap09,

    I want to apply Validation on dynamically created item templates with textboxes in <g class="gr_ gr_16 gr-alert gr_spell gr_inline_cards gr_run_anim ContextualSpelling ins-del multiReplace" id="16" data-gr-id="16">gridview</g> and show red border as validation message.

    You could try to add a CustomValidator to the page when you add the textbox, then use javascript code to validate your textbox value.

    I have created a demo, in the demo I use CustomValidator to validate whether the textbox's value has more than 5 <g class="gr_ gr_17 gr-alert gr_gramm gr_inline_cards gr_run_anim Grammar multiReplace" id="17" data-gr-id="17">character</g>.

    Please try to use the following code:

    In <g class="gr_ gr_15 gr-alert gr_spell gr_inline_cards gr_run_anim ContextualSpelling" id="15" data-gr-id="15">aspx</g>:

    <head runat="server">
        <title></title>
        <style type="text/css">
            body {
                font-family: Arial;
                font-size: 10pt;
            }
    
            .ErrorControl {
                background-color: #FBE3E4;
                border: solid 1px Red;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:GridView ID="GridView1" runat="server">
                </asp:GridView>
                <asp:Button ID="Button1" runat="server" Text="Button" />
            </div>
        </form>
        <script>
            function Validate(sender, args) {
              var text = $("input[id*='" + sender.controltovalidate + "']").val();
                
                if (text.length>5) {
                    args.IsValid = true;
                } else {
                    args.IsValid = false;
                }
            }
    
            function WebForm_OnSubmit() {
                if (typeof (ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) {
                    for (var i in Page_Validators) {
                        try {
                            var control = $("input[id*='" + Page_Validators[i].controltovalidate + "']");
                            if (!Page_Validators[i].isvalid) {
                                control.addClass("ErrorControl");
                            } else {
                                control.removeClass("ErrorControl");
                            }
                        } catch (e) { }
                    }
                    return false;
                }
                return true;
            }
        </script>
    </body>

    In code behind:

            protected void Page_Load(object sender, EventArgs e)
            {
                DataTable dt = new DataTable();
                dt.Columns.Add("col1");
                dt.Rows.Add("1");
                GridView1.DataSource = dt;
                GridView1.DataBind();
                TextBox textBox = new TextBox();
                textBox.ID = "dynamicaltext1";
                form1.Controls.Add(textBox);
                CustomValidator customValidator = new CustomValidator();
                customValidator.ID = "customValidator";            
                customValidator.ControlToValidate = "dynamicaltext1";
                customValidator.ValidateEmptyText = true;
                customValidator.ClientValidationFunction = "Validate";
                GridView1.Rows[0].Cells[0].Controls.Add(textBox);
                GridView1.Rows[0].Cells[0].Controls.Add(customValidator);
            }

    And the result is:

    You could refer to the link below for more information:

    https://www.aspsnippets.com/Articles/Change-Background-and-Border-Color-of-Invalid-Controls-when-Validation-fails-in-ASP.Net.aspx

    Best Regards,

    Billy

    Wednesday, December 13, 2017 6:06 AM