Question

首先，我有一个创建用户的局部页面，它包含一个模式弹出窗口，用于选择用户的主要联系人（即人）。在该对话框中，我有一个搜索框，以便该人可以用其姓名搜索联系人。

我可以进行搜索，但是实现代码的方式是，当我从搜索方法中获得结果时，将重新加载整个页面。因此，当我得到结果时，它会关闭对话框页面，我必须重新打开它才能查看结果。如何仅显示搜索结果而不必重新加载整个页面？

更新

我在主页的模型中添加了一个布尔属性，以便每当用户搜索联系人时，当页面重新加载时，它将新属性设置为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，但是我不知道从哪里开始或如何实现它。请帮帮我！

谢谢。

使用模式对话框中的搜索框，如何显示搜索结果而不重新加载整个页面？

0 个答案: