Jquery Calendar and Nice popup after click submit button or modern calender c# website and sharepoint site, visual webpart

Attractive jquery poup with good theme like :
On the click of OK button It can also redirect to  another page.


Download link of css and js
Code in design of page(aspx/ascx) :
<script src="../_layouts/15/FolderName/popup/jquery.min.js"></script>
<script src="../_layouts/15/FolderName/popup/Popup1.js"></script>
<link href="../_layouts/15/FolderName/popup/popupman.css" rel="stylesheet" />

1.   For POpup(  Without redirection on another page)
<script type="text/javascript">
    function ShowPopup1(message) {
        $(function () {
            $("#dialog").html(message);
            $("#dialog").dialog({
                title: "Message",
                buttons: {
                    Close: function () {
                        $(this).dialog('close');
                    }
                },
                modal: true
            });
        });
    }
</script>
2.  TO REDIRECT ON ANOTHER PAGE

<script type="text/javascript">
function ShowPopup1(message) {
           $(function () {
               $("#dialog").html(message);
               $("#dialog").dialog({
                   title: "Message",
                   buttons: {
                       OK: function () {
                           $(this).dialog('OK');
                           var url = '/Pages/Home.aspx';
                           $(location).attr('href', url);
                       }
                   },
                   modal: true
               });
           });
       }
</script>
Div to show popup
<%--popup div--%>
<div id="dialog" style="display: none">
</div>

C# code to call popup:
string message = "Saved Successfully.";
                            Page.ClientScript.RegisterStartupScript(this.GetType(), "Popup", "ShowPopup1('" + message + "');", true); 

2. FOR CALENDAR SAME CSS AND JAVASCRIPT
 

<script type="text/javascript">     $(function () {         $(window).bind('mousewheel DOMMouseScroll', function (event) {             if ($("#ui-datepicker-div").css("display") === "block") {                 $(".hasDatepicker").datepicker("hide");                 $(".hasDatepicker").blur();             }         });         $('#<%= txtFlightDate.ClientID %>').datepicker({             buttonImage: "calendar.png",             buttonImageOnly: true,             changeYear: true,             changeMonth: true,             yearRange: "2000:2025",             autoSize: true,             dateFormat: "yy-mm-dd"         });     }); </script>