Jquery hide after delete

Question

Я пытаюсь удалить весь отображаемый блок сообщений после того, как я нажал 'delete'.

Это просто не работает на всех ...

Что у меня есть:

function DelPost(postid) { 
    $.ajax({ 
     url: Cussion.BaseURL + "/dashboard/delpost", 
     type: "POST", 
     data: { postid: postid }, 
     success: function(data) { 
      $('post_'+postid).remove(); 
      if(data == "ok") { 
       toastr["success"]("Uw gepost bericht is verwijderd.", "Gelukt!"); 
      }else{ 
       toastr["error"]("Uw gepost bericht is niet verwijderd.", "Er ging iets mis!"); 
      } 
     } 
    }); 
} 

И мой HTML:

@foreach($posts as $post) 
     <div class="row row-sm" id="post_{!! $post->PostID !!}"> 
     <div class="col-sm-12"> 
      <div class="card"> 
      <div class="card-heading"> 
       <a href class="pull-left w-32 m-r" href="{!! url(Auth::user()->slug) !!}"> 
       <img src="{!! asset('avatars/'.$post->image) !!}" class="w-full img-circle"> 
       </a> 


       <div class="card-tools"> 
       <ul class="list-inline"> 
        <li class="dropdown"> 
        <a md-ink-ripple data-toggle="dropdown" class="md-btn md-flat md-btn-circle"> 
         <i class="mdi-navigation-more-vert text-md"></i> 
        </a> 
        <ul class="dropdown-menu dropdown-menu-scale pull-right pull-up top text-color"> 
         <li id="{!! $post->PostID !!}"><a onclick="DelPost({!! $post->PostID !!});"> <i class="material-icons i-24" style="font-size:15px;">delete</i> Verwijderen</a></li> 
         <li id="{!! $post->PostID !!}"><a onclick="alert('Niet beschikbaar.');"> <i class="material-icons i-24" style="font-size:15px;">edit</i> Beweken</a></li> 
        </ul> 
        </li> 
       </ul> 
       </div> 

       <div class="clear"> 
       <a href="{!! url($post->slug) !!}" class="font-bold block">{!! ucwords($post->firstname) !!} {!! ucwords($post->lastname) !!}</a> 
       <div class="text-xxs font-thin text-muted">{!! \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $post->PostAt)->diffForHumans() !!}</div> 
       </div> 
      </div> 
      <!-- ONDERSTE MAG ENKEL WEERGEGEVEN WORDEN ALS DE AUTEUR EEN AFBEELDING HEEFT BIJGEVOEGD --> 
      <!--<div class="item"> 
       <img src="PATH NAAR AFBEELDING" class="w-full" alt="Afbeelding"> 
      </div> 

      <a md-ink-ripple="" class="md-btn md-raised md-fab red m-r md-fab-offset pull-right bg-red waves-effect"><i class="material-icons" style="font-size:22px;padding-top:12px;color:white;">favorite</i></a>--> 
      <!-- BOVENSTAANDE A TAG MOET EEN LIKE KNOP VOORSTELLEN --> 
      <!-- HIER EINDIGT HET STUK DAT ENKEL MAG WEERGEGEVEN WORDEN WANNEER ER EEN FOTO BIJGEVOEGD IS! --> 
      <div class="card-body"> 
       <p> 
       {!! nl2br(e($post->description)) !!} 
       </p> 
       <p style="color:grey;font-size:10px;">Aantal likes - {!! \Cussion\SocialReaction::where('post_id', $post->PostID)->count() !!} {!! (\Cussion\SocialReaction::where('post_id', $post->PostID)->count() == 1) ? 'reactie' : 'reacties' !!} </p> 
       <p style="font-size:14px;">Leuk vinden</p> <!-- KNOP OM STATUS TE LIKEN --> 
      </div> 

      <div class="list-group no-radius no-border" style="background-color:#F5F5F5;"> 

@foreach($comments as $comment) 
@if($comment->post_id == $post->PostID) 
       <div class="md-list-item"> 
       <div class="md-list-item-left"> 
        <img src="{!! asset('avatars/'.$comment->image) !!}" class="w-full circle"> 
       </div> 
        <div class="md-list-item-content"> 
        <small class="font-thin">{!! ucwords($comment->firstname) !!} {!! ucwords($comment->lastname) !!}</small> 
        <div class="text-xxs font-thin text-muted" style="font-size:12px;">{!! nl2br(e($comment->description)) !!}</div> 
        <div class="text-xxs font-thin text-muted" style="font-size:10px;">{!! \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $comment->PostAt)->diffForHumans() !!}</div> 
        </div>     
       </div> 
@endif 
@endforeach 

       <div class="md-list-item"> 
       <form action="{!! url('/dashboard') !!}" method="post" role="form"> 
       {!! csrf_field() !!} 
       <div class="input-group"> 
        <input type="text" class="form-control" name="message" placeholder="Wat wil je reageren?"> 

        <input type="hidden" name="post_id" value="{!! $post->PostID !!}"> 

        <span class="input-group-btn"> 
        <button class="btn btn-default" type="submit">Reageer</button> 
        </span> 
       </div> 
       </form> 
       </div> 

      </div> 

      </div> 
     </div> 
     </div> 
@endforeach 

Так что я Acctually хочу сделать это,

удаление всего этого HTML кода ..

Поэтому, когда я нажимаю 'delete', он должен удалить сообщение, видимое для пользователя.

Я уже пробовал много, но ничего не работает, и я не могу его устранить.

Было бы неплохо, если бы оно имело некоторые эффекты, но не обязательно.

Спасибо!

Answer 1

Вы забыли часть селектора ID (#) - $('post_'+postid).remove(); Должен быть изменен на $('#post_'+postid).remove();