Nous implémentons ensuite la fonction exécutée en cas d’erreur lors de la récupération des éléments :
function userFailed(sender, args) {
var statusId = SP.UI.Status.addStatus("Error : ", args.get_message(), false);
SP.UI.Status.setStatusPriColor(statusId, "red");
}
Celle-ci n’a rien de compliqué.
Une fonction en cas d’erreur
Implémentons ensuite la fonction « GetMenu » qui va être appelée lors de l’affichage du menu de notre bouton. Cette fonction va simplement renvoyer le contenu de la variable « content » qui, rappelons-le, contient la structure XML du bouton.
function GetMenu() {
return content;
}
Nous allons maintenant implémenter la fonction permettant d’insérer l’élément sélectionné dans la page. Tapez donc :
function InsertUser(MenuItemId) {
this.context = SP.ClientContext.get_current();
this.item = this.context.get_web().get_lists().getByTitle(‘Students’).getItemById(MenuItemId);
this.context.load(this.item);
this.context.executeQueryAsync(Function.createDelegate(this, insertContent),
Function.createDelegate(this, userFailed));
}
Cette fonction est appelée depuis la fonction « handleCommand » de notre « prototype » et fait passer l’id de l’élément sélectionné en paramètres (cet id étant défini dans la variable « content » par la fonction « PopulateInsertUserSplitButton »). Nous récupérons donc simplement l’élément via son id et transférons l’exécution du code dans la fonction « insertContent » en cas de réussite ou « userFailed » (déjà définie) en cas d’échec. Déclarons donc la fonction « insertContent » : voir « Code 1 » ci-dessous.
Encore une fois, nous créons un « StringBuilder » qui contiendra la valeur à insérer. Nous construisons ensuite cette valeur en html sur base de l’élément récupéré se trouvant dans la variable « this.item ». Remarquez qu’ici, nous affichons une image selon le sexe de la personne. Ces deux images sont les suivantes et doivent être nommées « Male128x128.png » et « Female128x128.png » : voir figures 11 et 12.
Nous utilisons ensuite utiliser l’API « RTE » pour modifier la valeur du « Rich Text Editor » courant. Ne vous attardez pas trop sur ces 3 lignes, ce n’est pas le sujet du cours. Sachez juste qu’elles servent à insérer le contenu définit préalablement dans la zone de texte active.
Téléchargez cette ressource
Plan de sécurité Microsoft 365
Les attaquants savent comment prendre le contrôle de votre tenant Microsoft 365, et vous, savez-vous comment le reprendre en main ?
Les articles les plus consultés
Les plus consultés sur iTPro.fr
- Des Master Data aux data products : comment l’IA redéfinit le rôle du MDM
- Communication d’entreprise : la voix s’impose à nouveau comme canal critique à l’ère de l’IA
- Réforme de la facturation électronique : une préparation largement théorique
- Le futur de la cryptographie post-quantique
Articles les + lus
Couchbase lance AI Data Plane pour industrialiser l’IA agentique
Windows 11 : Microsoft généralise le point-in-time restore pour accélérer la remise en service des PC
Computex 2026 : 5 signaux forts à retenir
La chaîne d’approvisionnement, point de rupture récurent du SI
Microsoft Build 2026 : contre-offensive des modèles maison face à OpenAI et Anthropic
À la une de la chaîne Tech
- Couchbase lance AI Data Plane pour industrialiser l’IA agentique
- Windows 11 : Microsoft généralise le point-in-time restore pour accélérer la remise en service des PC
- Computex 2026 : 5 signaux forts à retenir
- La chaîne d’approvisionnement, point de rupture récurent du SI
- Microsoft Build 2026 : contre-offensive des modèles maison face à OpenAI et Anthropic
