如何在Ajax中验证序列化数据

时间:2014-09-16 12:18:47

标签: javascript jquery ajax prototypejs

我有这个特殊的问题,我需要在通过ajax调用保存之前验证数据。当用户导航到其他URL时,会调用save_ass_rub函数。

在我的应用程序中,我有一个自定义窗口,允许用户输入数据。我能够捕获此步骤中的所有数据:var data = $('form').serialize(true);。但是我需要遍历这个并检查某些特定元素的数据是否为空。当用户在自定义窗口中时,我无法执行此操作。 “自定义”窗口对于用户是可选的。我想要的只是提醒用户,以防他在提交数据之前将元素留空。 我们正在使用Prototype.js和ajax。

<script>
  function save_ass_rub() {
    var url = 'xxxx';
    var data = $('form').serialize(true);
    var result;
    new Ajax.Request( url, {
      method: 'post',
      parameters: data,
      asynchronous: false,  // suspends JS until request done

      onSuccess: function (response) {
        var responseText = response.responseText || '';
        if (responseText.length > 0) {
          result = eval('(' + responseText + ')');
        }
      }
    });
    if (result && result.success) {
      return;
    }
    else {
      var error = 'Your_changes_could_not_be_saved_period';
      if (window.opener) { // ie undocked
        //Show alert in the main window 
        window.opener.alert(error);
        return;
      }

      return error;
    }
  }

  // Set up auto save of rubric when window is closed
  Event.observe(window, 'unload', function() { 
    return save_ass_rub(); 
  });
</script>

可以这样做吗?

After Line var data = $('form').serialize(true); var split_data = data.split("&"); for (i = 0; i < split_data.length; i++) { var elem = split_data[i]; var split_elem = elem.split('='); if( split_elem[0].search(/key/) && split_elem[0] == '' ){ console.log( split_elem ); var error = 'Not all the elements are inputted'; window.opener.alert(error); return; } }

1 个答案:

答案 0 :(得分:1)

我不会使用序列化的表单字符串,而是使用表单本身来进行验证。如果$('form')是你的表单元素,那么创建一个单独的函数来检查表单元素,使其区分。

function checkform(form)
{
    var emptytexts = form.down('input[type="text"]').filter(function(input){
        if(input.value.length == 0)
        {
            return true;
        }
    });
    if(emptytexts.length > 0)
    {
        return false;
    }
    return true;
}

并在save_ass_rub()函数

//..snip
if(checkform($('form') == false)
{
    var error = 'Not all the elements are inputted';
    window.opener.alert(error);
    return;
}
var data = $('form').serialize(true);
var result;

我只在checkform()函数中添加了文本输入,您可以使用其他输入类型以及您希望该函数执行的任何其他奇怪处理。只要它返回false,就会显示错误并且js将停止,否则它将继续