2

テーブルを含む div を上にスライドさせ、テーブルの行を ajax 呼び出しで変更してから、テーブルを含むテーブルを下にスライドさせようとしています。一連のコールバックを効果的に機能させることができないようです。

$("div#grid").slideUp('fast', function() {
    //eaery row but the first
    $("#testtable tr")
        .not(":first")
        .filter(":has(input[type='checkbox'][checked])")
        .each(function() {
            //change html using ajax calls
            editrow($(this).attr("id"));
         });

     })
     .slideDown('fast');  // want this to wait until editrow() has been run on each row

editrow() には、指定された行の html を編集するための ajax 呼び出しが含まれています。問題は、div が上にスライドし、すぐに下に戻ることです。関数が各行で実行され、テーブルの html が変更されるまで待機してから、下にスライドする必要があります。

4

3 に答える 3

1

$(this).slideDown('fast');あなたのajax呼び出しからの成功イベントが必要だと思います。各 ajax 呼び出しで成功イベントがトリガーされることが期待されるため、これは現在の状況では機能しません (少なくとも、私があなたが望んでいる方法ではありません)。一連の異なる呼び出しではなく、1 つの呼び出しを実行できるように、配列を ajax 呼び出しに渡すことは可能ですか? 自分が何をしているのか正確にわからないと難しいですが、それが最善の策だと思います。

于 2009-08-19T20:21:33.503 に答える
1

最初の行は「チェックオール」タイプのものだと思いますか？多分それはヘッダーですか？理想的には、checked="checked" ではなく、checked="true" を使用する必要があります。また、jQuery で検証する「checked」属性を単純に使用する必要があります。

以下はjQuery 1.3+で動作するはずです

まず、1 つまたは 2 つの手順を実行してみてください。次に、より複雑なものに移行してみてください。

$("div#grid").slideUp('fast', function() {
   $(this).slideDown('fast');
});

それがうまくいけば、次のフェーズ...

$("div#grid").slideUp('fast', function() {
  // For each table row with a checkbox that isn't in the first row
  $("#testtable tr").not(":first").filter(":has(input[type='checkbox'][checked])")
     .each(function(){
          // I substituted your custom function so we can find out if this works first
          alert($(this).attr("id"));
     });
});

そして、それが機能する場合は、次に進みます...

$("div#grid").slideUp('fast', function() {
  // For each table row with a checkbox that isn't in the first row
  $("#testtable tr").not(":first").filter(":has(input[type='checkbox'][checked])")
     .each(function(){
          // Original function reinserted
          editrow($(this).attr("id"));
     });
     $(this).slideDown('fast');
});

チェックボックス自体ではなく、表の行に id="" を入れることを忘れないでください。

于 2009-08-19T19:57:20.183 に答える
0

すべての ajax 呼び出しが完了した後にスライド ダウン アニメーションを発生させる必要がある場合は、最初に編集される行の量を数え、それを変数に保存し、成功した ajax 呼び出しごとにその数を減らします。成功した ajasx 呼び出しで数値が 0 に減少した場合は、スライド ダウン アニメーションを実行します。

このようなもの：

$("div#grid").slideUp('fast', function() {
  //every row but the first
  rowsToUpdate = $("#testtable tr")
      .not(":first")
      .filter(":has(input[type='checkbox'][checked])");
  $("#testtable").data('rowsToUpdate', rowsToUpdate.length);
  rowsToUpdate.each(function() {
        //change html using ajax calls
        editrow($(this).attr("id"));
     });

 });

 function editrow(id) {
     $.ajax({
         complete : function () {
             // On complete, not success as we always want to show the table again?
             rowsToUpdate = $("#testtable").data('rowsToUpdate')--;
             $("#testtable").data('rowsToUpdate', rowsToUpdate);
             if (rowsToUpdate == 0) {
                 $("div#grid").slideDown('fast');
             }
         }
 }

警告。完全にテストされていないコード。

于 2009-10-28T13:22:53.633 に答える