در این مقاله نحوه جستجو , دسترسی , و معتبر ساختن کنترل TextBox و DropDownList در سطرهای مربوط به GridView با استفاده از JQuery و JavaScript را شرح خواهیم داد

برای معتبر سازی TextBox و DropDownList مطابق مراحل زیر عمل میکنیم :

تگ مربوط به HTML که شامل یک کنترل GridView حاوی سه ستون میباشد را به صفحه اضافه می کنیم :

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnRowEditing="OnRowEditing">
<Columns>
    <asp:TemplateField HeaderText="Name" ItemStyle-Width="150">
        <ItemTemplate>
            <%# Eval("Name") %>
        </ItemTemplate>
        <EditItemTemplate>
            <asp:TextBox ID="txtName" runat="server" Text='<%# Eval("Name") %>' />
        </EditItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Country" ItemStyle-Width="150">
        <ItemTemplate>
            <%# Eval("Country") %>
        </ItemTemplate>
        <EditItemTemplate>
            <asp:DropDownList ID="ddlCountries" runat="server">
                <asp:ListItem Text="Please select" Value="" />
                <asp:ListItem Text="United States" Value="United States" />
                <asp:ListItem Text="India" Value="India" />
                <asp:ListItem Text="France" Value="France" />
                <asp:ListItem Text="Russia" Value="Russia" />
            </asp:DropDownList>
        </EditItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField>
        <ItemTemplate>
            <asp:LinkButton Text="Edit" runat="server" CommandName="Edit" />
        </ItemTemplate>
        <EditItemTemplate>
            <asp:LinkButton ID = "lnkUpdate" Text="Update" runat="server" OnClick="OnUpdate" />
            <asp:LinkButton Text="Cancel" runat="server" OnClick="OnCancel" />
        </EditItemTemplate>
    </asp:TemplateField>
</Columns>
</asp:GridView>

برای ویرایش و به روز رسانی سطر های موجود در گریدویو از ViewState استفاده کرده ایم .سپس با استفاده از اسرکیپت زیر مقادیر داخل TextBox و DropDownList را اعتبار سنجی میکنیم .

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
    $("[id*=GridView1] [id*=lnkUpdate]").click(function () {
        //Find the GridView Row using the LinkButton reference.
        var row = $(this).closest("tr");
 
        //Find the TextBox control.
        var txtName = row.find("[id*=txtName]");
 
        //Find the DropDownList control.
        var ddlCountries = row.find("[id*=ddlCountries]");
 
        var message = "";
 
        //Validate the TextBox control.
        if ($.trim(txtName.val()) == "") {
            message += "Please enter Name.\n";
        }
 
        //Validate the DropDownList control.
        if (ddlCountries.val() == "") {
            message += "Please select Country.";
        }
 
        //Display error message.
        if (message != "") {
            alert(message);
            return false;
        }
        return true;
    });
});
</script>