2012-06-09 92 views
0

Q1:在發送到服務器之前,驗證用戶在jQuery Handsontable中輸入的數據的最佳方式是什麼?驗證數據jQuery Handsontable輸入

我看了這篇文章 Upload jQuery Handsontable input

是否有任何集成的解決方案?等等整合到jQuery驗證插件,如果沒有,如何使用onbeforechange()方法?

Q2:更重要的是,我已經發起了一個100行的表,但它可能是用戶會輸入只有50行,如果我用下面的代碼:

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

rowList將返回50個數據行和50個空行。

如何刪除所有空行?

回答

1

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:謝謝馬爾欽的答覆,我已經通過下面這些代碼解決了這個問題,我必須使用下面這些代碼中刪除空行:

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

更新版本的handsontable已將'onBeforeChange'重命名爲'beforeChange' – forgotpw1

0

試圖把握這個問題。如果您只是在使用'getData'之前刪除空行並將其發送給服務器,那麼...只需遍歷DOM並刪除所有空行。

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

謝謝這是一個解決方案,但是如果表格有5列,並且一個單元格是空的,它就不能正常工作,例如$(this).remove();它將刪除​​元素,如果我重寫爲$(this).parent()。remove(); ,它會刪除整行,即使其他4列也不是空的。 – hank511

+0

使用jQuery.grep(數組,回調,[反轉])過濾上傳數組,回調函數可以編寫您的業務邏輯。很好! – hank511

+0

也許這是一個roockie問題,但什麼是rowSelector:空? –

0

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這樣的程序或數字,他們只是把表格留在那裏。如果您的查看只讀,我只會重建您存儲的數據的數據。

+0

對於A1:服務器端驗證是好的,但我的驗證方法並不複雜,所以我想先驗證客戶端的數據。對於A2:相反,我想使用jQuery.grep(數組,回調,[反轉])來過濾上傳數組。 – hank511