Code Exp

Show notification after Save / Edit / Delete by using Bootstrap Notify

Method I:

Embed the code directly to the page

I use this method to call the notification function after the page is redirected / reloaded

01: Add the function definition on the top page

 <script>

        $(document).ready(function () {

           showNotification('top', 'center');
            
        });

   </script>

02: Add the function to the bottom of the page

The function will be called if the QueryString “v” is not empty

 <% If Not Request.QueryString("m") = "" %>

     <script>

         function showNotification(from, align) {

             var lan = "<%=Session("MyCulture") %>";

             if (lan == "") {lan = "en"}

             var msg2show;
             var msg = <%= Request.QueryString("m") %>;

             switch (msg) {

                 case 1:

                     if (lan = "en") {
                         msg2show = "New record added successfully."
                     } else {
                         msg2show = "<span class='ar'>تمت الاضافة بنجاح</span>."
                     }

                 break;

                 case 2:

                     if (lan == "en") {
                         msg2show = "Changes saved successfully"
                     } else {
                         msg2show = "تم حفظ التعديلات"
                     }

                     break;

                 default:
                     msg2show = ""

             }

             $.notify({
                 icon: "check_circle",
                 message: msg2show

             }, { //settings
                 type: 'success',
                     timer: 4000,
                     mouse_over: 0,
                 placement: {
                     from: from,
                     align: align
                 }
             });
         }

    </script>

    <% End If %>

This method must be changed to avoid copying and pasting the same function on each page, it has to saved in a single .js file.

---

Method II:

This method will call the function and pass all the parameters from the code behind

01: Use the following on page load

        ' Show the notification
        Dim m As Integer = Request.QueryString("m")
        If Not m = Nothing Then
            ScriptManager.RegisterStartupScript(Me.Page, Page.GetType, "text", "showNotification('top','center', '" & Session("MyCulture") & "'," & m & ")", True)
        End If

02: Add the following to the header

    http://%=%20ResolveUrl(
    http://%=%20ResolveUrl(

The content of notify-ez.js:

function showNotification(from, align, xlan, xm) {

    var lan = xlan;

    if (lan == "") { lan = "en" }

    var msg2show;
    var msg = xm;
    var icon;
    var type;

    switch (msg) {

        case 1:

            if (lan == "en") {
                msg2show = "New record added successfully."
            } else {
                msg2show = "تمت الاضافة بنجاح"
            }

            icon = 'check_circle';
            type = 'success'

            break;

        case 2:

            if (lan == "en") {
                msg2show = "Changes saved successfully"
            } else {
                msg2show = "تم حفظ التعديلات"
            }

            icon = 'check_circle';
            type = 'success'

            break;

        case 3:

            if (lan == "en") {
                msg2show = "Record deleted successfully"
            } else {
                msg2show = "تم مسح السجل بنجاح"
            }

            icon = 'delete';
            type = 'danger'

            break;

        default:
            msg2show = ""

    }

    $.notify({
        icon: icon,
        message: msg2show

    }, { //settings
        type: type,
        timer: 2000,
        placement: {
            from: from,
            align: align
        }
    });
}