Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Amr Ibrahim 42Amr Ibrahim 42 

visualforce page to work in lightning

Hi, We have our Calendar set-up as a custom visualforce page along with a custom setting for the event category RGB color that shows based on the field Event_Category, checkbox is checked for available in lightning on the visualforce page and the lightning stylesheets applied from the lightning experience configuration converter but when in lightning experience when a user clicks on a date to create a new event it shows error Unable to access page 
which in classic normaly opens up a new event record creation page
Unable to Access Page
You are missing information needed by the page you have attempted to access. If you believe this is an error, please refresh your screen. If the error persists, please report it to our Customer Support team and provide the URL of the page you were requesting as well as any other related information.

Your Help is appreciated 
Thanks
Dev-FoxDev-Fox
Hi Amr,
Check the check box in vf page setup "Available for Lightning Experience, Lightning Communities, and the mobile app".
 
Amr Ibrahim 42Amr Ibrahim 42
It is checked , User-added image
Dev-FoxDev-Fox
I hope you are using <apex:slds /> and lightning support tags.
If yes already, post vf code for better understanding.
Amr Ibrahim 42Amr Ibrahim 42
Thanks, i am basically an admin  not a developer quite yet so not at all familar below is the vf code ---
<!-- 
* Description: VisualForce Page of FullCalendar.
* Date: 07/12/2012
* Modified By: José Luis Almazán
* Comments: Adapting to new event object and compatible with standard events
*              (controlled by the "FullCalendarStdEventsCompatibility" custom setting)
*           It's multilingual
-->

<apex:page id="FullCalendarPage" controller="CalendarController" tabStyle="FullCalendar__tab" lightningstylesheets="true">
<!--CJS 2014-06-12
    <script>
      //Added By Sudhir for T-284645
      var previousSelectedAccount = '';
      var previousSelectedLead = '';
    </script>
    <c:WaitingComponent />
-->

    <apex:stylesheet value="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/cupertino/jquery-ui.css"/>
    <apex:stylesheet value="{!URLFOR($Resource.FullCalendar, 'fullcalendar.css' )}"/>
    <apex:stylesheet value="{!URLFOR($Resource.ContextMenu, 'jquery.contextMenu.css' )}"/>

    <style type="text/css">
        /* Calendar Styles */
        .datePicker {
            z-index: 9999;/*Changed this css property which was 100 prior*/
            position: absolute;
            display: none;
            top: 0;
            left: 0;
            width: 17em;
            background-color: #b7c6b2;
            border-bottom: 1px solid #000;
            border-right: 1px solid #000;
            margin: 0;
            padding: 1px 1px 2px 2px;
        }         
        .calendarEvent {
            background-color: white;
            padding: 10px;
/*             width: 700px;  */
        }
        .calendarEvent dt,
        .calendarEvent dd {
            margin-bottom: 10px;
        }
        .calendarEvent dt {
            clear: both;
            float: left;
            width: 165px; 
        }
        .calendarEvent dd {
            font-size: 12px;
/*             width: 225px; */
        }
        #eventOwnersLegend {
            border-collapse: collapse;
            border: solid 1px black;
            float: right;
            padding: 2px;
            width: 200px; 
        }
        .fc-event-a{
            text-decoration: none !important;
        }
        dt strong{
            color: red;
        }
        
        /* Context Menu Styles */
        .context-menu-item.icon-editSF {
            background-image:url("{!URLFOR($Resource.ContextMenu, 'images/page_white_editSF.png')}");
        }
        .context-menu-item {
            margin-left: 0px;
        }
        
        /* Search Styles */
        #phSearchContainerUser {
            margin-left: 0px !important;
            margin-top: 10px !important;
        }
        #filterUser.headerSearchBoxGhostText {
            color: #7d7d84;

        }
        .headerSearchLeftRoundedCorner #filterUser {
            background-color: white;
            border: 0px;
            color: #222;
            font-family: Arial;
            font-size: 100%;
            height: 16px;
            margin: 0px;
            padding: 0px;
            position: relative;
            top: 5px;
            width: 172px;
        }
        #phSearchClearButtonUser {
            background-color: white;
            background-image: url("/img/alohaSkin/search_clear_sprite.png");
            background-repeat: no-repeat;
            cursor: pointer;
            display: inline-block;
            float: right;
            height: 16px;
            margin-right: 1px;
            margin-top: 5px;
            overflow: hidden;
            width: 16px;
        }
        .headerSearchRightRoundedCorner #phSearchButtonUser {
            background: transparent url("/img/alohaSkin/unified_search_background_sprite.png") repeat-x scroll left -120px;
            border: 0px none;
            color: #1797c0;
            cursor: pointer;
            font-family: Arial;
            font-size: 90%;
            font-weight: bold;
            height: 24px;
            margin: 0px;
            overflow: visible;
            padding-left: 8px;
            padding-right: 0px;
            width: auto;
        }
        .rightRoundedCornerUser {



 
Amr Ibrahim 42Amr Ibrahim 42
            background: transparent url("/img/alohaSkin/unified_search_sprite.png") no-repeat scroll right -216px !important;
            border-left: 0px solid !important;
            cursor: auto !important;
            padding-left: 0px;
        }  
    </style>

    <apex:pageBlock >
        <!-- Filter User -->
        <apex:pageBlockSection title="Filter by assigned To " columns="1">
            <apex:form id="FilterUser">
                <apex:outputPanel >
                    <b><apex:outputLabel value="Assigned To :"/></b>
                    <input id="filterUser" size="60" name="str" defaultValue="{!$Label.FullCalendar_Search_User}" type="text" value="{!$Label.FullCalendar_Search_User}" />
                    <input id="filterUserIds" type="hidden"/>
                    &nbsp;&nbsp;&nbsp;<apex:commandButton action="{!URLFOR($Action.Event.NewEvent)}" value="New Event" rerender="newEvent"></apex:commandButton>
                </apex:outputPanel>
            </apex:form>
        </apex:pageBlockSection>
        <br/>

        <div id='calendar'></div>
        </apex:pageBlock>  

        <div id='editEventDialog' class='calendarEvent' style='display:none;'>

        <apex:outputPanel id="newEvent">
            <c:WaitingComponent />
            <apex:form id="mainForm">
                <apex:pageMessages />
