在Client Web Part中使用link

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">原文地址 </span><a target=_blank href="http://www.dotnetmafia.com/blogs/dotnettipoftheday/archive/2012/12/10/working-with-links-in-a-client-web-part.aspx" style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">Working with links in a Client Web Part</a><span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"> 本文由</span><a target=_blank href="http://blog.csdn.net/spfarm" style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">SPfarmer</a><span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">翻译</span>

如果你读过我的文章, 那么你在新的SharePoint 2013 app model 中使用客户端网页部件就有了一个很好的开始。在app part里面，你做的所有事情,都在一个IFRAME里面。任何时候，当你在App Part里创建link的时候，你一定要记住这一点。这个有一点点复杂，但是也没有想象的那么复杂。从哪里开始呢？我们先看看链接到app的默认页面需要做什么吧。一般情况下，这个页面叫做default.aspx，他的url一般类似于：

http://app-4715ba34d5bfe2.apptest.local/sites/developer/HelloWorldApp/Pages/Default.aspx

Effectively 这个url有一个前缀(app), 一个 Id, 一个存放这个apps的subdomain, 当前我在一个developer站点上运行这个app，接下来是app name ，最终是Pages文件夹 (和Visual Studio里的名字是匹配的)。存放客户端网页部件的aspx页面，一般情况下也在这个文件夹里。在我这个例子里是 HelloWorldClientWebPart.aspx。也就是说，如果我想在我的客户端网页部件里创建一个链接到我app默认页面的link，我应该可以这么做：

<a href="default.aspx">Go to app default page</a>

这个应该会链接app的默认页面，但是很不幸的是，下面是显示结果。

链接是没有问题的，但是页面被设计成在整个浏览器运行，因此它没有 AllowFraming 标签。要修复这个很简单，加一个target=”_top” ，这样这里link就会在父frame里打开，而不是IFREAM。比如:

<a href="default.aspx" target="_top">Go to app page 2</a>

现在link就好用了。

另外一个你可能遇到的常见的情景是，链接到一个相关的列表。假设我有一个list叫TestList ，它的相对路径是Lists/TestList。 We can get to this, but we need to usea relative path and go up one folder first since the page executes out of thePages library.  Here is what that link would look like.

<a href="../Lists/TestList" target="_top">Go to list</a>

最后，有时候你可能想在客户端网页部件里获取到app web的link。你可以使用同样的CSOM达到目的。从获取app web的引用开始。

var context;
var web;
context = new SP.ClientContext.get_current();
web =context.get_web();

然后你需要加载context，运行查询，从而获取到web对象。

context.load(web);
context.executeQueryAsync(onUrlRequestSucceeded,onQueryFailed);

在success 方法里, 你可以读到 URL.，这样我得到了页面上link的引用，然后我可以修改它，分配一个href 属性。

function onUrlRequestSucceeded() {

    var appWebUrl = web.get_url();

   $("#MyLink").attr("href", appWebUrl);

}

当使用link的时候，你现在可以有多个选择了。这个并不是很复杂，但是值得写下来。

Published Dec 10 2012, 10:00 AM by CoreyRoth

Filed under: SharePoint, SharePoint 2013, Apps