0

私はphpによる出力であるこのhtmlを持っています。

...
...
<tr valign='top'>
<td>1</td>
<td class="parent">
<a href="http://127.0.0.1/ci/index.php/admin/menus/edit/1">Main menu
</a></td>
<td align='center'>active</td>
<td align='center'>0</td>
<td class="parent" >0</td>
<td align='center'></td>
<td align='center'>
<a href="http://127.0.0.1/ci/index.php/admin/menus/edit/1">edit
</a> | <a href="http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1" class="delete_link" id="delete_link_1">delete
</a></td>

</tr>
<tr valign='top'>
<td>68</td>
<td class="child">
<a href="http://127.0.0.1/ci/index.php/admin/menus/edit/68">Forsiden
</a></td>
<td align='center'>active</td>
<td align='center'>1</td>
<td class="child" >0</td>
<td align='center'>forsiden</td>
<td align='center'>
<a href="http://127.0.0.1/ci/index.php/admin/menus/edit/68">edit</a> | 
<a href="http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/68" class="delete_link" id="delete_link_68">delete
</a></td>

</tr>
...
...

削除リンクをクリックしたときに、trの1つを削除、非表示、およびスライドアップしたい。以下のjqueryを作成しました。DB 内のデータを削除しますが、スライドアップして削除された行を非表示にすることはありません。

私が間違っていることと正しいコードを教えてください。

$('.delete_link').live('click', function(eve){
eve.preventDefault();
if(confirm('Are you sure you want to delete this page?'))
var id = this.href.match(/[^\/]*$/);
this.id = 'http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/' + id;

$.post(this.id, function(){

$('#delete_link_'+id)
        .closest('tr')
        .slideUp('slow',function(){
         $(this).remove();
              });
});
});
4

4 に答える 4

2

最初にあなたの問題は実際には何ですか

  • if ステートメントに中かっこがないため、ajax リクエストは毎回実行されますが、構築された URL が無効であるため、バックグラウンドでサイレントに失敗します。

  • iddelete_linkの を変更しています。

例によって最もよく示されます。このリンクがクリックされたと仮定して

<a href="http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1"
   class="delete_link" id="delete_link_1">
    delete
</a>

$('.delete_link').live('click', function(eve){
1)    eve.preventDefault();
2)    if(confirm('Are you sure you want to delete this page?'))
3)        var id = this.href.match(/[^\/]*$/);
4)    this.id = 'http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/' + id;
5)    $.post(this.id, function(){
6)        $('#delete_link_'+id).closest('tr').slideUp('slow', function() {
7)            $(this).remove();
          });
      });
});

X)thisクリック ハンドラー内には、クリック<a>したタグがあります。

  • id="delete_link_1"
  • href="http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1"

行 3)var idに設定されています1

4行目は(!!)this.idに設定されていますhttp://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1

ちょっと待って、 属性が に設定されthisた a-tagです。今、あなたはIDを上書きしますiddelete_link_1

5 行目) 正しい URL で ajax-post を開始します

行 6)'#delete_link_'+idは に評価され#delete_link_http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1ます。もちろん、そのような id の要素はないため、残り (親 tr の検索、アニメーション、削除) は失敗しますが、実際の削除は成功します。

提案された解決策

ところで。とにかく、正規表現全体が何のためにあるのかわかりません。構築する投稿URLは、hrefすでに設定されている属性とまったく同じに見えるためです<a .. class="delete_link">...</a>

したがって、代わりにこのコードを使用することをお勧めします

$('.delete_link').live('click', function(eve) {
    eve.preventDefault();
    if(confirm('Are you sure you want to delete this page?')) {
        $.post(this.href, function() {
            $(this).parents('tr').eq(0).slideUp('slow', function() {
                $(this).remove(); //is correct as "this" refers to the selected tr
            });
        });
    }
});
于 2009-12-15T01:21:02.060 に答える
1

これを試して：

$('.delete_link').live('click', function(eve){
    eve.preventDefault();
    if(confirm('Are you sure you want to delete this subscriber?')){
        var row = $(this).closest('tr');
        $.post(this.href, function(){
            row.slideUp('slow',function(){
                row.remove();
            });
        });
    }
});
于 2009-12-14T21:35:41.383 に答える
0

鎖を上ってみる

$('#delete_link_'+id).parents('tr').slideUp();
于 2009-12-14T21:34:38.810 に答える
-1

テーブル行の高さをアニメーション化できるかどうかわかりません。

これを試して：

$('#delete_link_'+id).closest('tr').find("td").slideUp('slow',function(){
  $(this).remove();
});

ところで、テストされていません。

于 2009-12-14T21:38:26.730 に答える