<!--CJS 2014-06-12
                    <script>
                        function afterEventSave() {
                            if('{!errorsPresent}' == 'false') {
                                refreshPage();
                            }
                            if('{!selectedRelatedTo}' != '') {
                                ShowRelateTo('{!selectedRelatedTo}');
                            }
                        }
                        if('{!selectedRelatedTo}' != '') {
                            ShowRelateTo('{!selectedRelatedTo}');
                        }
                    </script>

        <dl>
            <dt><strong>*</strong> Record Type:</dt><dd><apex:inputField value="{!eventRef.Event_Category__c}" required="true"/></dd>
            <dt><strong>*</strong> {!$Label.FullCalendar_Type}:</dt><dd><apex:outputPanel id="evtType"><apex:inputField value="{!eventRef.Event_Type__c}" /></apex:outputPanel></dd>
            <dt><strong>*</strong> Assigned To:</dt><dd><apex:inputField value="{!eventRef.ownerID}" required="true"/></dd>
           
            <!-- Added By Reena for Task T-276823-->
<!--            <dt><strong >*</strong> Related To:</dt>
            <dd><apex:selectList value="{!selectedRelatedTo}" size="1" onchange="ShowRelateTo(this.value);" id="selectedRelatedTo">
                <apex:selectOptions value="{!RelatedToOptions}"/>
                </apex:selectList>
            
                <span id="whatIdInp" style="display:none"><apex:inputField value="{!startDateCalendar.AccountID}" id="accountField"/>  </span>            
                <span id="whoIdInp" style="display:none"><apex:inputField value="{!leadLookup.Lead__c}" id="leadField"/></span>  
            </dd> 
            
            <dt id="whoIdCont" style="display:none">&nbsp;&nbsp;Contact:</dt>
            <dd id="whoIdInpCont" style="display:none"><apex:inputField value="{!leadLookup.Contact__c}"/></dd>
            <!-- End Of Reena's changes for Task T-276823-->

