Средство выбора даты и времени не работает в динамическом модале - Laravel

Question

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

каждый модал имеет уникальный идентификатор в соответствии с user id

Моя проблема в поле выбора даты и времени joined_at работает только для первогозапись .. Я знаю, что это происходит потому, что Java-скрипт для средства выбора даты и времени запускается один раз в отличие от модального ... так как это выяснить !!?

Я попытался инициализировать скрипт в модальном файле, но этоне работает

My View

@extends('layouts.master')
@section('content')
<div class="col-md-12">
    <div class="card">
        <div class="card-header d-flex align-items-center">
            <h3 class="card-title">{{ __('site.users') }}</h3>
        </div>
        <!-- /.card-header -->
        <div class="card-body">
            <table>
                <thead>
                    <tr>
                        <th class="th-sm">Id</th>
                        <th class="th-sm">{{ __('site.name') }}</th>
                        <th class="th-sm"> </th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($users as $user)
                    <tr>
                        <td>{{ $user->id }}</td>
                        <td>{{ $user-> name }}</td>

                        <td class="text-center">
                            <a href="#" class="btn btn-default btn-sm" data-toggle="modal" datatarget="#modal-default-{{ $user->id }}">District</a>
                        </td>
                    </tr>
                    @include('dashboard.users.modals.addNdistrict', ['user_id' => $user->id])

                    @endforeach
                </tbody>

            </table>
        </div>
    </div>
</div>

@endsection

Модальный (addNdistrict)

<div class="modal fade" id="modal-default-{{ $user_id }}" style="display: none;" aria-hidden="true">
    <div class="modal-dialog">
        <form action="{{ route('dashboard.users.addNdistrict', $user->id) }}" method="post">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body">
                    <!-- joined_at -->
                    <div class="form-group row">
                        <label for="joined_at" class="col-md-3 col-form-label text-md-left required">{{ __('site.joined_at') }}</label>
                        <div class="col-md-8">
                            <div class="input-group date">
                                <input type="text" name="joined_at" value="{{ old('joined_at') }}"
                                    id="joined-date" class="form-control" data-date-end-date="0d">
                            </div>
                        </div>
                    </div>
                    <!-- ./joined_at -->

                  </div>
                <!--./modal_body-->
                <div class="modal-footer justify-content-between">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary">Save</button>
                </div>
            </div> <!-- /.modal-content -->
        </form>
    </div> <!-- /.modal-dialog -->
</div>

<!-- jQuery -->
<script src="{{ asset('adminlte/plugins/jquery/jquery.min.js') }}"></script>  
<!-- DateTimePicker -->
<script src="{{ asset('adminlte/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js') }}" defer></script>

<script>

    $(document).ready(function () {
        $('#joined-date').datepicker({
            todayHighlight: true,
            todayBtn: "linked",
            format: "yyyy-m-d",
            autoclose: true,
        });
    }); //document

</script>