2013-03-21 9 views
11

Ich versuche, eine toastr Nachricht (Info, Fehler usw.) nach dem Absenden eines Formulars mit einer Schaltfläche anzeigen und aktualisieren Sie ein Gridview Steuerelement (das in einem Update-Panel ist "in asp.net Webformular. . dankHinzufügen von Toastr Javascript asp.net Webformular

+1

Ich habe es gerade; ScriptManager.RegisterStartupScript (this, GetType(), ", toastr", "toastr.info ('Kunde hinzugefügt', 'Nachricht')", true); – dblay

+1

Interessanter Ansatz mit ScriptManager ... ordentlich! –

Antwort

8

Sie können es tun Page.ClientScript.RegisterStartupScript Methode Beispiel:

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

Aber ich würde wahrscheinlich ein Verfahren oder eine Erweiterung Methode erstellen, die für mich zu handhaben:

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); 
} 

Verwendung:

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

Wenn Sie etwas robustere wollen, könnten Sie ein enum der type Parameter machen.

+0

Ich denke, das ist ordentlich und wirklich robust ... Danke – dblay

2

Aufruf von Web-Formular, (beachten Sie, das ist ein Masterdetail Form hat so eine Masterpage.

MasterPage.ShowToastr (Seite "Message Here", "Titel Here", "Info", False „Toast- unten voller Breite“, false)

die VB.NET ShowToastr Implementierung in der Master-Seite (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 

die ShowToastr Javascript-Funktion in der Master-Seite als gemeinsam genutzte Funktion befindet.

<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> 

Ich hoffe, dass dies jemand hilft, wie ich seit langem versucht, die toastr Optionen in einem Anruf integriert zu bekommen. Wenn Sie beim Aufruf von toastr mehr Optionen zur Verfügung haben möchten, fügen Sie den Funktionen weitere Parameter hinzu. Alle Optionen, die eingestellt werden können, sind im kommentierten Code (Javascript).

Verwandte Themen