@extends('layouts.masterLayout.app')
@section('content')
<div class="content-wrapper">
    <section class="content">
        <div class="row">
            <div class="col-xs-12">
                <div class="box">
                    <div class="box-header">
                        <h3 class="box-title">Create Group</h3>
                    </div><!-- /.box-header -->
                    <div class="box-body">
                        <form  method="post" action="{{route('admin.groups.store')}}">
                            @csrf
                            <div class="row">
                            <div class="col-sm-6">
                                <!-- text input -->
                                <div class="form-group">
                                <label>Group Name</label>
                                <input name="group_name" type="text" class="form-control required" placeholder="Enter Group Name">
                                @if($errors->has('group_name'))
                                    <div class="error" style="color: red">{{ $errors->first('group_name') }}</div>
                                @endif
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label>Trainers</label>
                                    <select class="form-control"   class="required"  name="trainer_id">
                                        <option>Select Trainer</option>
                                        @foreach ($trainers as $trainer)
                                        <option value="{{$trainer->id}}">{{$trainer->name}}</option>
                                        @endforeach
                                    </select>
                                    @if($errors->has('trainer_id'))
                                    <div class="error" style="color: red">{{ $errors->first('trainer_id') }}</div>
                                @endif
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label>Players</label>
                                    <select class="form-control " id="slect" multiple class="required"    name="player_id[]">
                                        <option>Select Player</option>
                                        @foreach ($players as $player)
                                        <option value="{{$player->id}}">{{$player->user->name,'.',$player->user->middle_name}}</option>
                                        @endforeach
                                    </select>
                                    @if($errors->has('player_id'))
                                    <div class="error" style="color: red">{{ $errors->first('player_id') }}</div>
                                @endif
                                </div>
                            </div>
                            </div>
                            <div class="row">
                            <div class="col-sm-6">
                                <!-- select -->
                                <div class="form-group">
                                <label>Notification Type</label>
                                <select class="form-control required" name="notification_type">
                                    <option value="phone">Phone</option>
                                    <option value="email">Email</option>
                                </select>
                                </div>
                            </div>
                            </div>
                    </div>
                    <div class="box-footer">
                            <button type="submit" class="btn btn-primary">Submit</button>
                    </div>
                </form>
                </div><!-- /.box -->
            </div><!-- /.col -->
        </div><!-- /.row -->
    </section>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js" defer></script>
<script>
 $(document).ready(function(){
        $('#slect').select2();
    });
</script>
@endsection