我在MVC中有一个局部视图,如下所示:
<div id="comments">
...
</div>
在div中,有一个表单使用AJAX调用控制器并返回相同的局部视图.问题是调用视图的结果替换了div的内容,而不是整个div,我最终得到:
<div id="comments">
<div id="comments">
...
</div>
</div>
我在ASP.Net MVC和AJAX中的一周经验可以考虑的唯一解决方案是将div放在局部视图之外并使局部视图仅包含内部部分,但是表单将引用外部的id查看表单所在的位置,打破了我留在那里的小封装.有没有更好的解决方案？
有没有办法从局部视图添加CSS引用到页面,并让它们在页面中呈现<head>(根据HTML 4.01规范的要求)？
c# asp.net-mvc partial-views webforms-view-engine asp.net-mvc-2
使用MVC3中的Razor视图引擎,
是否有可能呈现传统的ascx？
我期待能够做到这样的事情:
@Html.RenderPartial("Footer.ascx")
假设您在页面中有人员A列表和人员B列表.这两个是L2S中的单独类,代表两个不同的表.因此,您无法传递单个模型,如下所示:
...
@model PeopleA
...
@foreach(var peopleA in Model.People) ...
@foreach(var peopleB in //what?)
因此,我想,我有三个选择可以遵循.
RenderAction帮助程序传递模型.因为我只会使用这些部分视图一次此选项似乎不吸引我.ModelMyPage.cs
public List<PeopleA> peopleA { get; set; }
public List<PeopleB> peopleB { get; set; }
MyController.cs
...
ModelMyPage m = new ModelMyPage();
m.peopleA = // query
m.peopleB = // another query
return(m);
你明白了.这是完成我的任务的有效方法还是有更好的c#方式来做我想要的？
我有一个非常直接的形式,将个人数据作为部分视图呈现在表单的中心.我无法通过客户端验证来处理此表单.我开始追逐生成html,并提出了在标准表单和局部视图上呈现的相同模型字段.
我注意到输入元素在第一次调用@ html.partial时正确填充,以下仅在通过ajax请求重新加载partialview时发生.
首先是我的局部视图的标题,这是在主页面上的Ajax.BeginForm中.
@model MvcMPAPool.ViewModels.EventRegistration
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function ()
{
$(".phoneMask").mask("(999) 999-9999");
});
</script>
@{
var nPhn = 0;
var dTotal = 0.0D;
var ajaxOpts = new AjaxOptions{ HttpMethod="Post", UpdateTargetId="idRegistrationSummary", OnSuccess="PostOnSuccess" };
Html.EnableClientValidation( true );
Html.EnableUnobtrusiveJavaScript( true );
}
这是部分视图中的剃刀标记:
@Html.ValidationMessageFor(model=>Model.Player.Person.Addresses[0].PostalCode)
<table>
<tr>
<td style="width:200px;">City*</td>
<td>State</td>
<td>Zip/Postal Code</td>
</tr>
<tr>
<td>@Html.TextBoxFor(p=>Model.Player.Person.Addresses[0].CityName, new { style="width:200px;", maxlength=50 })</td>
<td>
@Html.DropDownListFor(p=> Model.Player.Person.Addresses[0].StateCode
, MPAUtils.GetStateList(Model.Player.Person.Addresses[0].StateCode))</td>
<td>
<div class="editor-field">
@Html.TextBoxFor(p=>Model.Player.Person.Addresses[0].PostalCode, new { style="width:80px;", maxlength=10 })
</div>
</td>
</tr> …我正在为asp.net MVC布局页面设置共享内容(导航).
这是我的部分视图"_LayoutPartial.cshtml",其中包含从模型中提取导航数据的代码.
@model MyApp.Models.ViewModel.LayoutViewModel
<p>
@foreach (var item in Model.navHeader)
{
//Test dump of navigation data
@Html.Encode(item.Name);
@Html.Encode(item.URL);
}
</p>
以下是我的控制器"LayoutController.cs"的代码.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MyApp.Models.ViewModel;
namespace MyApp.Controllers
{
public class LayoutController : Controller
{
//
// GET: /Layout/
LayoutViewModel layout = new LayoutViewModel();
public ActionResult Index()
{
return View(layout);
}
}
}
这是"_Layout.cshtml"页面的代码.我试图使用Html.RenderAction(Action,Controller)方法在这里调用局部视图.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<p>
@{Html.RenderAction("Index","Layout");}
</p>
@RenderBody()
</body>
</html>
当布局页面执行@ {Html.RenderAction("索引","布局");}行时,它会抛出一条错误消息"错误执行处理程序的子请求'System.Web.Mvc.HttpHandlerUtil + …
我试图使用局部视图来表示我的项目中的表行.我现在有
<table>
<thead>
<tr>
<th >
Column 1
</th>
<th >
Column 2
</th>
<th >
Column 3
</th>
</tr>
</thead>
<tbody>
@foreach(var item in Model.Items)
{
@Html.Action("ItemCalculatedView", new { Id = item.Id})
}
</tbody>
</table>
在我看来,我有这个
@using (Ajax.BeginForm("SaveStuff", "Whatever",
new { id = @Model.Id }, new AjaxOptions()
{
HttpMethod = "Post",
OnSuccess = "Success"
}))
{
@Html.HiddenFor(m => m.Id)
<tr>
<td>
@Html.Label("Col1", Model.Col1)
</td>
<td>
@Html.TextBox("Number", Model.Number)
</td>
<td>
<input type="submit" id='submit-@Model.Id'/>
</td>
</tr>
}
我怎样才能做到这一点？
过去,每当我想通过Ajax更新我的视图的一部分时,我就完成了以下工作:
#tracksremove_track更新所有值等,然后添加format.jsremove_track.js.erb,其中包含以下内容:$('#tracks').html("<%=j render 'cds/show_tracks' %>");remote: true在调用此操作的链接中设置.这一切都很好,但现在我试图index使用常规destroy方法删除和更新公共视图的灵活性,这意味着我可以通过Ajax或通常调用此方法.我认为这样做很常见,必须有比上述所有方法更好的方法.
我可以destroy.js.erb通过简单地将它放入控制器来获取destroy方法来调用我的文件:
format.js { layout: false }
当然还要设置remote: true链接.
我不能做的是让视图刷新.我要刷新的表包含在具有唯一ID的div中,但由于它不是部分ID,因此它拒绝刷新内容.也许我错过了什么.
我注定要创建一个局部并使用上面的方法刷新它,还是有更神奇的方法(除了使用Turbolinks)？
谢谢.
PS
此外,我只是注意到这有一个额外的缺点,我不能将其余的参数传递给destroy方法,因为它只使用常规CRUD路由传递对象ID来销毁.如果我尝试使用platform(action: destroy)或platform(method: delete)我收到错误:
No route matches {:action=>"destroy", :controller=>"platforms"}
这意味着如果我想传递这些参数,我必须创建一个新路线...
所有这一切的另一个缺点是我在destroy方法中再次重复了我在索引方法中搜索和排序的所有逻辑.我确信这绝对不是这样做的方法.
我有一个包含登录表单的部分视图.我想将它从ajax调用渲染到我的控制器.
这是我将返回部分视图的示例:
postlogin: function (req,res) {
var username = req.param('username');
var password = req.param('password');
User.find({
username: username,
password: password.salt()
}).done(function(err, users){
if(users.length == 1){
// Here I want to return a partial view, not a view
res.view('home/login', {message: 'Login success!'});
}else{
// Here I want to return a partial view, not a view
res.view('home/login', {message: 'Login failed!'});
}
});
},
我正在为MVC创建一个动态菜单系统,只是为了使它工作,我创建了一个菜单的局部视图,它使用下面的语法很好用:
@Html.RenderPartial("_Menu", (Models.Menu)ViewBag.MainMenu)
但是,为此,我必须在每个Controller和每个操作的ViewBag中设置MainMenu和FooterMenu(或任何其他菜单).为了避免这种情况,我想知道是否有推荐的事件可以全局访问ViewBag.如果没有,有人建议将Menu对象传递给会话变量吗？这对我来说听起来不对,但我现在才想到的事情.
更新:
_Layout.cshtml - 我包含对Action的新调用:
@Html.Action("RenderMenu", "SharedController", new { name = "Main" })
SharedController.cs - 添加了新动作:
public ActionResult RenderMenu(string name)
{
if (db.Menus.Count<Menu>() > 0 && db.MenuItems.Count<MenuItem>() > 0)
{
Menu menu = db.Menus.Include("MenuItems").Single<Menu>(m => m.Name == name);
return PartialView("_MenuLayout", menu);
}
else
{
return PartialView("_MenuLayout", null);
}
}
它抛出以下异常:
未找到路径'/'的控制器或未实现IController.
更新2:
所以,问题是我用全名引用了Controller,你只需要控制器的名称减去"Controller".整洁的花絮.所以,对于我的例子,这有效:
@Html.Action("RenderMenu", "Shared", new { name = "Main" })
partial-views ×10
asp.net-mvc ×4
razor ×3
ajax ×2
c# ×2
ascx ×1
asp.net ×1
javascript ×1
menu ×1
node.js ×1
sails.js ×1
validation ×1
viewbag ×1