<!--            <dt>&nbsp;&nbsp;Start Date Time:</dt>
            <dd>
                <c:NoCurrentDateLink >
                <apex:inputField id="startDate" value="{!startDateCalendar.birthDate}" onfocus="DatePicker.pickDate(false, this, false);"/>
                <apex:selectList value="{!startTime}" size="1">
                    <apex:selectOptions value="{!eventTimeList}"/>
                </apex:selectList>
                </c:NoCurrentDateLink>
            </dd>
            <dt>&nbsp;&nbsp;End Date Time:</dt>
            <dd>
                <c:NoCurrentDateLink >

                <apex:inputField value="{!endDateCalendar.birthDate}" onfocus="DatePicker.pickDate(false, this, false);" id="endDate"/>
                <apex:selectList value="{!endTime}" size="1">
                    <apex:selectOptions value="{!eventTimeList}"/>
                </apex:selectList>
                </c:NoCurrentDateLink>
            </dd>
            <dt>&nbsp;&nbsp;{!$Label.FullCalendar_All_Day}:</dt><dd><apex:inputField value="{!eventRef.IsAllDayEvent }"/></dd>
            <dt>&nbsp;&nbsp;Select Invitees: </dt>
            <dd>    
            <apex:outputPanel id="eventSearch">
                <apex:actionRegion >
                <label><b>Search</b></label> 
                <apex:selectList size="1" value="{!inviteeObject}">
                    <apex:selectOption itemValue="User" itemLabel="Users"/>
                    <apex:selectOption itemValue="Lead" itemLabel="Leads"/>
                    <apex:selectOption itemValue="Contact" itemLabel="Contacts"/>
                </apex:selectList>
                <apex:inputText value="{!searchString}"/>
                <apex:commandButton value="Find" action="{!searchInvitees}" rerender="eventSearch"/>               

<!--CJS 2014-05-27 changed size below from 14 to 7-->                
<!--                <c:MultiselectPicklist leftLabel="Available"
                    leftOptions="{!allInvitees}"
                    rightLabel="Selected"
                    rightOptions="{!selectedInvitees}"
                    size="7"
                    width="150px"/>  
                </apex:actionRegion>             
            </apex:outputPanel>
            </dd>

            <div style="text-align: center;">
                <apex:commandButton action="{!saveEvent}" value="Save" rerender="newEvent" onClick="lockScreen(true);" onComplete="afterEventSave();lockScreen(false);showSelectedRelatedTo();"/>
                <input type="button" value="Cancel" onclick="closeEditEvent();return false;" class="btn"/>
            </div>
         </dl> 
-->
          
</apex:form>
        </apex:outputPanel>
    </div>
    
    <div id='showEventDialog' class='calendarEvent' style='display:none'>
        <dl>
            <dt>Assigned To:</dt>
                <dd id='showOwner'></dd>        
            <dt>{!$Label.FullCalendar_Subject}:</dt>
                <dd id='showSubject'></dd>
<!--CJS 2014-06-09 Begin-->
            <dt>{!$Label.FullCalendar_Location}:</dt>
                <dd id='showLocation'></dd>
            <dt>{!$Label.FullCalendar_Category}:</dt>
                <dd id='showCategory'></dd>
<!--CJS 2014-06-09 End-->
            <dt>{!$Label.FullCalendar_Type}:</dt>
                <dd id='showType'></dd>
            <dt id='showWhoLabel'>{!$Label.FullCalendar_User}:</dt>
                <dd id='showWho'></dd>
            <dt>{!$Label.FullCalendar_What}:</dt>
                <dd id='showWhat'></dd>
            <dt>{!$Label.FullCalendar_Starts}:</dt>
                <dd id='showStart'></dd>
            <dt>{!$Label.FullCalendar_Ends}:</dt>
                <dd id='showEnd'></dd>
            <dt>{!$Label.FullCalendar_All_Day}:</dt>
                <dd id='showAllDay'></dd>
        </dl>
    </div>
    
    <div id='confirmChangeDialog' style='display:none'>
        <p id='changeMessage'>{!$Label.FullCalendar_Change_Event}?</p>
    </div>

    <br/>

    <div id='errorDialog' style='display:none'>
        <p id='errorMessage'></p>
    </div>

    <div id='eventOwnersLegend'>
<!--CJS 2014-06-18 begin
        <h2>{!$Label.FullCalendar_Event_Type_Legend}</h2><br/><br/> -->