Как использовать окно поиска в модальном диалоговом окне, как отобразить результаты поиска без перезагрузки всей страницы? - PullRequest
0 голосов
/ 21 мая 2019

Прежде всего, у меня есть частичная страница для создания пользователя, и она содержит модальное всплывающее окно для выбора основного контакта пользователя (который является человеком).В этом диалоговом окне у меня есть окно поиска, чтобы человек мог искать контакт по его имени.

Я могу выполнить поиск, но мой код реализован так, что когда я получаю результатыиз метода поиска я перезагружаю всю страницу.Поэтому, когда я получаю результаты, он закрывает диалоговую страницу, и мне приходится снова открывать ее, чтобы увидеть результаты.Как я могу просто отобразить результаты поиска без перезагрузки всей страницы?

ОБНОВЛЕНИЕ

Я добавил логическое свойство в модель главной страницы, чтобы всякий раз, когдапользователь ищет контакт, когда страница перезагружается, он устанавливает для нового свойства значение true, и это должно заставить модал снова всплыть.Это не работает, так как я не знаю, как заставить открытие модального ... какие-либо подсказки?

Это с главной страницы `

@if (Model.SearchedForContact)
            {
                <script>
                    $(function () {
                        $("#find-contact").modal("show");
                    });
                </script>
            }

Это моё модальное всплывающее окно:

<div class="modal fade" id="find-contact">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button data-dismiss="modal" class="close"><span>&times;</span></button>
            <h3>My Title</h3>
        </div>
        <div class="modal-body">
            @using (Html.BeginForm("SearchUser", "User", FormMethod.Get))
            {
                @Html.TextBoxFor(m => m.ContactName)<input type="submit" value="Search" /> // Search button calls the search method from the controller
            }
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>Header</th>
                    </tr>
                </thead>
                <tbody>
                    @if (Model.ContactOptions == null || Model.ContactOptions.Count() == 0)
                    {
                        <tr>
                            <td style="color: red">
                                No Result
                            </td>
                        </tr>
                    }
                    else
                    {
                        foreach (var option in Model.ContactOptions)
                        {
                            //displays the first and last name of each item in the result list
                        }
                    }
                </tbody>
            </table>
        </div>
        <div class="modal-footer">
            <a href="#" class="btn" data-dismiss="modal">Close</a>
            <a href="#" class="btn btn-primary">Save</a>
        </div>
    </div>
</div>

Это мой метод поиска от моего контроллера

public ActionResult SearchUser(UserCreationModel model)
    {
        model.ContactOptions = //call to my database to return a list where the name contains the searched name
        return PartialView("_CreateUser", model);
    }

Я довольно новичок в кодировании, поэтому я понимаю, что, возможно, мне придется использовать какой-нибудь ajax или jquery, но я не знаю, с чего начать и как его реализовать.Пожалуйста, помогите мне!

Спасибо.

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