web-dev-qa-db-fra.com

SharePoint 2013 ajoute javascript après le chargement de la page entière

Avertissement: je n'ai aucune expérience avec SharePoint2013.

J'ai un problème - je dois inclure/déclencher certaines fonctions javascript après le chargement de la page entière. J'ai essayé d'écouter les événements DOMDocumentReady et window.load, mais sharepoint affiche le reste de la page après ces événements.

Ma question est: ce que je dois faire pour pouvoir exécuter le script après le rendu de la page entière avec ajax. J'ai également remarqué que la navigation dans les pages est basée sur la partie de hachage (#). Évidemment, je dois également détecter ce moment.

Toute aide ou même un lien vers la bonne page dans la documentation serait formidable!

javascriptsharepoint-2013
28
Kamil Biela

Vous avez raison, BEAUCOUP de choses se produisent à la page après $ (document) .ready (). 2013 offre quelques options.

1) Script à la demande: (chargez un fichier js puis exécutez mon code.)

function stuffThatRequiresSP_JS(){
    //your code
}

SP.SOD.executeFunc("sp.js")

2) Délai jusqu'à chargement (attendez un fichier js, puis exécutez)

function stuffToRunAfterSP_JS(){
    //your code
}
ExecuteOrDelayUntilScriptLoaded(stuffToRunAfterSP_JS, "sp.js")

3) charger après la fin des autres trucs

function runAfterEverythingElse(){
    // your code
}
_spBodyOnLoadFunctionNames.Push("runAfterEverythingElse");

Sources:

executeFunc: http://msdn.Microsoft.com/en-us/library/ff409592 (v = office.14) .aspx

ExecuteOrDelayUntilScriptLoaded: http://msdn.Microsoft.com/en-us/library/ff411788 (v = office.14) .aspx

Impossible de trouver une source sur _spBodyOnLoadFunctionNames mais je l'utilise à quelques endroits.

bonne chance.

57
Will Fawcett

Une fonction d'enregistrement d'événements documentée qui est à peu près équivalente à _spBodyOnLoadFunctionNames est SP.SOD.executeOrDelayUntilEventNotified. Appelez ceci pour recevoir une notification de l'événement "sp.bodyloaded":

SP.SOD.executeOrDelayUntilEventNotified(function () {
    // executed when SP load completes
}, "sp.bodyloaded");

Ce gestionnaire se déclenche en fait légèrement avant le _spBodyOnLoadFunctionNames les fonctions.

Cette référence est pour SharePoint 2010, mais l'utilitaire SOD est présent dans SharePoint 2013: http://msdn.Microsoft.com/en-us/library/office/ff410354 (v = office.14) .aspx

10
Jack A.

Il existe différentes techniques utilisées pour fournir notre code JavaScript personnalisé chargé avant/au milieu/après les événements OnLoad dans SharePoint:

ExecuteOrDelayUntilBodyLoaded.
Sys.Application.pageLoad.
document.ready Jquery.
_spBodyOnLoadFunctionNames.
_spBodyOnLoadFunction.
ExecuteOrDelayUntilScriptLoaded:sp.core.js.
SP.SOD.executeFunc: sp.js.
Sys.WebForms.PageRequestManager.PageLoaded

- La fonction ExecuteOrDelayUntilBodyLoaded est toujours exécutée la première (mais à ce stade, nous ne pouvons pas accéder à SP). Cela pourrait être utile pour exécuter notre code personnalisé à une étape vraiment antérieure du processus OnLoad.

- Il existe deux fonctions SharePoint onLoad _spBodyOnLoadFunctionNames et _spBodyOnLoadFunction. Toujours exécuté dans l'ordre. Donc, si nous voulons exécuter du code après toutes les fonctions incluses par nous (ou d'autres développeurs) dans _spBodyOnLoadFunctionNames, il est utile d'utiliser celui-ci _spBodyOnLoadFunction, car il est exécuté en dernier.

- ExecuteOrDelayUntilScriptLoaded: sp.core.js et SP.SOD.executeFunc: sp.js. échangent l'ordre d'exécution de manière aléatoire.

- Si nous voulons exécuter certaines fonctions après toutes les fonctions (SP, après les fonctions de chargement, Yammer, etc.), nous pouvons utiliser cette fonction pour attacher l'événement OnLoad -> Sys.WebForms.PageRequestManager.PageLoaded.

Vous pouvez voir l'article entier expliquant chaque type, avantages et inconvénients ici: https://blog.josequinto.com/2015/06/16/custom-javascript-function-loaded-after-the-ui-has -chargé-dans-sharepoint-2013 /

Cordialement!

8
José Quinto Zamora

https://mhusseini.wordpress.com/2012/05/18/handle-clicks-on-calendar-items-in-sharepoint-2010-with-javascript/

Le lien ci-dessus a fonctionné pour moi. Il utilise essentiellement ExecuteOrDelayUntilScriptLoaded pour lancer son code de raccordement de calendrier après le chargement de SP.UI.ApplicationPages.Calendar.js.

Ensuite, dans le hook de calendrier, il attache sa propre fonction à la fonction: SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed.

 _spBodyOnLoadFunctionNames.Push("LaunchColorCodeCalendarScriptOnReady");


function LaunchColorCodeCalendarScriptOnReady() {


    ExecuteOrDelayUntilScriptLoaded(
        MyCalendarHook,
        "SP.UI.ApplicationPages.Calendar.js");


}

function MyCalendarHook() {
    var _patchCalendar = function () {
        //Do something to the items in the calendar here
        //ColorCodeCalendar();
    };

    var _onItemsSucceed = SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed;
    SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed = function ($p0, $p1) {
        _onItemsSucceed.call(this, $p0, $p1);
        _patchCalendar();
    };
}
2
WWC

Voici un bel article sur la façon d'utiliser la fonctionnalité intégrée SharePoint SOD (Script On Demand): http://www.ilovesharepoint.com/search/label/SOD

Cela fonctionne bien à la fois pour SP 2010 et 2013.

L'idée du chargement de script à la demande a vraiment du sens. SharePoint 2010 charge vraiment beaucoup de scripts Java - cela prend du temps! L'idée est donc: d'abord charger le code HTML et le laisser restituer par le navigateur afin que l'utilisateur puisse lire les informations demandées le plus rapidement possible. Et dans la deuxième étape, chargez le comportement (les JavaScripts).

0
Ruslan Korkin