嗨,我想尝试使用mvc 3来掌握ajax.beginform.
我有两个表单,一个HTML.BeginForm可以正常工作,一个Ajax.BeginForm在局部视图中.ajax表单的帖子是为模型添加注释.
问题是ajax提交是在主视图中提交包括HTML.BeginForm在内的整个页面而不是用note来执行异步帖子.
谁能看到我做错了什么？
我看了其他问题,并在web.config等中禁用了不显眼的javascript.
视图:
<div id="maincontent">
@using (Html.BeginForm())
{
@Html.ValidationSummary(true)
<fieldset>
<legend>Edit Franchise</legend>
<div class="editor-label">
@Html.LabelFor(model => model.Name)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Name)
@Html.ValidationMessageFor(model => model.Name)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.FirstLine)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.FirstLine)
@Html.ValidationMessageFor(model => model.FirstLine)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.SecondLine)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.SecondLine)
@Html.ValidationMessageFor(model => model.SecondLine)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.City)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.City)
@Html.ValidationMessageFor(model => model.City)
</div>
<div class="editor-label">
@Html.LabelFor(model => …我有一个对话框,其中有选项卡.在其中一个选项卡中,显示用户输入的地址.还有一个按钮,允许用户添加新地址.当用户单击该按钮时,当前选项卡的内容将替换为"添加"视图.
我在这里要完成的是允许用户添加地址,一旦他们点击确定,表单应该通过AJAX调用提交,然后应该使用"索引"视图的内容更新选项卡(显示用户的地址).
不幸的是,这不能正常工作.它不是通过AJAX调用提交表单,而是进行常规的后期操作,并在白色背景上显示索引视图,而不是在选项卡中显示.
这是我的代码:
[HttpPost]
public ActionResult Add(AddressDto model)
{
if(!ModelState.IsValid)
{
return PartialView(model);
}
Area area = null;
if(!string.IsNullOrEmpty(model.Area))
{
area = _addressService.GetAreaByName(model.Area);
}
var newAdd = new Address
{
Details = model.Details,
Name = model.Name,
IsDefaultAddress = false,
CountryName = _addressService.GetCountryById(int.Parse(model.Country)).Name,
User = _helper.GetUserFromSession(HttpContext.User.Identity.Name)
};
if(area != null)
area.Addresses.Add(newAdd);
else
_addressService.Create(newAdd);
_unitOfWork.Commit();
var indexViewModel = PrepareIndexView();
return PartialView("Index", indexViewModel);
}
private UserLocationViewModel PrepareIndexView()
{
var nickname = this.HttpContext.User.Identity.Name;
var user = _helper.GetUserFromSession(nickname, true);
var viewModel = Mapper.Map<User, UserLocationViewModel>(user); …我正在尝试使用.Net的Ajax.BeginForm来提交表单并获取对象列表.
@using (Ajax.BeginForm("ValidateEmployee", new AjaxOptions { OnBegin = "onBegin", OnSuccess = "onSucess", UpdateTargetId = "results"} )
问题是,当我的控制器返回一个JsonResult并将我返回的列表转换为json时,永远不会调用OnSuccess回调,并且不会更新我的id为"results"的div.但是调用onBegin回调.控制器看起来像这样.
public JsonResult ValidateEmployee(Employee emp)
{
...
List<Role> roles = new Role();
foreach(var x in myCollection)
{
roles.Add(new Role { ID = x.ID, Name = x.Name });
}
return Json(roles);
}
我已经确认Json(roles)将列表正确转换为有效的json.但我无法使用它,因为onSuccess永远不会运行.
奇怪的是,如果我不列表转换成JSON,就回到它作为.NET名单,这两个回调是碰我的元素,更新输出System.Collections.Generic.List'1 [Models.Role.所以它不是json,我没有办法使用数据.
那么为什么当我从控制器返回一个json对象时没有调用onSuccess？
我正在使用MVC 3,我正在引用jquery.unobtrusive-ajax.js.
谢谢你的帮助.
是否可以在@using(Ajax.BeginForm)代码块中使用@ Html.RenderPartial？如果我使用@ Html.RenderPartial它不起作用,如果我将整个razor代码直接放在@using(Ajax.BeginForm)块中,它就可以工作.
任何人都可以建议是否可能？
为什么表单帖子没有通过ajax发生,而是重新加载到新页面？
我的.js包括:
<script src="/App/JavaScript/Libraries/jquery-1.11.1-min.js"></script>
<script src="/App/JavaScript/Libraries/jquery.validate.js"></script>
<script src="/App/JavaScript/Libraries/jquery.validate.unobtrusive.js"></script>
我的剃刀观点:
<div id="login-partial-update">
@using (Ajax.BeginForm("Login",null, new AjaxOptions
{
UpdateTargetId = "login-partial-update",
HttpMethod = "POST"
}, new { id = "js-form-login" }))
{
@Html.TextBoxFor(x => x.Email, new {placeholder = "Email address"})
<div class="errormessage">
@Html.ValidationMessageFor(x=>x.Email)
</div>
@Html.PasswordFor(x => x.Password, new {placeholder = "Password"})
<div class="errormessage">
@Html.ValidationMessageFor(x => x.Password)
</div>
}
</div>
我的控制器代码:
[HttpPost]
public ActionResult Login(LoginInputModel login)
{
return PartialView("Widgets/Popups/_LoginInput", login);
}
我忘记了什么吗？
在部分视图中提交表单时，如何防止页面重新加载？有很多例子，但似乎没有一个例子对我有用。这就是我所拥有的。局部视图（Razor）调用此：
@using (Ajax.BeginForm("SaveReply", "Home", null, new AjaxOptions { HttpMethod = "Post" }, new { target = "_self" }))
{
<div class="input-group wall-comment-reply" style="width:100%">
@Html.Hidden("eventid", @item.EventID)
<input name="txtReply" type="text" class="form-control" placeholder="Type your message here...">
<span class="input-group-btn">
<button class="btn btn-primary" id="btn-chat" type="submit">
<i class="fa fa-reply"></i> Reply
</button>
</span>
</div>
}
然后在控制器中有我的操作方法：
[HttpPost]
public void SaveReply(string txtReply, string eventid)
{
//some code
}
控制器动作被触发，但是之后它会自动重定向到localhost / home / SaveReply
也许问题在于此局部视图是从字符串渲染的。我从以下代码中获取了代码：
如何在ASP.NET MVC 3中将Razor View呈现为字符串？
除了其他我尝试过的东西：
我将不胜感激任何帮助。
目标:
如果您根据输入检索错误,则应在ValidationSummary中显示与ajax相关的错误,而不会刷新网页.
问题:
我试图制作它,但它不能很好地工作.
我错过了哪一部分？
谢谢!
信息:
*我发现了一些网页,但它们并不完全符合我的目的.
*我正在使用ASP.net mvc
@model WebApplication1.Controllers.PersonnelModel
@{
ViewBag.Title = "Ajax";
}
<h2>Ajax</h2>
<h2>AjaxViewModel</h2>
@using (Html.BeginForm("HtmlViewModel", "Home", null))
{
@Html.ValidationSummary(true)
<fieldset>
<legend>PersonnelModel</legend>
<div class="editor-label">
@Html.LabelFor(model => model.UserName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.UserName)
@Html.ValidationMessageFor(model => model.UserName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.MailAdress)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.MailAdress)
@Html.ValidationMessageFor(model => model.MailAdress)
</div>
</fieldset>
<p>
<input type="submit" value="Html Form Action" />
</p>
}
<br/>
<br />
<h2>AjaxViewModel</h2>
@using (Ajax.BeginForm("AjaxViewModel", "Home", new AjaxOptions { UpdateTargetId = "result" …