Остановить распространение нажатия кнопки до разборного div - PullRequest
0 голосов
/ 11 декабря 2019

На моей странице MVC 5 Partial Page CSHTML (фактически частично) у меня есть кнопка, которая открывает модальное диалоговое окно.

@model Project.ViewModels.SomeViewModel

<div>
    <div>
        @for (int i = 0; i < Foo.Count(); i++
        {
            <div class="panel-group">
                <div id="foo_@(Model.Id)_@(i)" class="panel panel-default>
                    <div class="panel-heading">
                        <div data-toggle="collapse" data-target="#bar_@(Model.Id)_$(i)">
                            <span>
                                <a href="#" class="btn btn-danger testButton" data-toggle="modal" data-target="#@("DeleteFooModal" + Model.Foo[i].Id)" title="Delete">
                                    <span class="glyphicon glyphicon-trash"></span>&nbsp;Delete
                                </a>
                            </span>
                        </div>
                    </div>
                </div>
            </div>

            @Html.Partial("_FooDelete", Model.Foo[i]))

            <script>
                $(function () {
                    $(".testButton").on('click', function (e) {
                        e.stopPropagation();
                        $@("#DeleteModuleModal" + Model.Foo[i].Id).modal('show');
                    });
                });
            </script>
        }
    </div>
</div>

_FooDelete.cshtml имеет то, что я хочу отобразить в модальном диалоговом окне. Там нет проблем.

Использование Event.preventDefault() не имеет значения. e.stopPropagation() сам по себе делает это так, что кнопка абсолютно ничего не делает. Когда я добавляю $@("#DeleteModuleModal" + Model.Foo[i].Id).modal('show');, чтобы кнопка по-прежнему показывала модальный режим, он делает так, чтобы щелчок снова распространялся на складную div, вызывая переключение ее свернутого состояния.

Интересно, если я обернуif (false) { } вокруг линии modal('show'), она все еще работает. Не уверен, почему это происходит. Может быть, это смесь Razor C #.

Возможно, есть другой способ показать модальный диалог с помощью jQuery? Исторически это работало просто отлично, когда я вручную добавлял модальное диалоговое окно с помощью Bootbox.js, но в этой ситуации это не работает.

TL; DR: Необходимо запретить нажатие кнопкищелкнув по свертываемому элементу div (свернув его), по-прежнему показывая модальное диалоговое окно

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...