在Chrome / Safari浏览器添加HTML5特性后，阿贾克斯形式打破 [英] Ajax Form breaks after adding html5 attributes in Chrome/Safari
问题描述
步骤一步的说明：
新Asp.Net MVC2项目
New Asp.Net MVC2 project
型号：
public class TestModel
{
public int Property
{ get; set; }
}
HomeController的：
HomeController:
[HandleError]
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Index(TestModel model)
{
return Content(model.Property.ToString());
}
}
Index.aspx的：
Index.aspx:
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<MVCTest.Models.TestModel>" %>
<!DOCTYPE html>
<script type="text/javascript" src="<%=Url.Content("~/Scripts/MicrosoftAjax.js")%>"></script>
<script type="text/javascript" src="<%=Url.Content("~/Scripts/MicrosoftMvcAjax.js")%>"></script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Index</title>
</head>
<body>
<%using( Ajax.BeginForm( "index", "home", new AjaxOptions()
{
HttpMethod = "Post",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "Result"
} ) ){ %>
<div class="editor-field">
<%=Html.TextBoxFor(model => model.Property, new {@type = "number", @step = "1"})%>
<%=Html.ValidationMessageFor(model => model.Property)%>
</div>
<button type="submit" value="click Me">Click Me</button>
<% } %>
<div id="Result">
</div>
</body>
</html>
由于MVC应用程序拒绝在Chrome / Safari浏览正常工作 - 我收到
model.Property == 0 在我的后控制器的方法。
Given mvc application refuses to work properly in Chrome/Safari browsers - I receive
model.Property == 0 in my controller method on post.
当我删除HTML5特性，不断变化的：
When I remove html5 attributes, changing:
<%=Html.TextBoxFor(model => model.Property, new {@type = "number", @step = "1"})%>
到
<%=Html.TextBoxFor(model => model.Property)%>
它像预期。
那么，什么是错的我与HTML5 AJAX的形式，从浏览器/ Safari浏览器的观点属性？ IE / FF浏览器在任何情况下正常工作。
So what's wrong with my ajax form with html5 attributes from Chrome/Safari's point of view? IE/FF browsers work fine in every case.
UPD
这是小提琴手生成的HTML：
Resulting html from fiddler:
HTTP/1.1 200 OK
Server: ASP.NET Development Server/10.0.0.0
Date: Wed, 17 Aug 2011 07:16:19 GMT
X-AspNet-Version: 4.0.30319
X-AspNetMvc-Version: 2.0
Cache-Control: private
Content-Type: text/html; charset=utf-8
Content-Length: 890
Connection: Close
<script type="text/javascript" src="/Scripts/MicrosoftAjax.js"></script>
<script type="text/javascript" src="/Scripts/MicrosoftMvcAjax.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1"><title>
Index
</title></head>
<body>
<form action="/" method="post" onclick="Sys.Mvc.AsyncForm.handleClick(this, new Sys.UI.DomEvent(event));" onsubmit="Sys.Mvc.AsyncForm.handleSubmit(this, new Sys.UI.DomEvent(event), { insertionMode: Sys.Mvc.InsertionMode.replace, httpMethod: 'Post', updateTargetId: 'SaveResultDiv' });">
<div class="editor-field">
<input class="mybox" id="Property" name="Property" step="1" type="number" value="" />
</div>
<button type="submit" value="click Me">Click Me</button>
</form>
<div id="SaveResultDiv"></div>
</body>
</html>
Ajax请求（Safari浏览器）：
Ajax request (Safari):
POST http://127.0.0.1:35636/ HTTP/1.1
Host: 127.0.0.1:35636
Referer: http://myapp/
Accept: */*
Accept-Language: ru-RU
Origin: http://myapp
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; ru-RU) AppleWebKit/533.21.1 (KHTML, like Gecko) Version/5.0.5 Safari/533.21.1
X-Requested-With: XMLHttpRequest, XMLHttpRequest
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Accept-Encoding: gzip, deflate
Content-Length: 31
Connection: keep-alive
Connection: keep-alive
X-Requested-With=XMLHttpRequest
只是比较 - Ajax请求在IE中：
Just to compare - ajax request in IE:
POST http://127.0.0.1:35636/ HTTP/1.1
Accept: */*
Accept-Language: ru
Referer: http://myapp/
x-requested-with: XMLHttpRequest, XMLHttpRequest
Content-Type: application/x-www-form-urlencoded; charset=utf-8
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET4.0C; .NET4.0E; .NET CLR 1.1.4322)
Host: 127.0.0.1:35636
Content-Length: 44
Connection: Keep-Alive
Pragma: no-cache
Property=555&X-Requested-With=XMLHttpRequest
显然，在Chrome / Safari和IE浏览器请求/ FF不同，一些未知的原因。任何想法？
Obviously requests in Chrome/Safari and IE/FF differ for some unknown reason. Any ideas?
推荐答案
开发了一些解决方法 - 迁移到MVC3，elabled UnobtrusiveJavaScript在web.config中是这样的：
Developed some workaround - migrated to MVC3 , elabled UnobtrusiveJavaScript in web.config like this:
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
然后扔掉引用MicrosoftAjax.js和MicrosoftMvcAjax.js，而是使用这些的：
then threw away references to MicrosoftAjax.js and MicrosoftMvcAjax.js, instead using these ones:
<script type="text/javascript" src="<%=Url.Content("~/Scripts/jquery-1.4.4.min.js")%>"></script>
<script type="text/javascript" src="<%=Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")%>"></script>
问题解决了，但它看起来像一个bug对我来说，我会报告给MS。
Solved the problem, but it looks like a bug for me and I would report it to MS.
这篇关于在Chrome / Safari浏览器添加HTML5特性后，阿贾克斯形式打破的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
