JQuery-Mobile 和 ASP.Net - AJAX 还是回发？

Question

我过去一直在开发 ASP.Net，直到最近才遇到一个移动项目。 Jquery-Mobile 作为一个框架看起来很完美，所以我只是潜入了它。

目前我正在使用 ASP.Net 方法将服务器控件放在页面上，然后使用 jqm 增强这些控件以使它们看起来可移动。我实际上是通过回发来收集表单数据并在代码隐藏中处理它们。 为了避免整页刷新，我也不得不将它们与 updatepanel 混合使用。不知怎的，我让他们工作了，但内心深处我只是觉得这不是正确的方法（或有效的方法）。

为了让它们正确而混合起来太复杂了，所以我想也许我应该避免回发并在纯 AJAX 请求中做所有其他事情？

$.ajax({
 type: 'POST',
  url: "/GetName",
  data: "{}",
  contentType: "application/json; charset=utf-8"

})
.success(function (response) {
  alert(response);
});

代码隐藏：

[WebMethod ()] 
public String GetName()
{ return "Jack"; }

问题：

• 这可行，但这是与 jQuery-Mobile 网站一起使用的更好方法，还是这只是另一个糟糕的例子？

• 对于这种情况，UpdatePanel 和回发是不是一个坏主意？ （我知道它们有效）

• 如果首选 AJAX，如何在页面加载时填充下拉列表（不是服务器控制）？发送 AJAX 请求以填充 $(document).ready() 上的下拉列表对我来说似乎很愚蠢

我正在寻找的是开发移动网站的经验法则，我不想偏离应该做的事情太远。非常感谢您的意见。谢谢。

Answer 1

asp.net Web Forms 和 jQuery Mobile 确实不能一起工作。回发模型打破了 jQuery Mobile ajax 的工作方式，当您拥有多个页面或表单时，它就会崩溃。具体来说，Web 表单需要一个 <form> 标记来包装所有服务器端控件，并且您不能引入其他“内部”表单。 jQuery Mobile 最适用于 ajax 模型和一个或多个“页面”(<div data-role="page">) 以及 DOM 中包含的表单。更新面板最终会造成混乱。

一种方法是简单地关闭 jQuery Mobile ajax 加载。你可以这样做：

//note that the order of script loading here is critical.
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script>
    $(document).bind(“mobileinit”, function() {
        $.mobile.ajaxEnabled = false;
    });
</script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js">
</script>   

但最终，您不会拥有一个高效的网站。如果您的站点在本地无线网络上运行，那可能就足够了。

我主要在 Web 表单环境中工作，需要一个基于 Web 表单的 jQuery Mobile 应用程序，并将 5 个左右的“页面”编码为单个静态 html 文件。然后我依靠 JavaScript 和 jQuery ajax 加载到 ASMX Web 服务端点。我还广泛使用了 KnockoutJS，但我当然可以仅依靠 JavaScript 和 jQuery ajax 来提取数据（在我的情况下，该应用程序具有报告性质，没有数据更新。）如果您要保存数据，您可以使用相同的技术。

更好的方法是使用 asp.net MVC，它消除了强制回发模型并允许对 <form> 标记的放置位置进行细粒度控制。

我在一个更大的移动网站上工作，并在后端使用 MVC 并充分利用 Razor 视图，但最后，我依赖客户端 ajax 调用所有数据，并依赖 KnockoutJS 进行几乎所有动态标记。最后，我的客户端应用程序在 Web 窗体和 MVC 之间并没有什么不同。基于 MVC 的控制器更容易用于 ajax 端点并且解决方案更简洁。

一般来说，我会将这两种解决方案归为“单页应用程序”，即 SPA 方法。还有其他方法可能适用于 Web 表单，但在我有限的探索中，这是最好的选择。