重新加载后如何将数据传递给局部视图
Posted
技术标签:
【中文标题】重新加载后如何将数据传递给局部视图【英文标题】:How to pass data to partial view after reload 【发布时间】:2014-12-16 16:07:52 【问题描述】:控制器:
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]
public class ExperimentalController : Controller
public ActionResult ReloadTest1()
string temp = DateTime.Now.ToString();
ViewBag.Time = temp;
return View();
public PartialViewResult ReloadTest1Partial()
string temp = DateTime.Now.ToString();
ViewBag.Time = temp;
return PartialView();
查看:
@
ViewBag.Title = "ReloadTest1";
string time = this.ViewBag.Time;
ViewData["date"] = time;
ViewBag.TheTitle = "test";
<h2>ReloadTest1</h2>
<select id="iSelect" name="iSelect" >
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
<div id="myPartialViewContainer">
@html.RenderPartial("_ReloadTest1Partial", null, new ViewDataDictionary "vb", ViewBag);
</div>
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script>
$('#iSelect').on('change', function ()
$("#myPartialViewContainer").load('@(Url.Action("ReloadTest1Partial", "Experimental", null, Request.Url.Scheme))')
)
</script>
局部视图:
@
var vb = ((dynamic)ViewData["vb"]);
<div>
<span>@vb.Time</span>
</div>
什么不起作用:
将 viewbag/viewdata 直接从控制器传递到局部视图,因为 mvc 不接受这种情况。
什么是有效的:
从上面的代码可以看出,局部视图通过 Html.RenderPartial 方法和 viewbag 传下来一次获取数据。 重新加载确实对下拉列表中所选对象的更改起作用
需要什么:
我需要在重新加载或之后将数据传递给部分视图,这主要是一个测试设置,但我最终希望能够根据选择值更新表。
如果有人能够给我一个工作示例,请这样做。
【问题讨论】:
您可以展示您的ReloadTest1Partial
操作吗?
控制器中已经存在
【参考方案1】:
在您的控制器中,您正在使用 ViewBag
设置自定义值,但在您看来,您正在使用 ViewData
以及引用不同的名称(您正在控制器中设置 ViewBag 的 Time 属性,但您期望 ViewData 在视图中的 vb 属性)。
将视图更改为期望模型`:
@model MyModel
@
string time = "";
if (ViewData["Time"] != null)
time = ViewData["Time"];
<div>
<span>@Model.Time</span>
</div>
并更改您的控制器以通过它:
public ActionResult ReloadTest1()
var model = new MyModel Time = DateTime.Now.ToString();
return View(model);
public PartialViewResult ReloadTest1Partial()
var model = new MyModel Time = DateTime.Now.ToString();
return PartialView(model);
您的主视图文件将如下所示:
@model MyModel
<div id="myPartialViewContainer">
@Html.RenderPartial("_ReloadTest1Partial", model);
</div>
然后创建你的模型:
public class MyModel
public string Time get;set;
另一方面,最好使用强类型 model
而不是 ViewBag
或 ViewData
,因为您可能会遇到编译错误和 IntelliSense
【讨论】:
viewbag not 不能从控制器传递到 partial 视图,这正是我需要通过 html 字典传递它的原因。部分渲染 但最正确的选择是使用model
ViewData 也不能从控制器传递到局部视图,时间没有更新。但是 html.renderpartial 更改确实有效。一个模型的例子会很好。主要问题是我可以让数据通过或重新加载工作,但两者都无法同时发生。
我添加了一个模型示例
当我添加 location.reload();时间用视图数据和模型更新,但它确实重置了所有不是我想要的元素。【参考方案2】:
最终解决方案:
控制器:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.Web;
using System.Web.Mvc;
namespace RolloutTool.Controllers
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]
public class ExperimentalController : Controller
public ActionResult ReloadTest1()
var model = new RolloutTool.Models.ExperimentalViewModels.MyModel Time = DateTime.Now.ToString() ;
string temp = DateTime.Now.ToString();
ViewBag.Time = temp;
ViewData["Time"] = temp;
return View(model);
[HttpPost]
public PartialViewResult ReloadTest1Partial(string test)
var model = new RolloutTool.Models.ExperimentalViewModels.MyModel Time = DateTime.Now.ToString() ;
string temp = DateTime.Now.ToString();
ViewBag.Time = temp;
ViewData["Time"] = temp;
return PartialView("_ReloadTest1Partial", model);
// GET: Experimental
public ActionResult Experimental()
ViewBag.Message = "Your contact page.";
ViewBag.TestValue = 10;
string[] temp = "alpha", "beta", "gamma", "delta" ;
ViewBag.names = temp;
int temp2 = temp.Length;
ViewBag.nameslength = temp2;
return View();
查看:
@
ViewBag.Title = "ReloadTest1";
string time = this.ViewBag.Time;
ViewData["date"] = time;
ViewBag.TheTitle = "test";
@model RolloutTool.Models.ExperimentalViewModels.MyModel
<h2>ReloadTest1</h2>
<select class="chosen-select" id="iSelect" name="iSelect">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
<div id="myPartialViewContainer">
@Html.RenderPartial("_ReloadTest1Partial", Model);
</div>
@Styles.Render(
"~/content/chosen/chosen.css",
"~/content/chosen/prism.css",
"~/content/chosen/style.css",
"~/content/bootstrap.css",
"~/content/Site.css")
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/chosen/chosen.jquery.js"></script>
<script src="~/Scripts/chosen/prism.js"></script>
<script>
var config =
'.chosen-select': ,
'.chosen-select-deselect': allow_single_deselect: true ,
'.chosen-select-no-single': disable_search_threshold: 10 ,
'.chosen-select-no-results': no_results_text: 'Oops, nothing found!' ,
'.chosen-select-width': width: "95%"
for (var selector in config)
$(selector).chosen(config[selector]);
</script>
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script>
$('#iSelect').on('change', function ()
getPartial();
)
</script>
<script>
function getPartial()
var tempSelect = document.getElementById("iSelect");
var tempResult = tempSelect.options[tempSelect.selectedIndex].text;
$.ajax(
url: "ReloadTest1Partial",
type: "POST",
data: 'test' = tempResult, //if you need to post Model data, use this
success: function (result)
$("#myPartialViewContainer").html(result).find("select").each(function ()
$(this).chosen();
);
</script>
@
string time = "";
string temp = "";
if (ViewData["vb"] != null)
temp = "1";
time = ((dynamic)ViewData["vb"]).Time;
else if (ViewContext.Controller.ViewBag.Time != null)
temp = "2";
time = ViewBag.Time;
else if (ViewData["Time"] != null)
temp = "3";
time = (string) ViewData["Time"];
@model RolloutTool.Models.ExperimentalViewModels.MyModel
<div>
<span>@time</span>
<span>@Model.Time</span>
<span>@temp</span>
</div>
<select class="chosen-select"></select>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/chosen/chosen.jquery.js"></script>
<script src="~/Scripts/chosen/prism.js"></script>
这会正确更新局部视图并重新加载选择的选择下拉菜单。 (见styles and scripts not working in partial view)
【讨论】:
以上是关于重新加载后如何将数据传递给局部视图的主要内容,如果未能解决你的问题,请参考以下文章