Custom Calendar on VisualForce Page

There has always been a need to have a calendar component for visualforce page this kind of component can be used in events booking,events calendar,scheduling requirements and all the places where we need to show events by dates.
This can be easily implemented using jquery,fullcalendar plugin and json in apex.
So what we need here is
1.) Fullcalandar plugin Download
2.) A custom object with start dates and end dates for events
3.) Apex class to pull data from object and convert that into json using json.serailze
First we have to upload the fullcalendar lib to static resource and then we have to create a visualforce page with below code. 
The important thing is "JSONOFLIST" which is just json created from list of records by using

  JSONOFLIST = JSON.serialize(LIST OF SOBJECT);
It will give you  a calendar with items highlited on page


Source : http://www.saasanalogy.com/custom-calendar-on-visualforce-page/

Comments

Post a Comment

Popular posts from this blog

Salesforce.com: Expression Operators in Salesforce lightning Components

Image
Generally In every component implementation we have a need to  change the UI conditionally, or show/hide a section/column based on certain conditions. We need simple ways to do this instead of having every handler in code. Below are key operators and their syntax to handle any such situation Ternary Operator This expression uses the ternary operator to conditionally output one of two values dependent on a condition. 1 <a class="{!v.location == '/active' ? 'selected' : ''}" href="#/active">Active</a> The {!v.location == ‘/active’ ? ‘selected’ : ”} expression conditionally sets the class attribute of an HTML <a> tag, by checking whether the location attribute is set to /active . If true, the expression sets class to selected . Using <aura:if> for Conditional Markup <aura:attribute name="edit" type="Boolean" default="true"/> <aura:if isTrue=&qu
Read more

Salesforce.com: Create Custom Account Hierarchy in Lightning

Account Hierarchy is a very common feature required by many business and till now we dont have a component which works properly on lightning experience. Below is a small code which can be used for such a use case and can be extended where needed. Lightning App: <aura:application > <c:AccountTree ></c:AccountTree> </aura:application> Controller: public class AccConListController { @AuraEnabled public static List<Account> getAccounts(String accountId) { List<Account> accounts=[SELECT Id, Name FROM Account where id=:accountId]; return accounts; } @AuraEnabled public static List<Account> getChildAccounts(String ParentAccountid) { List<Account> accounts=[SELECT Id, Name FROM Account where parentid=:ParentAccountid limit 20]; return accounts; } } Inner Component for Tree <aura:component controller=”AccConListController” implements=”force:appHostable,flexipage:availableF
Read more