jQuery验证 - 验证超链接按钮onclick上的表字段并显示错误消息摘要 [英] jQuery Validation- Validating table fields on the onclick of hyperlink button and showing error message summary

问题描述

我有一个包含各种表格的表单。这些表格在下一个按钮被点击时显示或隐藏。因此，这几乎为用户提供了从一个页面到另一个页面的导航，而表单是相同的，只是表格被显示/隐藏。现在我需要的是单击下一个按钮（超链接类型）来验证这些表，并且每次显示验证摘要。我知道验证可以用于整个表单，但我需要验证表格元素，然后显示摘要。

请记住，我使用非突兀的客户端验证，使用该模型来创建元素。此外，它目前进行验证，但在最后提交按钮。我的表的非常简短的样本

 < table id =table1> 
< tr> 
< td1>第一个库仑< / td1> 
< td2> value2< / td2> 
< td3> 
< a id =Nextonclick =javascript：function1（）>保存< / a> 
< / td3> 
< / tr> 
< / table> 
  

解决方案

 < table id =table1> 
< tr> 
< td1>第一个库仑< / td1> 
< td2> value2< / td2> 
< td3> 
< a id =Nextonclick =javascript：validAndNext（'1'）>保存< / a> 
< / td3> 
< / tr> 
< / table> 
。 
。 
。 
< table id =tableN> 
 
函数validAndNext（table_id）{
 var table = $（'＃table'+ table_id）; 
 var inputs = table.find（input）; 
 var valid = true; （$（this）.val（）。length <= 0）valid = false; 
}）; 
 if（valid）{
 table.hide（）; 
 $（'＃table'+（table_id + 1））。show（）; 
} else alert（'您的表格无效！'）; 
} 
  

I have a form that contains various tables. These tables are shown or hidden when the next button is clicked. So this virtually provides a navigation to the user from one page to another while the form is same and just the tables are shown/hidden. Now what I need is validate these table on click of next button (a hyperlink type) and show a validation summary each time. I know validate can be used for the whole form but I need to just validate the table elements and then show the summary.

Keep in mind that I am using non obtrusive client side validation, the elements are being created using that model thing. Also, it currently does that validation but on submit button at the end. very brief sample of my table

<table id= "table1">
    <tr>
        <td1>First coulmn</td1>
        <td2>value2</td2>
        <td3>
            <a id="Next" onclick= "javascript:function1()">Save</a>
        </td3>
    </tr>
</table>

解决方案

<table id= "table1">
    <tr>
        <td1>First coulmn</td1>
        <td2>value2</td2>
        <td3>
            <a id="Next" onclick= "javascript:validAndNext('1')">Save</a>
        </td3>
    </tr>
</table>
    .
    .
    .
<table id="tableN"> 

function validAndNext(table_id){
   var table = $('#table'+table_id);
   var inputs = table.find("input");
   var valid = true;
   inputs.each(function(){
       // A type of validation is:
       if($(this).val().length<=0) valid = false;                
   });
   if(valid){
      table.hide();
      $('#table'+(table_id+1)).show();
   }else alert('Your table is not valid!');
}

这篇关于jQuery验证 - 验证超链接按钮onclick上的表字段并显示错误消息摘要的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！