在开发OData服务时,经常需要使用Ajax来与数据服务进行交互。随着技术的发展,Ajax脚本库也在不断更新。最近,发现了一些新的脚本库和对象,它们使得Ajax调用更加方便和强大。本文将介绍如何自动或手动加载这些新的Ajax脚本,以便在WCF Data Services中使用。
新的Ajax脚本库被分割成多个文件,这样做的目的是为了按需加载所需的库。此外,引入了一个新的Script Loader对象,它可以帮助自动加载脚本及其依赖项。为了更好地理解如何使用新的OpenDataServiceProxy对象(以前称为DataServiceProxy),查阅了相关文档。要使用它,需要引用start.debug.js(或生产环境中的start.js):
<script type="text/javascript" src="http://www.codeproject.com/Content/Scripts/start.debug.js"></script>
同时,需要使用以下语句来从服务器加载相关脚本:
Sys.require([Sys.components.dataContext, Sys.components.openDataContext]);
Sys.require语句用于配置Script Loader加载数据上下文和开放数据上下文的库,这包括了从JavaScript消费WCF Data Services的所有功能。Script Loader会检查服务器上是否存在这些库,并为加载所有组件。使用相对路径时需要注意,因为它可能会导致一些问题。此外,使用ScriptManager,可以从Microsoft Content Delivery Network(CDN)搜索而不是从服务器加载文件。包含OpenDataServiceProxy对象的主页面可能如下所示:
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="AjaxClient.master.cs" Inherits="DataServiceAjaxClient.Master.AjaxClient" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="http://www.codeproject.com/Content/Scripts/Start.debug.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<script type="text/javascript">
var proxy;
Sys.require([Sys.components.dataContext, Sys.components.openDataContext]);
Sys.onReady(function() {
proxy = new Sys.Data.OpenDataServiceProxy("http://localhost/Services/SchoolService.svc");
});
</script>
</asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</div>
</form>
</body>
</html>
请注意Sys.onReady函数,它将在所有脚本加载完成后被调用。
要手动加载相关的JavaScript文件,首先需要确定脚本文件的依赖关系。文件的依赖关系如下所示:
然后可以使用ScriptManager来加载脚本,如下例所示(ScriptReferences的顺序非常重要!):
<asp:ScriptManager ID="ScriptManager1" runat="server" AjaxFrameworkMode="Explicit">
<Scripts>
<asp:ScriptReference Path="~/Content/Scripts/Start.debug.js" />
<asp:ScriptReference Path="~/Content/Scripts/MicrosoftAjaxCore.debug.js" />
<asp:ScriptReference Path="~/Content/Scripts/MicrosoftAjaxComponentModel.debug.js" />
<asp:ScriptReference Path="~/Content/Scripts/MicrosoftAjaxSerialization.debug.js" />
<asp:ScriptReference Path="~/Content/Scripts/MicrosoftAjaxNetwork.debug.js" />
<asp:ScriptReference Path="~/Content/Scripts/MicrosoftAjaxWebServices.debug.js" />
<asp:ScriptReference Path="~/Content/Scripts/MicrosoftAjaxDataContext.debug.js" />
<asp:ScriptReference Path="~/Content/Scripts/MicrosoftAjaxOpenData.debug.js" />
</Scripts>
</asp:ScriptManager>