使用javascript验证网格视图控件

时间:2011-03-31 07:50:22

标签: javascript

大家好 我有一个网格视图,它与数据库绑定,但它与数据表绑定。第一次加载页面时,网格视图有一个空行。我正在使用此网格在数据库中插入数据。每当用户在第一行中插入数据并单击“添加新行”按钮时,就会创建一个新行。现在我的问题是当用户点击按钮我想验证是否有任何空控件。所以我想添加javascript。我有很多脚本,但它不起作用。请指导我。

我的网格视图如下所示。

                         资格明细                                                                                                                                                                     
                                                                                                                                                                                                                                                                    合格                                                                                                                                                                  - 选择 -

                                     </asp:DropDownList>
                                 </ItemTemplate>
                             </asp:TemplateField>
                             <asp:TemplateField>
                                 <HeaderTemplate>
                                     Percentage
                                 </HeaderTemplate>
                                 <ItemTemplate>
                                     <asp:TextBox ID="percentageBox" clientID="percentageBox" name="percentageBox" runat="server"></asp:TextBox>
                                  </ItemTemplate>
                             </asp:TemplateField>
                             <asp:TemplateField>
                                 <HeaderTemplate>
                                     Passing Year
                                 </HeaderTemplate>
                                 <ItemTemplate>
                                     <asp:TextBox ID="yearBox"  clientID="yearBox" name="yearBox" runat="server"></asp:TextBox>
                                     </ItemTemplate>
                             </asp:TemplateField>
                             <asp:TemplateField>
                                 <HeaderTemplate>
                                     Institute Name
                                 </HeaderTemplate>
                                 <ItemTemplate>
                                     <asp:TextBox ID="instituteNameBox" clientID="instituteNameBox" name="instituteNameBox" runat="server"></asp:TextBox>
                                    </ItemTemplate>
                             </asp:TemplateField>
                         </Columns>
                         <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                         <PagerStyle BackColor="#284775" ForeColor="White" 
                             HorizontalAlign="Center" />
                         <SelectedRowStyle BackColor="#E2DED6" ForeColor="#333333" Font-Bold="True" />
                         <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                         <EditRowStyle BackColor="#999999" />
                         <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                     </asp:GridView>
                   </td>
                        </tr>
                    </table>
              </ContentTemplate>
                <Triggers>
                <asp:AsyncPostBackTrigger ControlID="addRowBtn" EventName="Click"/>
                </Triggers>

            </asp:UpdatePanel>
            <br />
    </td>
</tr>

1 个答案:

答案 0 :(得分:1)

我使用J Query在网格视图中创建了一个验证示例。您可以从这一点获得帮助。

<强> JQUERY:

var vIsProcess = true;
$("#btnSubmitNew").click(function(){
    $("table[id$='gvCommentSample']").find("input:text").each(function(){
    if($(this).val()=="")
    {
        alert("Please fill the required field");
        $(this).focus();
        vIsProcess= false;
        return false;
    }
    else
    {
        vIsProcess= true;
    }
 });
 if(!vIsProcess)
    return false;
 else
    return true;   
});

<强> ASPX:

<asp:GridView ID="gvCommentSample" runat="server" ShowFooter="false" Width="50%" AutoGenerateColumns="false"  >
    <Columns>
        <asp:TemplateField HeaderText="Code">
            <ItemTemplate>
                <asp:TextBox ID="txtCode" runat="server"></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Name">
            <ItemTemplate>
                <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
<br />
<asp:Button ID="btnSubmitNew" runat="server" Text="Submit" />

<强> CLICK ON THIS LINK TO SEE THE DEMO