Aggiunta di toastr javascript asp.net webform

Question

Sto tentando di visualizzare un messaggio toastr (informazioni, errore, ecc.) Dopo aver inviato un modulo utilizzando un pulsante e aggiornato un controllo di griglia (che si trova in un pannello di aggiornamento "nel webform di asp.net. . grazie

Answer 1

è possibile farlo utilizzando Page.ClientScript.RegisterStartupScript metodo Esempio:

Page.ClientScript.RegisterStartupScript(this.GetType(), 
    "toastr_message", "toastr.error('There was an error', 'Error')", true); 

ma probabilmente creare un metodo metodo o estensione per gestire questo per me:

public static void ShowToastr(this Page page, string message, string title, string type = "info") 
{ 
    page.ClientScript.RegisterStartupScript(page.GetType(), "toastr_message", 
      String.Format("toastr.{0}('{1}', '{2}');", type.ToLower(), message, title), addScriptTags: true); 
} 

Usa:

ShowToastr(this.Page, "Hello world!", "Hello"); 

Se volete qualcosa di un po 'più robusto, si potrebbe creare il type parametro di un enum.

Answer 2

Chiamata da modulo web, (notare che questo è una forma MasterDetail quindi ha una MasterPage.

MasterPage.ShowToastr (pagina, "messaggio qui", "Title Here", "Info", False, "Toast bottom-full-width", false)

l'implementazione VB.NET ShowToastr nella pagina master (VB)

Public Shared Sub ShowToastr(ByVal page As Page, ByVal message As String, ByVal title As String, Optional ByVal type As String = "info", Optional ByVal clearToast As Boolean = False, Optional ByVal pos As String = "toast-top-left", Optional ByVal Sticky As Boolean = False) 
    Dim toastrScript As String = [String].Format("Notify('{0}','{1}','{2}', '{3}', '{4}', '{5}');", message, title, type, clearToast, pos, Sticky) 
    page.ClientScript.RegisterStartupScript(page.[GetType](), "toastr_message", toastrScript, addScriptTags:=True) 
End Sub 

la funzione ShowToastr Javascript risiede nella pagina master come una funzione condivisa.

<link href="./Media/css/Grey/ListBox.Grey.css" rel="stylesheet" type="text/css" /> 
<link href="./Media/css/WebTrack.css" rel="stylesheet" type="text/css" /> 

<script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script> 

<link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.0.1/css/toastr.css" 
    rel="stylesheet" /> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.0.1/js/toastr.js" 
    type="text/javascript"></script> 

<script language="javascript" type="text/javascript"> 
    function Notify(msg, title, type, clear, pos, sticky) { 
     //  toastr.options.positionClass = "toast-bottom-right"; 
     //  toastr.options.positionClass = "toast-bottom-left"; 
     //  toastr.options.positionClass = "toast-top-right"; 
     //  toastr.options.positionClass = "toast-top-left"; 
     //  toastr.options.positionClass = "toast-bottom-full-width"; 
     //  toastr.options.positionClass = "toast-top-full-width"; 
     //  options = { 
     //   tapToDismiss: true, 
     //   toastClass: 'toast', 
     //   containerId: 'toast-container', 
     //   debug: false, 
     //   fadeIn: 300, 
     //   fadeOut: 1000, 
     //   extendedTimeOut: 1000, 
     //   iconClass: 'toast-info', 
     //   positionClass: 'toast-top-right', 
     //   timeOut: 5000, // Set timeOut to 0 to make it sticky 
     //   titleClass: 'toast-title', 
     //   messageClass: 'toast-message' } 


     if (clear == true) { 
      toastr.clear(); 
     } 
     if (sticky == true) { 
      toastr.tapToDismiss = true; 
      toastr.timeOut = 10000; 
     } 

     toastr.options.onclick = function() { 
      //alert('You can perform some custom action after a toast goes away'); 
     } 
     //"toast-top-left"; 
     toastr.options.positionClass = pos; 
     if (type.toLowerCase() == 'info') { 
      toastr.options.timeOut = 1000; 
      toastr.tapToDismiss = true; 
      toastr.info(msg, title); 
     } 
     if (type.toLowerCase() == 'success') { 
      toastr.options.timeOut = 1500; 
      toastr.success(msg, title); 
     } 
     if (type.toLowerCase() == 'warning') { 
      toastr.options.timeOut = 3000; 
      toastr.warning(msg, title); 
     } 
     if (type.toLowerCase() == 'error') { 
      toastr.options.timeOut = 10000; 
      toastr.error(msg, title); 
     } 
    } 
</script> 

Spero che questo aiuti qualcuno, come ho cercato per anni per ottenere le opzioni toastr integrate in una chiamata. Se desideri avere più opzioni disponibili sulla chiamata a toastr, quindi aggiungi altri parametri alle funzioni. Tutte le opzioni che possono essere impostate sono nel codice commentato (javascript).