我的视图中有这个HTML代码
@using (Ajax.BeginForm("AddJoke", "Home", new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "MyfriendsJokes" , InsertionMode= InsertionMode.InsertAfter}))
{
<div style="display:block">
<textarea placeholder="Post New Joke" id="newJoke" name="joke" rows="3" cols="50" style="float:left;position"></textarea>
<button type="submit" id="postnewjoke" style="float:left"> Post </button>
@Html.TextBoxFor(model => model.fileContent, new { type = "file", id = "fileuploaded", name = "fileuploaded" })
<div style="display:inline-block">
<input type="checkbox" name="geo" id="geo" style="width: 100%; float: left; display: block">
<input name="longitude" style="display:none"/>
<input name="latitude" style="display:none" />
<input name="user" style="display:none" value="@Model.user.Id"/>
<span>Include Location</span>
</div>
<span id="jokeError" style="color:red;font-size:14px;"></span>
</div>
}
<article id="MyfriendsJokes">
@Html.Partial("_NewJoke")
</article>
这个代码在我的控制器里
[HttpPost]
public PartialViewResult AddJoke(string joke, string user, HomePage page,HttpPostedFileBase fileuploaded, string longitude, string latitude)
{
Joke newJ = new Joke();
newJ.Key = Guid.NewGuid();
newJ.body = joke;
newJ.facebookID = user;
newJ.rank = 0;
newJ.time = DateTime.Now;
newJ.longitude = longitude;
newJ.latitude = latitude;
db.Jokes.Add(newJ);
HomePage page1 = new HomePage();
page1.user = Session["user"] as MyAppUser;
//db.SaveChanges();
return PartialView("_NewJoke", page1);
}
但是,它没有将元素添加到目标div中,而是用一个新的整页重新加载页面,其中只包含了部分视图的元素,即
@using Jokes.Models
@using Microsoft.AspNet.Mvc.Facebook.Models
@model HomePage
<div style="display:block">
@Model.user.Name
</div>
有人能帮我说一下,在这里添加元素到div而不是加载一个新的页面有什么问题吗?
发布于 2014-01-24 21:33:15
确保在页面中引用了jquery.unobtrusive-ajax.js
脚本。这就是AJAXifies所有由Ajax.*
助手生成的输出。如果没有这个脚本,您只会得到一个由<form>
生成的标准Ajax.BeginForm
元素,其中包含一组data-*
属性。jquery.unobtrusive-ajax.js
脚本分析这些data-*
属性并订阅表单的submit
事件,取消进行完全回发的默认操作,并根据数据-*属性向服务器发送AJAX请求。
值得一提的是,这个脚本必须包含在之后,因为它依赖于 jquery.js。
而且,您的表单中似乎有一些文件输入,并且您的控制器操作正在接受一个HttpPostedFileBase
参数。您应该意识到,您不能使用AJAX请求上传文件,一旦包含此脚本,您的文件上传就会停止工作。为了能够使用AJAX上传文件,您可以使用jquery.form
和Blueimp文件上传等插件,也可以直接使用现代浏览器中内置的新XMLHttpRequest
对象。这些插件的优点是,它们可以进行特性检测,并将根据客户端浏览器的功能而退回到其他技术。
https://stackoverflow.com/questions/21342661
复制相似问题