在Chrome / Safari中添加html5属性后,Ajax Form中断

时间:2011-08-16 20:48:10

标签: ajax asp.net-mvc-2 html5 google-chrome safari

分步说明:

新的Asp.Net MVC2项目

型号:

public class TestModel
{
    public int Property 
    { get; set; }
}

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:

<%@ 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在帖子上。

当我删除html5属性时,更改:

<%=Html.TextBoxFor(model => model.Property, new {@type = "number", @step = "1"})%>

<%=Html.TextBoxFor(model => model.Property)%>

它的工作方式与预期一致。

那么我的ajax表单有什么问题,从Chrome / Safari的角度看html5属性? IE / FF浏览器在每种情况下都能正常工作。

UPD

来自fiddler的结果html:

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: &#39;Post&#39;, updateTargetId: &#39;SaveResultDiv&#39; });">
        <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):

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

只是比较 - IE中的ajax请求:

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中的请求因某些未知原因而有所不同。有什么想法吗?

1 个答案:

答案 0 :(得分:2)

开发了一些解决方法 - 迁移到MVC3,在web.config中发布了UnobtrusiveJavaScript,如下所示:

<add key="UnobtrusiveJavaScriptEnabled" value="true" />

然后丢弃对MicrosoftAjax.js和MicrosoftMvcAjax.js的引用,而不是使用这些引用:

   <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>

解决了这个问题,但对我来说这看起来像个错误,我会把它报告给MS。