ASP.NET MVC - 如何在发布数据后重新加载相同的视图？

Question

我有一个视图，其中包含一个 Google 地图，该地图具有默认缩放级别和在某个国家/地区设置的位置。在地图上显示的默认位置来自数据库，我所做的是我有一个 [HttpGet]Index 操作来获取此信息，将其发送到视图，然后在视图中我使用 JS 绘制地图（通常google地图东东画个简单的地图）。

然后就在地图上方 div，我显示了一个文本框和一个搜索按钮。所以用户输入地址并按下搜索按钮，我 post 文本框的值到 [HttpPost]Index 操作。现在我想将此值传递给 [HttpGet]Index 操作，以便它从该地址的数据库中获取数据，将其发送到索引视图，以便重新绘制地图，并将该特定地址设置为地图的中心，并且也在文本框中显示地址。

关于如何执行此操作的任何建议？

我尝试过（但没有用）的方法是调用 Get 版本的 Index 操作，并使用 TempData 字典将地址传递给它。但我只看到 empty/blank 页面。

这是我的 HttpGet Index 操作的样子：

[HttpGet]
public async Task<ActionResult> Index()
{
    // I fetch the info from DB here put it inside ViewBag and call the view    
            return View();
}

这会正确加载信息，并且当 URL controller/Index 在浏览器中第一次被点击时，地图会按原样绘制。

文本框和搜索按钮的标记是：

<form class="form" id="searchForm" action="@Url.Action("Index", "Default")" method="post">
<div class="form-group">
    <div class="row">
        <div class="col-xs-9 col-sm-9 col-md-10">
           <label for="address" class="sr-only">Search for address</label>
           <input type="text" class="form-control" id="address" placeholder="Search for address" name="address">
         </div>
    <div class="col-xs-3 col-sm-3 col-md-2">
    <input type="submit" class="btn btn-block btn-success" value="Search" />
    </div>
   </div>
</div>
</form>

最后是 HttpPost 索引操作：

[HttpPost]
public void Index(String address)
{
   TempData["address"] = address;
   Index();
}

所以当我提交表单时，我希望它得到 posted 到 HttpPost Index 操作，然后它将值传递给它的 HttpGet 版本，它最终将从数据库中获取数据并获得查看更新的地图。但是我看到的只是一个空白页。

有什么帮助吗？

Answer 1

那样

[HttpPost]
public void Index(String address)
{
   TempData["address"] = address;
   RedirectToAction("Index");
}

你看到它是空白的，因为你正在重定向 RedirectToAction("Index"); 并将数据存储在 TempData 中，而你没有在索引 Get 方法中使用它

[HttpGet]
public async Task<ActionResult> Index()
{
    // I fetch the info from DB here put it inside ViewBag and call the view   
    // you must check for the temp data
    if (!string.IsNullOrWhiteSpace(TempData["address"].ToString()))
    {
         ViewBag["result"] = TempData["address"];
         //and use you viewbag data in the view
    }
    return View();
}

Answer 2

我告诉你的那个机制......

如果我有地址实体

public class Address
{
    public int Id { get; set; }
    public string Street { get; set; }
    public string House { get; set; }
    public int Floor { get; set; }
}

这是控制器的动作AddressController

[HttpGet]
public ActionResult Index()
{
    var model = new SearchAddressesViewModel();

    // you can here also fetch all the addresses in your db ... 
    //but this is not a good approach also, but if you need to do that it's easy

    // fetch data base and get all addresses
    //model.AddressesFound = db.Addresses.Select(a => new AddressModel
    //{
    //    Street = a.Street,
    //    House = a.House,
    //    Floor = a.Floor
    //}).ToList();

    return View(model);
}

[HttpPost]
public ActionResult Index(SearchAddressesViewModel model)
{
    if (!ModelState.IsValid)
        return View(model);

    // fetch data base and get addresses based on the search criteria in 
    //model.SearchCriteria
    // for example:
    //var addresses = db.Addresses.Where(a => a.Street == model.SearchCriteria);

    //add found addresses to model

    //model.AddressesFound = addresses.Select(a => new AddressModel
    //{
    //    Street = a.Street,
    //    House = a.House,
    //    Floor = a.Floor
    //}).ToList();

    return View(model);
}

这是我的观点Index.cshtml

@model SearchAddressesViewModel

@using (Html.BeginForm("Index", "Address", FormMethod.Post))
{
    @Html.LabelFor(m => m.SearchCriteria);
    @Html.TextBoxFor(x=>x.SearchCriteria);
    @Html.ValidationMessageFor(m => m.SearchCriteria, "");

    <br />
    <input type="submit" class="btn btn-block btn-success" value="Search" />
}

@if (Model.AddressesFound != null)
{
    <table>
        <thead>
            <tr>
                <th>Street</th>
                <th>House</th>
                <th>Floor</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model.AddressesFound)
            {
                <tr>
                    <td>@item.Street</td>
                    <td>@item.House</td>
                    <td>@item.Floor</td>
                </tr>
            }
        </tbody>
    </table>
}

这里是我使用的视图模型 SearchAddressesViewModel 和 AddressModel

public class SearchAddressesViewModel
{
    [Required]
    [Display(Name = "Search for address")]
    public string SearchCriteria { get; set; }

    public IList<AddressModel> AddressesFound { get; set; }
}

public class AddressModel
{
    public string Street { get; set; }
    public string House { get; set; }
    public int Floor { get; set; }
}

您也可以根据您的情况在视图中使用部分视图 AddressModel。

我希望你明白我的意思...谢谢你

ASP.NET MVC - 如何在发布数据后重新加载相同的视图？

ASP.NET MVC - how to reload same view after posting data?

forms

postback

asp.net-mvc-5