如何仅在按钮单击或输入上触发验证：提交

Question

我在我的 asp 页面中使用更新面板，并且我正在对异步回发进行 JQuery 验证...

我只想在按钮点击或提交时验证我的表单... 我的问题是..我所有的按钮都在不同的表单视图中，并且一次不会加载...这就是为什么我无法获取按钮 ID 并使用点击事件..这是我的代码..

 Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(ValidateMyForm);
 function ValidateMyForm(sender, args) {
            var objPost = args.get_postBackElement();
            if (objPost === null || objPost === undefined) return;
            if (objPost.id == '<%= ((Button)(formViewinfo.FindControl("btnUpdate"))).ClientID %>') {
                $('#pnlerrors').fadeOut('fast');
                $('#pnlItemErrors').fadeOut('fast');

                var isValid = $('#form1').validate({
                    errorClass: 'error',
                    invalidHandler: function (e, validator) {
                        var errors = validator.numberOfInvalids();
                        if (errors) {
                            $('#pnlerrors').html('<p>&nbsp;Please correct the errors  </p>').fadeIn('fast');
                            document.location.href = '#pnlerrors';
                        }
                    }, submitHandler: function () {

                    }
                }).form();

                if (!isValid) {
                    CancelPostback(sender, args);
                } else {

                }

            }
            //this is for rest of buttons
            else {
                $('#pnlItemErrors').fadeOut('fast');
                $('#pnlerrors').fadeOut('fast');
                var isValid = $('#form1').validate({
                    errorClass: 'error',
                    invalidHandler: function (e, validator) {
                        var errors = validator.numberOfInvalids();
                        if (errors) {
                            $('#pnlerrors').fadeOut('fast');
                            document.location.replace('#', '#pnlItemErrors');
                            $('#pnlItemErrors').html('<p>&nbsp;Please correct the errors </p>').fadeIn('fast');
                            document.location.href = '#pnlItemErrors';
                        }
                    }, submitHandler: function () {
                    }
                }).form();

                if (!isValid) {
                    CancelPostback(sender, args);
                } else {

                }

            }
        }

我想要做的就是：仅对按钮提交进行第二次验证，而不是针对所有内容...我确实在此页面上收到了其他回发，这些回发也每次都得到验证（我想避免这种情况）...

我不知道这种方法好不好...我一直在努力解决这个问题..非常感谢您的帮助...

Answer 1

假设您不希望在有人按下回车按钮时提交表单，并且您只想在按下 @ 时提交表单987654323@按钮：

$(document).ready(
    function(){
        $('form').keypress(
            function(event){
                if (event.keyCode == '13'){

                    return false;
                }
            });
        $('input:submit').click(
            function(){
                $(this).closest('form').submit();
            });
        $('form').submit(
            function(){
                $('#success').text('form submitted! (Not really...)');
                return false;
                // Just to stop the error messages
                // in this demo.
            });
    });

There's a JS Fiddle demo, here: http://jsfiddle.net/davidThomas/5PaWz/.

如果我的假设有误，请发表评论，我会尽力纠正自己。

Answer 2

如果您的问题只是找到需要验证的按钮，那么 解决此问题的一种方法是向要触发验证的按钮添加一个类，例如：

<asp:button id="btn1" cssclass="Validate"/>

然后你可以在 JQuery 中获取所有这些按钮：

var buttons = $('.Validate');

获取每个按钮的id：

$(buttons).each(function(){
   var id = this.id;
});

Answer 3

哦..上帝终于找到了解决我问题的方法...首先，如果我的问题不清楚，我深表歉意....

我的验证适用于异步回发...我只想在按钮单击时验证我的表单..我的页面中有一个 asp.net 网格视图..如果我单击分页或网格上的某些内容，它会触发验证...我想避免这种情况..

为此，我所做的是...我正在使用以下语句捕获回发元素。

var objPost = args.get_postBackElement();

然后我正在检查类型..

if (objpost.type == 'submit') { do validation }
else { don't }..

这结束了我两天的挣扎...... 非常感谢您的支持和帮助...

Answer 4

尝试不同的方法。 使用带有 UseSubmitBehavior=true 的 asp.Net 按钮进行提交 并使用带有 UserSubmitBehavior=false 的 asp.Net Button 用于您不希望它们触发验证过程的按钮。将以下代码添加到您的表单中

function ValidateForm()
{   
   var errors ="";
   if (typeof(Page_ClientValidate) == 'function') 
   {
        if (typeof (Page_ClientValidate) == 'function') { Page_ClientValidate();     } 
        if (!Page_IsValid)
        {                        
               for (i = 0; i < Page_Validators.length; i++) {         
                var inputControl = document.getElementById(Page_Validators[i].controltovalidate);               
                if (!Page_Validators[i].isvalid) {                                                        
                    errors = errors + ";" +  Page_Validators[i].errormessage;
                    inputControl.style.border ="solid 2px #FF0000";
                }                        
              }
        }    

        return Page_IsValid;
  }
  return true; 
}

$(document).ready(function(){  
/*********************************************************************/
///handle form submittion and run validation prior to that 
///if a textbox has required field validator, stop form submittion and
/// highlight the text box
/*********************************************************************/                            
  $('#form1').submit(function(){                                                
       return   ValidateForm(); 
       });