使用Javascript - 策略模式建議需要

我有一個JavaScript表單驗證功能類似使用Javascript - 策略模式建議需要

switch (element.getAttribute('validationtype')) { 

     case 'text': 
      if (cic.visible(element)) { 
       if (cic.getValue(element).strip() == "") { 
        errors.push(element.getAttribute('validationmsg')); 
        element.style.border = "1px solid #B23232"; 
       } else { 
        element.style.border = "1px solid #CAD5DE"; 
       } 
      } 
      break; 

     case 'textarea': if (element.value.strip() == "") { 
       errors.push(element.getAttribute('validationmsg')); 
      } 
      break; 

     case 'email': 
      if (!cic.isEmail(cic.getValue(element))) { 
       errors.push(element.getAttribute('validationmsg')); 
       element.style.border = "1px solid #B23232"; 
      } else { 
       element.style.border = "1px solid #CAD5DE"; 
      }; 
      break; 

     case 'numeric': 
      if (cic.getValue(element).strip() == "" || isNaN(cic.getValue(element).replace(',', '.'))) { 
       errors.push(element.getAttribute('validationmsg')); 
       element.style.border = "1px solid #B23232"; 
      } else { 
       element.style.border = "1px solid #CAD5DE"; 
      }; 
      break; 

    }

每次我需要一個新的驗證類型我必須要改變的功能。什麼應該是組織這個功能作爲一個類的最好的方式，以便它是封閉的改變。

來源

2010-10-27 user160820

你需要找到驗證中的公共部分和類型特定的（不要重複自己）。

// Type Specific Validation 
var Validator = { 
    "text": function (data) { 
     // validate text 
    }, 
    "email": function (data) { 
     // validate email 
    }, 
    // ... 
}

內你的函數：

// Common Validation 
var type = el.getAttribute('validationtype'); 
var isValid = Validator[type]; 

if (cic.visible(el)) { 
    if (!isValid(el)) { 
    element.style.border = "1px solid #B23232"; 
    errors.push(element.getAttribute('validationmsg')); 
    } else { 
    element.style.border = "1px solid #CAD5DE"; 
    } 
}

來源

2010-10-27 08:44:08 galambalazs

你需要找到一種方法來編碼每個驗證規則的一些便攜式格式，字符串或可能是JSON，很容易自動生成。

然後你需要改變函數來解析這些規則。

格式可能是

{ 
    [ 
     {"fieldname":"something","validationtype":"minmax","arguments":{"min":10,"max":20}} 
     , {"fieldname":"somethingelse","validationtype":"largerthanfield","arguments":{"field":""something}} 
    ] 
}

然後這將測試場的東西是在10至20的範圍內，並且something2比更大的東西。

您應該實施哪個規則選項取決於您的解決方案，並且可以有幾乎所有的變體。

來源

2010-10-27 08:28:37


function validate(e) { 
    var v = this.vMap[e.getAttribute('validationtype')]; 
    v && v(e); 
} 
validate.vMap = { 
    'text': function(element) { 
    // validate codes 
    }, 'textarea': function(element) { 
    // validate codes 
    }/* ... and so on */ 
}; 

// to use 
validate(document.getElementById('aId'));

來源

2010-10-27 08:34:33 itea

不是自己實現這個功能，如何使用jQuery Validation plug-in？

來源

2010-10-27 08:37:11 rickythefox

使用Javascript - 策略模式建議需要

回答

相關問題