web-dev-qa-db-fra.com

Comment personnaliser les options d'invite Bootbox.js

J'essaie de personnaliser les options de bootboxjs.Prompt, mais il semble qu'il n'autorise pas un objet d'options en tant que paramètre

Ceci est l'exemple de http://bootboxjs.com/index.html#api

bootbox.Prompt("What is your name?", function(result) {                
  if (result === null) {                                             
    Example.show("Prompt dismissed");                              
  } else {
    Example.show("Hi <b>"+result+"</b>");                          
  }
});

Voici ce que j'essaie de passer:

var promptOptions = {
  title: "Custom label",
  buttons: {
    confirm: {
      label: "Save"
    }
  }
};

bootbox.Prompt(promptOptions, function(result) {                
  if (result === null) {                                             
    console.log("Prompt dismissed");                              
  } else {
    console.log("Hi "+result);                          
  }
});

Comment personnaliser l'étiquette du titre et des boutons?

bootbox
12
Mariano J. Ponce

Vous pourrez créer une invite personnalisée à l'aide de boîtes de dialogue personnalisées. La seule chose que vous devez savoir est que la chaîne de message que vous donnez à bootbox ne doit pas être du texte brut. Il peut s'agir de HTML, vous pouvez donc mettre votre propre invite dans une boîte de dialogue de démarrage personnalisée.

Voici ce que vous essayez de faire (en utilisant Bootbox 4.x):

bootbox.dialog({
  message: "First name:<input type='text' id='first_name'>",
  title: "Custom label",
  buttons: {
    main: {
      label: "Save",
      className: "btn-primary",
      callback: function() {
        console.log("Hi "+ $('#first_name').val());
      }
    }
  }
});
21
haradwaith

bootbox.Prompt ne prend qu'un paramètre si vous souhaitez passer un objet avec vos étiquettes personnalisées. Donc, pour le faire fonctionner, vous devez mettre votre rappel dans votre objet de configuration:

var promptOptions = {
  title: "Custom label",
  buttons: {
    confirm: {
      label: "Save"
    }
  },
  callback: function(result) {                
      if (result === null) {                                             
        console.log("Prompt dismissed");                              
      } else {
        console.log("Hi "+result);                          
      }
    }
};

bootbox.Prompt(promptOptions);
20
mseo