验证数据 jQuery Handsontable 输入

Validate Data jQuery Handsontable input

本文关键字:输入 Handsontable jQuery 数据 验证      更新时间:2023-09-26

Q1:在发送到服务器之前验证用户在jQuery Handsontable中输入的数据的最佳方法是什么?

我读过这篇文章上传 jQuery Handsontable 输入

有没有集成解决方案?等集成到jQuery验证插件中,如果没有,使用onbeforechange()方法怎么样?

Q2:更重要的是,我已经启动了一个 100 行表,但如果我使用以下代码,用户可能只会输入 50 行:

$('#btnGo').click(function() { 
  var rowList = $("#example9grid").handsontable("getData"); 
  $('#simple').val(JSON.stringify(rowList)); 
  console.log(rowList); 
});​ 

rowList 将返回 50 个数据行和 50 个空行。

如何删除所有空行?

A1:感谢您的回复,我使用以下代码解决了这个问题:

onBeforeChange: function (data) {
      for (var i = 0, ilen = data.length; i < ilen; i++) {
            if (data[i][0] > 0) { //if it is not first row
                if(data[i][1]==0){ //if it is the first column
                        //some validate logic here
            }else if(data[i][1]==1){//if it is the second column
                        //some validate logic here
                    }
            }
        }
      };

A2:I使用以下代码删除空行:

rowList = $("#dataTable").handsontable("getData");
rowList = $.grep(rowList,function(array,index){
            ...write your logic here
});

试图抓住问题。如果您只是尝试在使用"getData"并将其发送到服务器之前删除空行,那么......只需遍历 DOM 并删除任何空行。

$('#btnGo').click(function() { 
  $('rowSelector:empty').each(function(){
    $(this).remove(); 
  });
  var rowList = $("#example9grid").handsontable("getData"); 
  $('#simple').val(JSON.stringify(rowList)); 
  console.log(rowList); 
});​

A1:在我看来,我会向数据服务器端发送一个$.ajax请求,并在那里进行验证。

// your handsontable callback
    // i would use this callback
onChange : function(data){
    $.ajax({
        url : '/validate/',
        data : data,
        dataType : 'json',
        success : function(res){
            if(res.error){
                handleErrors(res.error);
            }else{
                successMsg(res);
            }
        }
    })

}

这样你就有办法在服务器端建一堵墙,以防有人试图手动添加自己的数据,并且你不会重写你的验证系统。

还有一件事要注意,最好发回json数据,例如在php中,它是这样的。

<?php
// do validating here
    // store if everything is good
    // send back error if thing are not
header('Cache-Control: no-cache, must-revalidate');
header('Content-type: application/json');
echo json_encode($callbackobj);
?>

这样,结果就已经是JavaScript读取的完美形式了

A2:我会把它们留在那里,为新数据留出空间。 如果你看像Excel这样的程序,或者数字,他们只是把表格留在那里。如果您的查看是只读的,我只会使用您存储的数据重建数据。