使用JSON进行规则

时间:2017-07-19 09:53:03

标签: javascript jquery json forms validation

我正在开发一些客户端表单验证,需要使用包含id键数组(用于描述输入类型)和规则(用于定义验证规则)的JSON文件(与服务器端验证共享)用于输入类型)。

以下是JSON结构的示例:

[
  {
    "id": "search",
    "rules": [
      {
        "name": "min_length",
        "value": 5
      },
      {
        "name": "email"
      }
    ]
  },
  {
    "id": "phone-number",
    "rules": [
      {
        "name": "min_length",
        "value": 5
      }
    ]
  }
]

我正在做以下事情:

  • 加载文件并解析json并存储为对象。
  • 在表单中循环并存储所有id。

我需要帮助

  • 将每个表单元素“id”与json对象中相应的“id”值匹配

  • 为每个“规则”“名称”创建一个函数。

  • 当在JSON对象中匹配“id”的表单元素时,运行匹配“id”的每个“rules”“name”的函数。所以看看我上面的JSON,我想“用”搜索“检查元素的形式,然后运行一个函数来检查最小长度并运行一个检查电子邮件的函数(检查我有的正则表达式)。

理想情况下,我希望尽可能保持通用,以允许处理任何id +规则。规则本身将是预定义的“min_length”,“email”等列表,因此这些可以是规则存在时运行的函数。

这是我到目前为止的一些JS代码。更多的一些想法让我更接近我需要做的事情!

// Get the json file and store
function loadJSON(callback) {
  var xobj = new XMLHttpRequest();
  xobj.overrideMimeType("application/json");
  xobj.open('GET', 'js/rules.json');
  xobj.onreadystatechange = function () {
    if (xobj.readyState == 4 && xobj.status == "200") {
      // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
      callback(xobj.responseText);
    }
  };
  xobj.send(null);
}

// Load json...
loadJSON(rulesData);

// Global vars...
var rules = [];

function rulesData(data) {
  // Parse json and create object...
  var jsonObj = JSON.parse(data);
  // Push objects to rules array for later use
  for (var i = 0; i < jsonObj.length; i++) {
    rules.push(jsonObj[i]);
  }
}

$(function(){
  $('#email-submit').click(function(){
    var formInputs = new Array();
    //Get the form ID
    var id = $(this).parent().attr('id');
    $('#' + id + ' input').each(function(){
        //Get the input value
        var inputValue = $(this).val();
        //Get the input id
        var inputId = $(this).attr('id');
        //Add them to the array
        formInputs[inputId] = inputValue;
    });
    console.log(formInputs);
    return false;
  });
});


var emailRegex = "^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,6}$";

0 个答案:

没有答案