Bootstrap 4 модальный не работает / отображается внутри BeginCollectionItem

Question

Мои модальные функции BegiCollectionItem не работают / не отображаются. Как я могу решить эту проблему?

Вот мой код:

// другие tds здесь

 @model SimplyAccounting.Models.TransactionViewModels.JournalDetailsViewModel
@using (Html.BeginCollectionItem("JournalDetailsViewModel"))
{
        <td>
            <a class="btn btn-sm" role="button" href="#" data-toggle="modal" data-target="#@Model.Guid">Others</a>
            <div class="modal fade" id="@Model.Guid" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        //content here
                        </div>
                    </div>
                </div>
            </div>
        </td>
        <td><button type="button" class="btn btn-sm btn-danger" id="delete" name="delete" value="delete" onclick="javascript: deleteBook(document.getElementById('@Model.Guid'))"><i class="far fa-trash-alt"></i></button></td>
    </tr>
}