Показать данные на основе выпадающего выбора не работает

#jquery #laravel

#jquery #laravel

Вопрос:

У меня есть таблица категорий и таблица клубов, связь между

  • В категории много клубов
  • в 1 категории может быть много клубов
  • у 1 клуба есть 1 категория

Я хочу показать клубы на основе категории, которая будет выбрана из выпадающего списка, поэтому другие клубы будут скрыты. Смотрите Скриншот для большего понимания введите описание изображения здесь

  1. Мой контроллер (у меня нет проблем с получением имен категорий в выпадающем списке):
     public function club()
    {
        $categories_name = Category::pluck('category_name','id'); 
        $user_id = auth()->user()->id;
        $user = User::find($user_id);
        $data = array(
            'user_clubs' => $user->clubs,
            'categories_name' => $categories_name
        );
        return view('pages.dashboard.club_dashboard')->with($data);
    }
  
  1. Мое мнение
 <div class="form-group">
        <strong>{{Form::label('categories_name', 'Select Category')}}</strong>
        {{Form::select('categories_name', $categories_name, null, ['class' => 'form-control'], array('name'=>'categories_name[]'))}}
</div>

@if (count($user_clubs)>0)
<table class="table table-striped">
    <tr>

        <th><strong>Club Name</strong></th>
        <th></th>
        <th></th>
    </tr>
    @foreach ($user_clubs as $club)
    <tr id="{{$club->category->id}}">
        <th>{{$club->club_name}} | {{$club->category->category_name}} </th>
        <td><a href="/clubs-soc/lists/{{$club->id}}/edit" class="btn btn-warning">Edit</a></td>
        <td>
            {!!Form::open(['action' => ['ClubsController@destroy', $club->id], 'method' => 'POST', 'class' => 'float-right'])!!} 
            {{Form::hidden('_method','DELETE')}} 
                {{Form::submit('Delete', ['class' => 'btn btn-danger'])}} 
            {!!Form::close()!!}
        </td>
    </tr>
    @endforeach
</table>
@else
<p>You Have No posts</p>
@endif
  

3. Модель категории

 class Category extends Model
{
    public function user(){
        return $this->belongsTo('AppUser');
    }

    public function clubs(){
        return $this->hasMany('AppClub');
    }
}
  

4. Модель клуба

 class Club extends Model
{
    public function user(){
        return $this->belongsTo('AppUser');
    }

    public function category(){
        return $this->belongsTo('AppCategory');
    }
}
  

5.My Сценарий
Я написал этот скрипт из ответа, данного другом, он все еще не работает, пожалуйста, помогите мне найти:

  • Где я допустил ошибку?
  • Куда я должен поместить скрипт?
 <script>
    $(document).ready(function(){
        $("#categories_name").on("change", function(){
            var category_id = $(this).val();
            $("table tr").each(function(index){
                if (index != 0) {
                    $row = $(this);
                    if ($row.attr('id')!=category_id) {
                        $row.hide();
                    }
                    else {
                        $row.show();
                    }
                }
            });
        });
    });​
</script>
  

Комментарии:

1. Строки вашей таблицы не имеют атрибута id, но вместо id вы должны использовать либо атрибуты data- *, либо классы css. Идентификаторы элементов должны быть уникальными.

2. @DigitalDrifter Я обновил, пожалуйста, проверьте, все еще не работает