Snackbar/Toast In VF Page

Snackbar/Toast In VF Page


Code:
 <apex:page id="page" docType="html-5.0" standardStylesheets="true" showHeader="false" sidebar="false" applyHtmlTag="true" Controller="HHNGroupOrdercontrollerAlert">
<html xmlns="http://www.w3.org/1999/xhtml">
            <head>         
<style type="text/css">
                        #snackbar {
            visibility: hidden;
            min-width: 250px;
            margin-left: -125px;
            background-color: #333;
            color: #fff;
            text-align: center;
            border-radius: 2px;
            padding: 16px;
position: fixed;
z-index: 1;
left: 50%;
bottom: 600px;
font-size: 17px;
}
#snackbar.show {
visibility: visible;
          -webkit-animation: fadein 0.5s, fadeout 0.5s 3.5s;
           animation: fadein 0.5s, fadeout 0.5s 3.5s;
}
@-webkit-keyframes fadein {
from {bottom: 0; opacity: 0;} 
to {bottom: 300px; opacity: 1;}
}
@keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 300px; opacity: 1;}
}
@-webkit-keyframes fadeout {
from {bottom: 300px; opacity: 1;} 
to {bottom: 0; opacity: 0;}
}
@keyframes fadeout {
from {bottom: 300px; opacity: 1;}
to {bottom: 0; opacity: 0;}
}
   </style>
   <script>
            function myFunction() {
                        var x = document.getElementById("snackbar")
                        x.className = "show";
                        setTimeout(function(){ x.className = x.className.replace("show", ""); }, 4000);
}
</script>
</head>
<body>
<apex:form>
                        <div id="snackbar">  Error </div>
<apex:commandButton action="{!saveRec}" status="disablebtn" disabled="false" value="Submit" rerender="CustomerForm,td,dm" id="submit55"  oncomplete="myFunction()"/>
</apex:form>
</body>
</html>
</apex:page>

Result:

P.S: Comment Below for any Clarification or help!!
Happy working!! :) :) 

Comments

Post a Comment

Popular posts from this blog

Embed Special Characters in VF Page

Image
Embed & " < > and lot more symbols in VF Page using the below character sequence Code: <body>          <h1> Testing &amp; Blogging </h1>         </body> Result: &quot; " Double quote &amp; & Ampersand ("and" sign) &lt; < Less-than &gt; > Greater-than &nbsp; un-linebreak-able space &brvbar; ¦ Vertical line, maybe with gap in middle &copy; © Copyright sign (C in a circle) &frac14; ¼ One quarter &frac12; ½ One half &frac34; ¾ Three quarters &times; × Times sign: narrow x without serifs &divide; ÷ Division sign: a colon : with a dash through it P.S:  Comment Below for any Clarification or help!! Happy working!! :) :) 
Read more

Some Common Errors in the Visual flow

Error: An unhandled fault has occurred in this flow An unhandled fault has occurred while processing the flow. Please contact your system administrator for more information Solution:  You Would get a detailed error description to the register email. Error: An Apex error occurred: System.DmlException: Insert failed. First exception on row 0; first error: INVALID_CROSS_REFERENCE_KEY, Task Record Type ID: this ID value isn't valid for the user: : [RecordTypeId]  Solution: The user Might not have access to the Particular Record Type. Or you may be refreing to 15 Digit RecordType Id. Refer 18 Digit ID to solve the issue. Error: Error Occurred: The number of results does not match the number of interviews that were executed in a single bulk execution request. Solution: The size of the return value needs to match the input value. Resolved the issue by using void. P.S:  Comment Below for any Clarification or help!! Happy working!! :) :)  ...
Read more

Error: Compile Error: Illegal conversion from String to System.PageReference

Controller: public PageReference getURL(){ String    url='www.google.com'; //your Logic return url; }  When you save it would throw and error Error: Compile Error: Illegal conversion from String to System.PageReference you were supposed to return a PageRefernce( A PageReference is a reference to an instantiation of a page ) not Just simple String Solution: Create an instantiation of a page and return the instance. public PageReference getURL(){ String    url='www.google.com'; //your Logic PageReference pageRef = new PageReference(url); return pageRef; } P.S:  Comment Below for any Clarification or help!! Happy working!! :) :) 
Read more