Mik*_*sen 14 asp.net-ajax razor asp.net-mvc-3
我试图使用asp.net mvc3创建一个.
我有一个带有一些选项的下拉列表.我想要的是要注入页面的不同局部视图,具体取决于下拉列表中的选择.
但.我不希望这依赖于提交动作.它应该起作用,一旦从选择列表中选择,就会加载局部视图.
我有这个代码:
@using (Ajax.BeginForm("Create_AddEntity", new AjaxOptions {
UpdateTargetId = "entity_attributes",
InsertionMode = InsertionMode.Replace
}
))
{
<div class="editor-label">
@Html.Label("Type")
</div>
<div class="editor-field">
@Html.DropDownList("EntityTypeList", (SelectList)ViewData["Types"])
</div>
<div id="entity_attributes"></div>
<p>
<input type="submit" value="Create" />
</p>
}
但是当下拉列表选择发生变化时,我无法弄清楚如何触发此部分视图加载.
这一点是表单对于不同的"实体类型"是不同的.因此将根据下拉选择加载不同的局部视图.
任何人有任何指针？
emr*_*azi 34
让我们假设你想要插入部分内容.
<html>
<head><head>
<body>
<!-- Some stuff here. Dropdown and so on-->
....
<!-- Place where you will insert your partial -->
<div id="partialPlaceHolder" style="display:none;"> </div>
</body>
</html>
在您的下拉列表的更改事件中,通过jquery ajax调用获取部分并将其加载到占位符.
/* This is change event for your dropdownlist */
$('#myDropDown').change( function() {
/* Get the selected value of dropdownlist */
var selectedID = $(this).val();
/* Request the partial view with .get request. */
$.get('/Controller/MyAction/' + selectedID , function(data) {
/* data is the pure html returned from action method, load it to your page */
$('#partialPlaceHolder').html(data);
/* little fade in effect */
$('#partialPlaceHolder').fadeIn('fast');
});
});
在您的控制器操作(/ Controller/MyActionin上面的jquery)中,返回您的局部视图.
//
// GET: /Controller/MyAction/{id}
public ActionResult MyAction(int id)
{
var partialViewModel = new PartialViewModel();
// TODO: Populate the model (viewmodel) here using the id
return PartialView("_MyPartial", partialViewModel );
}