如何在ASP中验证表单.. NET使用图像按钮,然后引发onClick事件

本文关键字:按钮 图像 然后 事件 onClick ASP 验证 NET 表单 | 更新日期: 2023-09-27 17:49:49

这可能是一个愚蠢的问题,但我是这里的初学者。

我在asp.net中创建了一个表单,它的所有字段都使用单击图像按钮时的验证控件进行验证。它工作正常。之后,我添加一个事件的按钮。这是那个按钮的代码。

<asp:ImageButton ID="Submit" runat="server" OnClick="submit_Clicked" ValidationGroup="AddSchoolValidationGroup" CausesValidation="true" ImageUrl="~/Styles/images/submit-btn.png" OnClientClick="submitClicked" />

该事件的目的是将表单中的所有值提交给数据库。这里我的问题是,onClick事件添加到按钮后,验证还没有发生。我希望这些onClick事件仅在表单验证成功时才会引发。谁能指点我一下……

如何在ASP中验证表单.. NET使用图像按钮,然后引发onClick事件

确保对所有验证控件使用相同的验证组。另外,您可以使用OnClientClick事件来调用验证。

<asp:ImageButton ID="Submit" runat="server" OnClick="submit_Clicked" ValidationGroup="AddSchoolValidationGroup" CausesValidation="true" ImageUrl="~/Styles/images/submit-btn.png"  OnClientClick="return Page_ClientValidate('AddSchoolValidationGroup');"  />

您需要在提交之前验证页面。请为按钮添加属性。

protected void Page_Load(object sender, EventArgs e)
{
   Submit.Attributes.Add("onclick", "javascript:if(Page_ClientValidate('AddSchoolValidationGroup')){return true;}else{return false;}");
}

既然你在OnClientClick中有一个方法"submitClicked",你可以在Page_ClientValidate中调用相同的方法并删除现有的"OnClientClick"属性。

protected void Page_Load(object sender, EventArgs e)
{
   Submit.Attributes.Add("onclick", "javascript:if(Page_ClientValidate('AddSchoolValidationGroup')){submitClicked(); return true;}else{return false;}");
}

可以使用javascript函数

    function validateForm() {
        if (document.getElementById('txtName').value == '') 
         { 
             ValidatorEnable(document.getElementById("rfvName"), true) // rfvName is id of validator
               return false; }
    }

并在客户端点击图像按钮时调用该函数

   <asp:ImageButton ID="Submit" runat="server" OnClientClick="validateForm();" OnClick="submit_Clicked" ValidationGroup="AddSchoolValidationGroup" CausesValidation="true" ImageUrl="~/Styles/images/submit-btn.png" /> 

OnClientClick="return submitClicked();"代替OnClientClick="submitClicked"

function submitClicked()
{
    if (document.getElementById('txtname') != '') {
        return true;
    }
    else {
        alert('Please Enter Name');
        return false;
    }
}

因此,在所有的验证都被验证之前,服务器端事件将不会被调用。