快速、 方便: 创建您自己的 jQuery 沙箱的 SharePoint

这是另一个帖子中的我 系列 有关如何使用 jQuery 使用 SharePoint.
如果您想要了解更多关于 jQuery, 我强烈推荐: jQuery 在行动 由熊 Bibeault 和耶胡达 · 卡茨.

在 SharePoint 中的 jQuery 入门是非常的简单 (对我来说). (我了关于"最佳做法"的方法来部署这些东西到生产的严重问题, 但这是另一天). 我刚开始玩这种技术,并为此目的, 我创建了一个沙箱环境使用. 如果你想要了解的 jQuery 入门, 您可能会发现这种方法很有用.

1. 创建一个空白网站

在您的网站中某处创建一个空白网站并调用它聪明"jQuery 沙箱"一样的东西.

2. 下载 jQuery

您可以从这里下载 jQuery javascript 库: http://docs.jquery.com/Downloading_jQuery

将到保存到您的桌面.

我一直在使用的"容易"版本.

3. 创建 SharePoint 文档库

沙盒站点中, 创建文档库.

4. 上载到 SharePoint 的 jQuery 库

访问您刚刚创建的文档库和上传的 jQuery 库.

5. 创建自定义 SharePoint 列表

因为我想要标准 SharePoint 形式再乱动,我已经开始自定义列表. 您还可以创建页面库中的网页或 web 部件页和可能很多其他的地方.

将一些列添加到自定义列表,所以,你有什么要运行 jQuery 反对. 我最初的目标是 ︰:

  1. 隐藏字段.
  2. 将一个值分配给字段.

考虑到该目标, 我添加了两个文本字段. 随着时间的推移, 我会玩的链接, 图像, 查找, 等.

6. 修改 NewForm.aspx Web 部件页并添加内容编辑器 Web 部件

这是有点黑 magic-ish , 它是一个新的概念,对我. 我第一次听说这从 保罗 · 翼, SharePoint jQuery 巨星, 在他的 CodePlex 项目站点: http://spff.codeplex.com/.

请按照以下步骤将 CEWP 添加到同一页面的任何自定义列表显示 NewForm.aspx:

  1. 访问自定义列表中,单击新建.
  2. 将下列附加到 URL: 浏览量 = 共享&ToolPaneView = 2

这将改变从这事你无聊香草数据输入窗体:

image

对此:

image

向页面添加内容编辑器 web 部件.

7. 写你的第一个 jQuery 代码

开放,CEWP 在代码视图中,添加以下内容:

image

这是实际的代码,如果您想要复制/粘贴:

<脚本类型 ="文本/javascript"
    src ="../../jQuery Library/jquery-1.3.2.min.js">
</脚本>

<脚本类型 ="文本/javascript">
  $(功能() {

    $('' #resultsID).html(' 有 ' + $('' a).大小() + ' tags 标签在此页上起 '。);

  });
</脚本>

结果:
<div id ='' resultsID></div>
/结果

请注意,第一次 <脚本> 标记引用实际的 jQuery 库. 大概是, 随着时间的推移改变这些东西, 所以你会想要确保你) 使用正确的名称和 b) 它指向正确的 SharePoint 文档库.

沐浴在荣耀

如果你能正确, 你会看到一个类似于以下内容的结果:

image

总结

这不是唯一的方法要开始, 但它是快速, 容易与您现有的 SharePoint 环境隔绝.

</结束>

订阅我的博客.

跟我在 Twitter 上 http://www.twitter.com/pagalvin

del.icio.us 标记: ,

2 上“的想法快速、 方便: 创建您自己的 jQuery 沙箱的 SharePoint

  1. sujith krish

    你注意到在 editform.aspx 中添加 CEWP 将打破页和版本信息部分显示在 UI 中吗? 这的任何变通办法?

    任何人 ?

    答复

留言

您的电子邮件地址不会被公开. 必需的地方已做标记 *