Sharepoint2010使用AJAx 获取 OData Service （jQuery的集成与持久化 ）---第二篇

我上篇《Sharepoint2010使用AJAx 获取 OData Service （实现客户端获取sharepoint2010的数据）---第一篇》讲了如何获取数据，下面我要做个Demo，体现jQuery在客户端的强大。

（一）我们先要准备一些东西 jQuery UI插件 ，我使用的是jquery-ui-1.8.4.custom。

（二）Demo

　　我们先看一下效果：

这里实现的效果是 卡片是浮动的，可以随意拖动，而且亮点是显示的数据是Sharepoint列表的数据，而且它会自动保存位置，下次打开这个页面时，位置依然是上次关闭时的位置。

1.准备工作： 先建一个列表（我这里是Tasks），记得里面要要建立两个“数字” 字段，分别是X,Y，它们的作用是保存图片的位置，然后准备2张图片，一张是页面背景

，一张是卡片背景 。

2.建一个页面替换成下面的代码：

代码

function openDialog() {

var options = {

html: userStoryDetails,

width: 580,

height: 320,

title: "User Story",

dialogReturnValueCallback: onDialogClose

};

SP.UI.ModalDialog.showModalDialog(options);

}

注意其中sys-template类的使用。 任何dataView依附的元素都需要加上这个类。用于在页面加载时将该元素设为display:none，dataView显示时会将其设回到display:block。

<div id="userStoryDetails" class="sys-template">

参考资料

http://www.endusersharepoint.com/EUSP2010/2010/05/20/client-side-ajax-applications-in-sharepoint-2010-%E2%80%93-part-4-jquery-integration-and-persistence/

/article/4717191.html

if ($ != jQuery) {
$ = jQuery.noConflict();
}

来源：http://www.cnblogs.com/jlydboy/articles/1808356.html