How to dynamically resize an app's WebPart?

Navigation
0

I created an App for Sharepoint and within the project I added a Webpart.

I wanted this Webpart to grow or decrease dynamically based on its content.

I tried to add some code from outside the app, but I ran into security issues, so I wanted to do this from within the app itself via javascript. Is this possible?

    
asked by anonymous 05.12.2014 / 19:30

1 answer

1

I found this Cross-domain solution that allows the communication of the App's iframe with the parent document.

The javascript looks like this: 

window.Communica = window.Communica || {};

Communica.Part = {
    senderId: '',

    init: function () {
        var params = document.URL.split("?")[1].split("&");
        for (var i = 0; i < params.length; i = i + 1) {
            var param = params[i].split("=");
            if (param[0].toLowerCase() == "senderid")
                this.senderId = decodeURIComponent(param[1]);
        }


        this.adjustSize();
    },

    adjustSize: function () {
        var step = 30,
            newHeight,
            contentHeight = $('#userDataContent').height(),
            resizeMessage = '<message senderId={Sender_ID}>resize({Width}, {Height})</message>';

        newHeight = contentHeight + 150;

        resizeMessage = resizeMessage.replace("{Sender_ID}", this.senderId);
        resizeMessage = resizeMessage.replace("{Height}", newHeight);
        resizeMessage = resizeMessage.replace("{Width}", "100%");

        window.parent.postMessage(resizeMessage, "*");
    }
};

When I click on some part of the iframe that changes its content via javascript function I added the call to the end of this function: 

Communica.Part.init();

The #userDataContent could be the body of the iframe for example, if it reflects the contents of the iframe.

    
12.12.2014 / 19:48
Operations with HashMap Calculate deadlines other than on weekends