2

slickgrid の使用を開始したばかりです (作者への ++) - いくつかの小さな問題が発生しています - インコンテキスト編集を使用していくつかのフィールドを動的に更新したいと考えています。編集が完了したら、これをサーバーに送信して、送信された内容を検証する必要があります。エラーが発生した場合、validatr イベントの動作と同様の方法でエラーを処理したいと思いますか? たとえば、セルを強調表示し、それが有効になるまでユーザーが離れないようにしますが、どうすればよいかわかりませんか? これに関するアドバイスをいただければ幸いです。

これまでのコード...

grid.onCellChange.subscribe(function(e, args) {
    var item = args.item;
    var column = args.cell;       
    var row = args.row;
    var value = data[args.row][grid.getColumns()[args.cell].field];
    var id = args.item.id;
    var field = grid.getColumns()[args.cell].field;
    var dataString = "id="+id+"&field="+field+"&value="+value;
    var status = false;
    $.ajax({
        type: "POST",
        url: "/en/<?php echo $this->controller; ?>/updateattribute/&callback=?'",
        data: dataString,
        dataType: "json",
        success: function(a) {  
            console.log(data);              
            if(a.status == true) {                  
                status = true;
            } else {
                status = false;             
            }       
            return false; 
        }
    });    
    if(!status) {
        return false;
    }             
    grid.invalidateRow(data.length);
    data.push(item);
    grid.updateRowCount();
    grid.render();
});

どうもありがとう

4

2 に答える 2

2

Ajax リクエストは、デフォルトでは非同期です。つまり、

if(!status) {
    return false;
}             
grid.invalidateRow(data.length);
data.push(item);
grid.updateRowCount();
grid.render();

おそらくsuccessコールバックの前に実行されます。いくつかの異なる解決策:

  • ajax リクエストを同期化します (非推奨):

    $.ajax({ ... async: false, ...})
    
  • ajax リクエストに続くすべてのコードをsuccessorcompleteコールバックに入れます。このようなもの(テストされていません):

    grid.onCellChange.subscribe(function(e, args) {
        // snip...
    
        $.ajax({
            type: "POST",
            url: "/en/<?php echo $this->controller; ?>/updateattribute/&callback=?'",
            data: dataString,
            dataType: "json",
            success: function(a) {  
                console.log(data);              
                if(a.status) {                  
                    grid.invalidateRow(data.length);
                    data.push(item);
                    grid.updateRowCount();
                    grid.render();
                }
            }
        });
    });
    

jQuery のdeferred オブジェクトも、これをきれいに記述する方法を提供できます。

于 2011-06-06T14:18:35.610 に答える
1

次の 2 つのオプションのいずれかをお勧めします。

  • 検証のために変更をサーバーに送信します。スピナーを表示して、バックグラウンド プロセスが実行中であることを視覚的に示し、検証中は編集とセル ナビゲーションを一時的に無効にします。応答を受け取ったら、編集とナビゲーションを再度有効にするか、セルを編集モードに戻して検証エラーを表示します。

  • 上記と同じですが、ナビゲーションを続行し、編集を無効にするだけです。onBeforeCellEdit イベント ハンドラーを追加して、サーバーがまだ応答していないためセルを編集できないことを通知する優しいメッセージをユーザーに表示し、編集をキャンセルします。

于 2011-06-06T18:20:23.270 に答える