1

SharePoint Webページを展開し、顧客が望む方法でデータを視覚化するカスタムWebパーツを追加しました。Webパーツの問題は、ユーザーが望むときにWebパーツを拡大縮小、変更、または非表示にできないことです。SharepointWebパーツをJavaラッパーに埋め込むことを考えました。通常、これは標準のHTMLページでは簡単です。問題は、SharepointのJavaラッパー内にWebパーツを埋め込むにはどうすればよいですか?

2つのhtmlボタンを追加します。1つはWebパーツを表示し、もう1つはWebパーツを非表示にします。課題は、hideMeまたはshowMejavaスクリプトを実行するためにいずれかのボタンに渡すことができるWebパーツIDを見つけることです。

Webパーツヘッダー:

<WebPartPages:WebPartZone runat="server" Title="loc:FullPage" ID="FullPage" FrameType="TitleBarOnly"><ZoneTemplate>
<WpNs0:Trend runat="server" __MarkupType="xmlmarkup" WebPart="true" __WebPartId="{AFA8DE0A-E7B4-4580-BFAB-038D96E72F0A}" >

コード(これまでのところ)

<button onclick="HideWebpart('AFA8DE0A-E7B4-4580-BFAB-038D96E72F0A')">Hide Me</button>
<button onclick="ShowWebpart('AFA8DE0A-E7B4-4580-BFAB-038D96E72F0A')">Show Me</button>

<script>
function HideWebpart(AFA8DE0A-E7B4-4580-BFAB-038D96E72F0A)
{
    var wp=document.getElementById(AFA8DE0A-E7B4-4580-BFAB-038D96E72F0A);
    wp.className = "hidden";
}

function ShowWebpart(AFA8DE0A-E7B4-4580-BFAB-038D96E72F0A)
{
    var wp=document.getElementById(AFA8DE0A-E7B4-4580-BFAB-038D96E72F0A);
    wp.className = "";
}
</script>
4

1 に答える 1

0

これで、Webパーツにid = "mywebpart"を指定してから、JavaScript関数を使用して非表示にすることができます。

例:

<style type="text/css>
    .hidden { display:none; }
</style>
<script>
function HideWebpart(id_of_webpart)
{
    var wp=document.getElementById(id_of_webpart);
    wp.className = "hidden";
}

function ShowWebpart(id_of_webpart)
{
    var wp=document.getElementById(id_of_webpart);
    wp.className = "";
}
</script>
<WebPartPages:WebPartZone>
..The SVG WebPart... <--Add WebPart with id here
</WebPartPages:WebpartZone>

<button onclick="HideWebpart('PASS WEB PART ID IN HERE')"/>

問題は、getElementByIdが「id=」属性のみを検索するときに「__WebPartId=」属性を使用することだと思います。したがって、カスタム属性で要素を検索するには、getElementByIdの代わりに次を使用する必要があります。

function getElementByAttribute(attr, value, root) {
    root = root || document.body;
    if(root.hasAttribute(attr) && root.getAttribute(attr) == value) {
        return root;
    }
    var children = root.children, 
        element;
    for(var i = children.length; i--; ) {
        element = getElementByAttribute(attr, value, children[i]);
        if(element) {
            return element;
        }
    }

使用法:

getElementByAttribute("__WebPartId",'PASS WEB PART ID IN HERE');

注:インデックスを使用できないため、getElementByIdに比べてはるかに遅くなります

または、jQueryライブラリを使用できる場合は、単に$('[__ WebPartId = "PASS WEB PART ID IN HERE"]')を使用できます。

于 2013-02-07T05:25:49.260 に答える