sharepoint
Travailler avec des boîtes de dialogue modales avec JavaScript

.NET Framework ASP.NET C# Language CSS HTML JavaScript jQuery PowerShell Microsoft SQL Server VBA

Syntaxe

var options = SP.UI. $ create_DialogOptions ();
var modalDialog = SP.UI.ModalDialog.showModalDialog (options);

Paramètres

options Propriété	La description
Titre	Une chaîne contenant le titre de la boîte de dialogue
URL	Chaîne contenant l'URL de la page qui apparaît dans la boîte de dialogue. L' URL ou le HTML doit être spécifié. L'URL a priorité sur HTML .
html	Un élément HTML à afficher dans la boîte de dialogue.
X	Le décalage en x de la boîte de dialogue sous la forme d'un nombre entier.
y	Le décalage en y du dialogue sous la forme d'un nombre entier.
largeur	La largeur de la boîte de dialogue sous la forme d'un nombre entier. Si non spécifié et autosize est faux, la largeur est définie sur 768px
la taille	La hauteur de la boîte de dialogue sous la forme d'un nombre entier. Si non spécifié et que la taille automatique est fausse, la hauteur est définie sur 576px
permettreMaximiser	Valeur booléenne indiquant si le bouton Maximiser doit être affiché.
showMaximized	Valeur booléenne spécifiant si la boîte de dialogue s'ouvre agrandie.
montrerFermer	Valeur booléenne spécifiant si le bouton Fermer apparaît dans la boîte de dialogue.
autoSize	Valeur booléenne qui spécifie si la plateforme de dialogue gère automatiquement le dimensionnement des dialogues.
dialogReturnValueCallback	Un pointeur de fonction qui spécifie la fonction de rappel de retour. Function prend deux paramètres: un dialogResult de type SP.UI.DialogResult Enumeration et un objet returnValue qui contient les données renvoyées par la boîte de dialogue.
args	Objet contenant des données transmises à la boîte de dialogue.

Remarques

L' SP.UI.ModalDialog noms SP.UI.ModalDialog été introduit dans le modèle d'objet JavaScript avec SharePoint 2010 et est disponible dans les versions ultérieures de SharePoint 2013, Office365 et 2016.

Matériaux de référence supplémentaires:

Effectuer une action lorsqu'une boîte de dialogue est fermée

SP.SOD.executeOrDelayUntilScriptLoaded(showDialog,"sp.js");

function showDialog(){
    var options = SP.UI.$create_DialogOptions();
    options.url = "/mySite/lists/myList/NewForm.aspx";
    options.dialogReturnValueCallback = myCallBackFunction;
    SP.UI.ModalDialog.showModalDialog(options);    
    function myCallBackFunction(result,data){
        switch(result){
            case SP.UI.DialogResult.invalid: 
                alert("The dialog result was invalid"); 
                break;
            case SP.UI.DialogResult.cancel: 
                alert("You clicked cancel or close"); 
                break;
            case SP.UI.DialogResult.OK: 
                alert("You clicked OK, creating an item in the list."); 
                break;
        }
    }
}

Afficher une page existante dans une boîte de dialogue

SP.SOD.executeOrDelayUntilScriptLoaded(showDialog,"sp.js");

function showDialog(){
    SP.UI.ModalDialog.showModalDialog(
        { url: "/org/it/web/wik/Lists/ExampleCode/DispForm.aspx?ID=6" }
    );
}

Afficher une boîte de dialogue personnalisée

SP.SOD.executeOrDelayUntilScriptLoaded(showDialog,"sp.js");

function showDialog(){
    var dialogOptions = SP.UI.$create_DialogOptions();
    dialogOptions.title = "Your Title Here!";
    var dummyElement = document.createElement("div");
    dummyElement.style.textAlign = "center";
    dummyElement.appendChild(document.createElement("br"));
    dummyElement.appendChild(document.createTextNode("Some beautifully crafted text."));
    dummyElement.appendChild(document.createElement("br"));
    dialogOptions.html = dummyElement;
    SP.UI.ModalDialog.showModalDialog(dialogOptions);    
}

Modified text is an extract of the original Stack Overflow Documentation

Sous licence CC BY-SA 3.0

Non affilié à Stack Overflow