Archives de mot-clé : Modale

Comment ouvrir un formulaire dans une fenêtre modale avec SharePoint 2016?

Introduction

On me demande souvent comment faire pour ouvrir un formulaire dans une fenêtre modale et malheureusement, ça ne se fait pas à partir du ruban « Insérer un lien ».

Il serait intéressant d’avoir une case à cocher permettant d’ouvrir un lien dans une fenêtre modale.

Procédure

  1. Modifier la page;
  2. Positionner le curseur à l’emplacement désiré;
  3. Sélectionnez l’onglet « Insérer » puis cliquez sur « Composant WebPart »;
  4. Sélectionnez la catégorie « Média et contenu » -> Éditeur de script;
  5. Sélectionnez le composant WebPart et cliquez sur « Modifier le composant WebPart »;
  6. Modifier le titre pour une valeur significative. Ex : « script_formulaire_fenetre_modale » et cliquez sur OK;
  7. Cliquez sur « Modifier l’extrait de code « ;
  8. Copier le code HTML suivant :

function openModalWindow(tUrl, tTitle) 
{
	var options = {
          url: tUrl,
          title: tTitle
        };

SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);

}

<a href="#">Formulaire avec ouverture modale</a>

 
9. Ajuster la valeur des paramètres openModalWindow(‘URL’,’TITRE’) pour pointer sur le bon formulaire et qui sera affiché dans la fenêtre modale.

Ex : openModalWindow(‘/site/Lists/NomListe/NewForm.aspx’, ‘Formulaire avec ouverture modale’)

Si vous voulez utiliser une apostrophe dans le titre, il faut mettre un backslash devant.

Ex : \’

10. Ajuster la texte affiché entre les balises et

11. Appuyez sur OK

12. Enregistrer la page

Résultat

OuvertureModale

 

Advertisements