按钮上的客户端Jquery验证单击asp.net?

时间:2015-05-18 05:45:17

标签: javascript jquery asp.net validation

我正在尝试使用Jquery在按钮单击上验证字段,但问题是似乎事件和jquery事件后面的代码并行运行。

(修订版)

 <asp:Button ID="btnsave" runat="server" ClientIDMode="Static" OnClientClick="return clientFunction()" CssClass="ButtonText"
                    Text="SAVE" OnClick="btnsave_Click" />
                    &nbsp;

客户端验证:

<script type="text/javascript">

    function clientFunction() {

        var isValid = true;
        $('#txtsupplieruserid,#txtsuppliername,#txtbusinessemailid,#txtorganizationname,#txtphonenumber,#txtcity,#txtstate,#txtpostalcode,#txtaddress').each(function () {
            if ($.trim($(this).val()) == '') {
                isValid = false;
                $(this).css({
                    "border": "1px solid red",
                    "background": "#FFCECE"
                });
            }
            else {
                $(this).css({
                    "border": "",
                    "background": ""
                });
            }
        });
        if (isValid == false) {

            e.preventDefault();
            return isValid;
        }
        else {
            return isValid;
        }
    }
</script>

我想首先通过Jquery进行验证,如果它通过了客户端验证,那么请转到代码后面。我想用Jquery而不是纯Javascript来做这件事。

1 个答案:

答案 0 :(得分:1)

您可以使用OnClientClick进行客户端验证,如果验证通过return true,则return false。如果返回true,则将调用服务器端函数,否则不会调用。

<asp:Button ID="btnsave" runat="server" ClientIDMode="Static" CssClass="ButtonText" Text="SAVE" OnClientClick="return clientFunction()"   onclick="btnsave_Click" />


function clientFunction()
{

    var isValid = true;
    $('#txtsupplieruserid,#txtsuppliername,#txtbusinessemailid,#txtorganizationname,#txtphonenumber,#txtcity,#txtstate,#txtpostalcode,#txtaddress').each(function ()  
    {
             if ($.trim($(this).val()) == '') {
                 isValid = false;
                 $(this).css({
                     "border": "1px solid red",
                     "background": "#FFCECE"
                 });
             }
             else {
                 $(this).css({
                     "border": "",
                     "background": ""
                 });
             }
     });
         if (isValid == false) {
             return false;
         }
         else {
             return true;
         }
}

如果您的控件为server controls,则可能需要使用ClientIDMode="Static"。所以他们的身份证保持不变。