一个页面表单控件验证的随笔算法和相关部分js

1.问题描述

首先获取到表单内部的所有controls,主要是对controls进行严整,关于答案control主要是包含radio和text.

条件:

我们首先要确定那些controls是需要进行处理的,并且给予标记.这里我给了每个需要验证的controls一个自定义的属性question,并且根据实际的问题进行definition, example: question = "A",实际我在控制中是question =1....

我们假定controls大致由以下组合构成: AAAAABBB*CCCC**DDDDEEEE

其中*号表示不需要进行验证的controls,这样通过definition我就可以根据定义进行分组,然后每组验证controls的状态。

验证条件：

第一，一组内的controls如果全部disabled，那么我们不需要对改组controls进行验证。否则，参照条件2。

第二，对改组所有controls进行验证，因为所有问题都是单选，所以验证radio || text 的 条件。如果一组内的control都没有进行操作，则提示用户。

解决思路：

这里我使用了3个指针，对组遍历，指针分别为

p 表示表示遍历指针;

disabled和valicated分别平时都指向组头,当p运行到下组的时候,运行这2个指针,分别进行判断条件.

用questionNo和preQuestionNo存储属性question的值,用于判断组边界.

每当运行到组边界比如AAABB中间的AB就是组边界,这个时候就对上一组遍历,并且对整个组的controls进行验证.

算法的大致source code:

function Validate()
{
 var ctrls = Form1.elements;
 
 //初始化
 var p = 0;
 var disabled = 0;
 var valicated = 0;
 
 var questionNo = "";
 var preQuestionNo = "";
  
 while(p < ctrls.length)
 {
  obj = ctrls[p];
  
  if(questionNo == "" && obj.getAttribute("question") != null) //开始边界条件,初始化第一组的问题No
  {
   preQuestionNo = obj.getAttribute("question");
   questionNo = obj.getAttribute("question");
   valicated = disabled = p; //保存第一个问题控件的指针地址
  }
  else if(obj.getAttribute("question") != null) //保存上一组的问题No,找出组的分界点
  {
   preQuestionNo = questionNo;
   questionNo = obj.getAttribute("question");
  }
  else
  {
   p++;
   continue;
  }
  
  
  if( p != 0 && questionNo != preQuestionNo) //指针移动到组分界点,这个时候开始判断处理上一组的问题
  {
   var isDisabled = true;
   var firstItemAddr = disabled;
   
   while(disabled < p)
   {
    obj = ctrls[disabled];
    if(obj.getAttribute("question") != null)
    {
     var a = obj.disabled;
     var name = obj.name;
     if(obj.disabled == false)
     { 
      isDisabled = false;
      disabled = p;
      break;
     } 
    }
    
    disabled++;
   }
   
   if(isDisabled == false)
   {
    var validatedResult = false;
    var judgedRadio = false;
    while(valicated < p)
    {
     obj = ctrls[valicated];
     if(obj.getAttribute("question") != null)
     {
      //判断是否选中或者有值.验证逻辑:首先验证radio,如果没有disable,就验证是否checked,否则验证文本框内是否有值
      if(obj.getAttribute("type").toLowerCase() == "radio")
      {
       validatedResult = obj.checked || validatedResult;   
      }
      else
      {
       validatedResult = validatedResult || obj.value != ""
      }
     }
          
     valicated++;
    }
    
    if(!validatedResult)
    {     
     alert("问题"+preQuestionNo+"请选择一个答案!");
     
     obj = ctrls[firstItemAddr];
     obj.focus();
     
     return validatedResult;
    }   
   }
   
   valicated = p;   
   
  }
  
  p++;  
  
 }
 
 //边界条件，验证最后一组问题
 firstItemAddr = disabled;
 
 if(isDisabled == false)
 {
  var validatedResult = false;
  var judgedRadio = false;
  
  while(valicated < p)
  {
   obj = ctrls[valicated];
   if(obj.getAttribute("question") != null)
   {
    //判断是否选中或者有值.验证逻辑:首先验证radio,如果没有disable,就验证是否checked,否则验证文本框内是否有值
    if(obj.getAttribute("type").toLowerCase() == "radio")
    {
     validatedResult = obj.checked || validatedResult;   
    }
    else
    {
     validatedResult = validatedResult || obj.value != ""
    }
   }
        
   valicated++;
  }
  
  if(!validatedResult)
  {
   
   alert("问题"+questionNo+"请选择一个答案!");
   
   obj = ctrls[firstItemAddr];
   obj.focus();
   
   return validatedResult;
  }    
 }
 
 return validatedResult;
}