-
ChatterFeed
-
0Best Answers
-
0Likes Received
-
0Likes Given
-
2Questions
-
4Replies
upload images with lightning:inputRichText
I'm not sure if I am just completely missing something or no one asks this question but I can't find a solution to this. I have a requirement to be able to upload images into the body of a rich text field which is being used to facilitate back and fourth communication in a SFDC community <> console.
I've built a lightning app which works well except I can't figure out how I'm supposed to upload images into the field. Is lightning:inputRichText even capable of doing so? There is no documentation that says it doesn't and it's supposed to replace the legacy ui:richText field (which does not allow for local import anyways). I've also tried the CKEditor approach and that also does not support local import, not to mention with lockerservice enabled it does not render.
Whats weird is the editor we use here allpows for this functionality!!! I'm totally stumped, any help is appreciated.
Here is my component in case it helps:
I've built a lightning app which works well except I can't figure out how I'm supposed to upload images into the field. Is lightning:inputRichText even capable of doing so? There is no documentation that says it doesn't and it's supposed to replace the legacy ui:richText field (which does not allow for local import anyways). I've also tried the CKEditor approach and that also does not support local import, not to mention with lockerservice enabled it does not render.
Whats weird is the editor we use here allpows for this functionality!!! I'm totally stumped, any help is appreciated.
Here is my component in case it helps:
<aura:component controller="caseCommentsController" implements="force:appHostable,forceCommunity:availableForAllPageTypes,force:hasRecordId" access="global">
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:attribute name="comments" type="Case_Comments__c[]"/>
<aura:attribute name="newComment" type="Case_Comments__c"
default="{ 'sobjectType': 'Case_Comments__c'
}"/>
<!-- display case comments -->
<div class="container slds-p-top--medium">
<div id="list" class="row">
<aura:iteration items="{!v.comments}" var="comment">
<c:caseCommentsList comment="{!comment}"/>
</aura:iteration>
</div>
</div>
<!-- input form using components -->
<div class="container slds-p-top--large">
<form class="slds-form--stacked">
<div class="slds-form-element">
<div class="slds-form-element__control">
<!-- ui:inputText aura:id="caseid" disabled="true"
value="{!v.newComment.Case__c}"/ -->
</div>
</div>
<div class="slds-form-element">
<div class="slds-form-element__control">
<lightning:inputRichText aura:id="addComment"
disabledCategories="FORMAT_FONT"
placeholder="Add a comment..."
value="{!v.newComment.Comment__c}"/>
<!-- ui:inputRichText aura:id="addComment" required="true" placeholder="Add a comment..."
value="{!v.newComment.Comment__c}"/ -->
</div>
</div>
<div class="slds-form-element">
<ui:button label="Add Comment"
class="slds-button slds-button--neutral"
labelClass="label"
press="{!c.createComment}"/>
</div>
</form>
</div><!-- ./container-->
</aura:component>
-
- JDallas
- April 18, 2017
- Like
- 0
rerender not working
I developed a hybrid visualforce/lightning page with a custom save method using an extension to be used as a console sidebar. The page and save method work fine but I can't get the rerender to fire using my current format. I've isolated the issue but i'm not sure how to fix it. I'm pretty sure the varibale is coming back null so the apex:outputPanel can't see the change in picklist value.
I've isolated the issue at the inputField here:
Here is the full vf page with the issue located between rows 325-329
I've isolated the issue at the inputField here:
<apex:actionRegion >
<apex:inputField id="pri" value="{!c.Priority__c}" required="true">
<apex:actionSupport event="onchange" rerender="casePB" />
</apex:inputField>
</apex:actionRegion>
When I adjust the value {!c.priority__c} to {!case.priority__c} like below the rerender works but the save method does not for this field:
<apex:actionRegion >
<apex:inputField id="pri" value="{!case.Priority__c}" required="true">
<apex:actionSupport event="onchange" rerender="casePB" />
</apex:inputField>
</apex:actionRegion>
Here is the full vf page with the issue located between rows 325-329
<apex:page standardController="case" extensions="caseInlineEditExt,caseStatusDetailsExt" sidebar="false" docType="html-5.0">
<!-- import the lightning design system style sheet -->
<apex:slds />
<!-- load latest jquery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- load support console js library -->
<apex:includeScript value="/support/console/39.0/integration.js"/>
<script type="text/javascript">
function setFocusOnLoad() {}
</script>
<!-- hide and show function -->
<script type="text/javascript">
$(document).ready(function(){ /* on load hide items */
$('#show').show();
$("#hide").hide();
$(".problem-detail").hide();
});
$(document).ready(function(){
$("#hide").click(function(){ /* hide on click*/
$(".problem-detail").hide();
$("#show").show();
$("#hide").hide();
});
$("#show").click(function(){ /* show on click */
$(".problem-detail").show();
$("#show").hide();
$("#hide").show();
});
});
</script>
<style>
.requiredBlock {
display: none !important;
}
.req {
color: #CC0000 !important;
}
.slds-form-element__label {
font-weight: 700;
}
.slds-col {
padding: 5px !important;
width: 50% !important;
}
.apexp .bPageBlock.apexDefaultPageBlock .pbBody .pbSubheader .hideListButton {
background-position: 1px -11px;
}
.apexp .bPageBlock.apexDefaultPageBlock .pbBody .pbSubheader .showListButton {
background-position: 1px 0;
}
body .bPageBlock {
border: none !important;
}
.slds-scope input[type=submit] {
position: relative;
display: inline-block;
padding: 0;
background: 0 0;
background-clip: border-box;
border: 1px solid transparent;
border-radius: .25rem;
font-size: .75rem;
line-height: 1.875rem;
text-decoration: none;
color: #0070d2;
-webkit-appearance: none;
white-space: normal;
padding-left: 1rem;
padding-right: 1rem;
text-align: center;
vertical-align: middle;
border: 1px solid #d8dde6;
background-color: #fff;
width: 100%
}
.slds-scope .slds-has-divider--bottom {
margin-bottom: 10px;
border: none;
}
body {
background-color: #FFFFFF !important;
}
.slds-scope .slds-form-element__static {
width: 100% !important;
}
.slds-scope * {
border: none;
}
.slds-scope input {
background-color: #FFFFFF;
border: 1px solid #d8dde6;
border-radius: 2px;
padding: 5px;
width: 90%;
}
.slds-scope text {
width: 90% !important;
background-color: #FFFFFF;
border: 1px solid #d8dde6;
border-radius: 2px;
height: 28px;
}
.slds-scope textarea {
width: 100% !important;
background-color: #FFFFFF;
border: 1px solid #d8dde6;
border-radius: 2px;
padding: 5px;
}
.slds-scope select {
width: 100%;
background-color: #FFFFFF;
border: 1px solid #d8dde6;
border-radius: 2px;
padding: 5px;
height: 28px;
}
.lookup input {
width: 78% !important;
}
.lookup select {
width: 18% !important;
min-width: 65px;
}
.full-width input {
width: 100% !important;
}
body .bPageBlock {
background-color: #FFFFFF !important;
}
h2.mainTitle {
display: none !important;
}
.problem-detail {
word-wrap: break-word;
}
.problem-info .log {
color: #AEAEAE !important;
font-weight: 300 !important;
}
.heading-link {
color: #16325c !important;
text-decoration: none;
}
.link{
color: #0070d2;
text-decoration: none;
}
a {
color: #0070d2;
text-decoration: none;
}
.detail-info {
background-color: #FFFFFF !important;
padding: 10px;
}
.apexp .bPageBlock.apexDefaultPageBlock .pbBody .pbSubheader,
.pbSubheader {
border: none !important;
background-color: #FFFFFF !important;
border-radius: 2px;
}
body .bPageBlock .pbBody .pbSubheader h3 {
display: inline !important;
}
.apexp .bPageBlock.apexDefaultPageBlock .pbBody .pbSubheader h3 {
font-family: "Salesforce Sans",Arial,sans-serif;
color: #16325c !important;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Salesforce Sans",Arial,sans-serif;
color: #16325c !important;
}
.hideListButton,
.showListButton {
margin-bottom: 7px !important;
}
</style>
<div class="slds-scope">
<!-- begin case issue -->
<div class="problem-info slds-panel slds-grid slds-grid--vertical slds-nowrap">
<div class="slds-panel__section">
<h3 class="heading-link slds-text-heading--medium"><apex:outputField value="{!c.Problem_Statement_Question__c}"/></h3>
<h3 class="log text-body--default"><span class="link"><apex:outputField value="{!c.contactid}"/></span> reported <apex:outputField value="{!c.createddate}"/> via <apex:outputField value="{!c.origin}"/></h3>
<button class="slds-button" href="#" id="show">Show Problem Details</button>
<button class="slds-button" href="#" id="hide">Hide Problem Details</button>
<div class="problem-detail">
<h3 class="text-body--default">{!c.Problem_Details__c}</h3>
</div>
</div>
</div>
<!-- end case issue -->
<apex:form >
<apex:pageBlock id="casePB">
<apex:pageMessages />
<!-- begin contact information -->
<apex:pageBlockSection columns="1" title="Contact Information">
<apex:pageBlockSectionItem >
<apex:outputPanel layout="none">
<div class="slds-grid"><!-- begin grid -->
<div class="left slds-col"><!-- begin left column -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Contact <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.contactid}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Phone <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:outputField value="{!c.contactphone}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Mobile</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:outputField value="{!c.contactmobile}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Email <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:outputField value="{!c.contactemail}"/>
</span>
</div>
</div>
</div><!-- end left column -->
<div class="right slds-col"><!-- begin right column -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Account <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.accountid}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Requesting Company</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Requesting_Company__c}"/>
</span>
</div>
</div>
</div><!-- end right column -->
</div><!-- end grid -->
</apex:outputPanel>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
<!-- begin problem information -->
<apex:pageBlockSection columns="1" title="Problem Information">
<apex:pageBlockSectionItem >
<apex:outputPanel layout="none">
<div class="slds-grid"><!-- begin grid -->
<div class="left slds-col"><!-- begin left column -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Severity <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:actionRegion >
<apex:inputField id="severity" value="{!c.Severity__c}" required="true">
<apex:actionSupport event="onchange" rerender="casePB" />
</apex:inputField>
</apex:actionRegion>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Priority <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:actionRegion >
<apex:inputField id="pri" value="{!c.Priority__c}" required="true">
<apex:actionSupport event="onchange" rerender="casePB" />
</apex:inputField>
</apex:actionRegion>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Problem Type <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.type}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">AtScale Version <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.AtScale_Version__c}" required="true"/>
</span>
</div>
</div>
</div><!-- end left column -->
<div class="right slds-col"><!-- begin right column -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Status <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.status}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">SubStatus <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.SubStatus__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Product Component <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Product_Component__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Product SubComponent <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Product_SubComponent__c}" required="true"/>
</span>
</div>
</div>
</div><!-- end right column -->
</div><!-- end grid -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Problem Statement/Question</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Problem_Statement_Question__c}" required="true"/>
</span>
</div>
</div>
<apex:outputPanel id="hpOPP" rendered="{!IF(case.Priority__c = 'High - 4 hour response expected', true, false)}" layout="none">
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">High Priority Business Justification <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField id="hpIPF" value="{!c.High_Priority_Business_Justification__c}"/>
</span>
</div>
</div>
</apex:outputPanel>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Current Status <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Current_Status__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Next Steps <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Next_Steps__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Jira Bug</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static full-width">
<apex:inputField value="{!c.Jira_Bug__c}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Jira Feature Request</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static full-width">
<apex:inputField value="{!c.Jira_Feature_Request__c}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Fix in Version</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Fix_in_Version__c}"/>
</span>
</div>
</div>
</apex:outputPanel>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
<!-- case information -->
<apex:pageBlockSection columns="1" title="Case Information">
<apex:pageBlockSectionItem >
<apex:outputPanel layout="none">
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Owner <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static lookup">
<apex:inputField value="{!c.ownerid}" required="false"></apex:inputField>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Deployment Phase <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Deployment_Phase__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Escalated</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Escalated__c}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Opened</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:outputField value="{!c.createddate}"/>
</span>
</div>
</div>
<apex:commandButton action="{!save}" value="Update Case"/>
</apex:outputPanel>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:form>
</div>
</apex:page>
Here is my extestion class with the save method and redirect back to the edit page:
public class caseInlineEditExt {
public case c { get; set; }
public caseInlineEditExt(ApexPages.StandardController stdCtrl) {
case currentRecord = (case) stdCtrl.getRecord();
c = [SELECT Id, createddate, origin, casenumber, type, status, contactid, contactemail, contact.firstname, ownerid,
contact.lastname, contactphone, contactmobile, accountid, requesting_company__c, problem_statement_question__c,
assisted_by__c, atscale_version__c, case_issue__c, current_status__c, date_time_resolved__c, deployment_phase__c,
escalated__c, fix_in_version__c, high_priority_business_justification__c, jira_bug__c, jira_feature_request__c, next_steps__c,
priority__c, problem_details__c, product_component__c, product_subcomponent__c, resolution__c, root_cause__c, severity__c,
substatus__c, priority FROM case WHERE Id = :currentRecord.id];
}
public PageReference quickUpdate() {
update c;
return ApexPages.CurrentPage();
}
}
-
- JDallas
- March 15, 2017
- Like
- 0
upload images with lightning:inputRichText
I'm not sure if I am just completely missing something or no one asks this question but I can't find a solution to this. I have a requirement to be able to upload images into the body of a rich text field which is being used to facilitate back and fourth communication in a SFDC community <> console.
I've built a lightning app which works well except I can't figure out how I'm supposed to upload images into the field. Is lightning:inputRichText even capable of doing so? There is no documentation that says it doesn't and it's supposed to replace the legacy ui:richText field (which does not allow for local import anyways). I've also tried the CKEditor approach and that also does not support local import, not to mention with lockerservice enabled it does not render.
Whats weird is the editor we use here allpows for this functionality!!! I'm totally stumped, any help is appreciated.
Here is my component in case it helps:
I've built a lightning app which works well except I can't figure out how I'm supposed to upload images into the field. Is lightning:inputRichText even capable of doing so? There is no documentation that says it doesn't and it's supposed to replace the legacy ui:richText field (which does not allow for local import anyways). I've also tried the CKEditor approach and that also does not support local import, not to mention with lockerservice enabled it does not render.
Whats weird is the editor we use here allpows for this functionality!!! I'm totally stumped, any help is appreciated.
Here is my component in case it helps:
<aura:component controller="caseCommentsController" implements="force:appHostable,forceCommunity:availableForAllPageTypes,force:hasRecordId" access="global">
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:attribute name="comments" type="Case_Comments__c[]"/>
<aura:attribute name="newComment" type="Case_Comments__c"
default="{ 'sobjectType': 'Case_Comments__c'
}"/>
<!-- display case comments -->
<div class="container slds-p-top--medium">
<div id="list" class="row">
<aura:iteration items="{!v.comments}" var="comment">
<c:caseCommentsList comment="{!comment}"/>
</aura:iteration>
</div>
</div>
<!-- input form using components -->
<div class="container slds-p-top--large">
<form class="slds-form--stacked">
<div class="slds-form-element">
<div class="slds-form-element__control">
<!-- ui:inputText aura:id="caseid" disabled="true"
value="{!v.newComment.Case__c}"/ -->
</div>
</div>
<div class="slds-form-element">
<div class="slds-form-element__control">
<lightning:inputRichText aura:id="addComment"
disabledCategories="FORMAT_FONT"
placeholder="Add a comment..."
value="{!v.newComment.Comment__c}"/>
<!-- ui:inputRichText aura:id="addComment" required="true" placeholder="Add a comment..."
value="{!v.newComment.Comment__c}"/ -->
</div>
</div>
<div class="slds-form-element">
<ui:button label="Add Comment"
class="slds-button slds-button--neutral"
labelClass="label"
press="{!c.createComment}"/>
</div>
</form>
</div><!-- ./container-->
</aura:component>
- JDallas
- April 18, 2017
- Like
- 0
rerender not working
I developed a hybrid visualforce/lightning page with a custom save method using an extension to be used as a console sidebar. The page and save method work fine but I can't get the rerender to fire using my current format. I've isolated the issue but i'm not sure how to fix it. I'm pretty sure the varibale is coming back null so the apex:outputPanel can't see the change in picklist value.
I've isolated the issue at the inputField here:
Here is the full vf page with the issue located between rows 325-329
I've isolated the issue at the inputField here:
<apex:actionRegion >
<apex:inputField id="pri" value="{!c.Priority__c}" required="true">
<apex:actionSupport event="onchange" rerender="casePB" />
</apex:inputField>
</apex:actionRegion>
When I adjust the value {!c.priority__c} to {!case.priority__c} like below the rerender works but the save method does not for this field:
<apex:actionRegion >
<apex:inputField id="pri" value="{!case.Priority__c}" required="true">
<apex:actionSupport event="onchange" rerender="casePB" />
</apex:inputField>
</apex:actionRegion>
Here is the full vf page with the issue located between rows 325-329
<apex:page standardController="case" extensions="caseInlineEditExt,caseStatusDetailsExt" sidebar="false" docType="html-5.0">
<!-- import the lightning design system style sheet -->
<apex:slds />
<!-- load latest jquery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- load support console js library -->
<apex:includeScript value="/support/console/39.0/integration.js"/>
<script type="text/javascript">
function setFocusOnLoad() {}
</script>
<!-- hide and show function -->
<script type="text/javascript">
$(document).ready(function(){ /* on load hide items */
$('#show').show();
$("#hide").hide();
$(".problem-detail").hide();
});
$(document).ready(function(){
$("#hide").click(function(){ /* hide on click*/
$(".problem-detail").hide();
$("#show").show();
$("#hide").hide();
});
$("#show").click(function(){ /* show on click */
$(".problem-detail").show();
$("#show").hide();
$("#hide").show();
});
});
</script>
<style>
.requiredBlock {
display: none !important;
}
.req {
color: #CC0000 !important;
}
.slds-form-element__label {
font-weight: 700;
}
.slds-col {
padding: 5px !important;
width: 50% !important;
}
.apexp .bPageBlock.apexDefaultPageBlock .pbBody .pbSubheader .hideListButton {
background-position: 1px -11px;
}
.apexp .bPageBlock.apexDefaultPageBlock .pbBody .pbSubheader .showListButton {
background-position: 1px 0;
}
body .bPageBlock {
border: none !important;
}
.slds-scope input[type=submit] {
position: relative;
display: inline-block;
padding: 0;
background: 0 0;
background-clip: border-box;
border: 1px solid transparent;
border-radius: .25rem;
font-size: .75rem;
line-height: 1.875rem;
text-decoration: none;
color: #0070d2;
-webkit-appearance: none;
white-space: normal;
padding-left: 1rem;
padding-right: 1rem;
text-align: center;
vertical-align: middle;
border: 1px solid #d8dde6;
background-color: #fff;
width: 100%
}
.slds-scope .slds-has-divider--bottom {
margin-bottom: 10px;
border: none;
}
body {
background-color: #FFFFFF !important;
}
.slds-scope .slds-form-element__static {
width: 100% !important;
}
.slds-scope * {
border: none;
}
.slds-scope input {
background-color: #FFFFFF;
border: 1px solid #d8dde6;
border-radius: 2px;
padding: 5px;
width: 90%;
}
.slds-scope text {
width: 90% !important;
background-color: #FFFFFF;
border: 1px solid #d8dde6;
border-radius: 2px;
height: 28px;
}
.slds-scope textarea {
width: 100% !important;
background-color: #FFFFFF;
border: 1px solid #d8dde6;
border-radius: 2px;
padding: 5px;
}
.slds-scope select {
width: 100%;
background-color: #FFFFFF;
border: 1px solid #d8dde6;
border-radius: 2px;
padding: 5px;
height: 28px;
}
.lookup input {
width: 78% !important;
}
.lookup select {
width: 18% !important;
min-width: 65px;
}
.full-width input {
width: 100% !important;
}
body .bPageBlock {
background-color: #FFFFFF !important;
}
h2.mainTitle {
display: none !important;
}
.problem-detail {
word-wrap: break-word;
}
.problem-info .log {
color: #AEAEAE !important;
font-weight: 300 !important;
}
.heading-link {
color: #16325c !important;
text-decoration: none;
}
.link{
color: #0070d2;
text-decoration: none;
}
a {
color: #0070d2;
text-decoration: none;
}
.detail-info {
background-color: #FFFFFF !important;
padding: 10px;
}
.apexp .bPageBlock.apexDefaultPageBlock .pbBody .pbSubheader,
.pbSubheader {
border: none !important;
background-color: #FFFFFF !important;
border-radius: 2px;
}
body .bPageBlock .pbBody .pbSubheader h3 {
display: inline !important;
}
.apexp .bPageBlock.apexDefaultPageBlock .pbBody .pbSubheader h3 {
font-family: "Salesforce Sans",Arial,sans-serif;
color: #16325c !important;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Salesforce Sans",Arial,sans-serif;
color: #16325c !important;
}
.hideListButton,
.showListButton {
margin-bottom: 7px !important;
}
</style>
<div class="slds-scope">
<!-- begin case issue -->
<div class="problem-info slds-panel slds-grid slds-grid--vertical slds-nowrap">
<div class="slds-panel__section">
<h3 class="heading-link slds-text-heading--medium"><apex:outputField value="{!c.Problem_Statement_Question__c}"/></h3>
<h3 class="log text-body--default"><span class="link"><apex:outputField value="{!c.contactid}"/></span> reported <apex:outputField value="{!c.createddate}"/> via <apex:outputField value="{!c.origin}"/></h3>
<button class="slds-button" href="#" id="show">Show Problem Details</button>
<button class="slds-button" href="#" id="hide">Hide Problem Details</button>
<div class="problem-detail">
<h3 class="text-body--default">{!c.Problem_Details__c}</h3>
</div>
</div>
</div>
<!-- end case issue -->
<apex:form >
<apex:pageBlock id="casePB">
<apex:pageMessages />
<!-- begin contact information -->
<apex:pageBlockSection columns="1" title="Contact Information">
<apex:pageBlockSectionItem >
<apex:outputPanel layout="none">
<div class="slds-grid"><!-- begin grid -->
<div class="left slds-col"><!-- begin left column -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Contact <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.contactid}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Phone <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:outputField value="{!c.contactphone}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Mobile</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:outputField value="{!c.contactmobile}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Email <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:outputField value="{!c.contactemail}"/>
</span>
</div>
</div>
</div><!-- end left column -->
<div class="right slds-col"><!-- begin right column -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Account <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.accountid}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Requesting Company</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Requesting_Company__c}"/>
</span>
</div>
</div>
</div><!-- end right column -->
</div><!-- end grid -->
</apex:outputPanel>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
<!-- begin problem information -->
<apex:pageBlockSection columns="1" title="Problem Information">
<apex:pageBlockSectionItem >
<apex:outputPanel layout="none">
<div class="slds-grid"><!-- begin grid -->
<div class="left slds-col"><!-- begin left column -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Severity <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:actionRegion >
<apex:inputField id="severity" value="{!c.Severity__c}" required="true">
<apex:actionSupport event="onchange" rerender="casePB" />
</apex:inputField>
</apex:actionRegion>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Priority <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:actionRegion >
<apex:inputField id="pri" value="{!c.Priority__c}" required="true">
<apex:actionSupport event="onchange" rerender="casePB" />
</apex:inputField>
</apex:actionRegion>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Problem Type <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.type}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">AtScale Version <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.AtScale_Version__c}" required="true"/>
</span>
</div>
</div>
</div><!-- end left column -->
<div class="right slds-col"><!-- begin right column -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Status <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.status}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">SubStatus <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.SubStatus__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Product Component <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Product_Component__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Product SubComponent <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Product_SubComponent__c}" required="true"/>
</span>
</div>
</div>
</div><!-- end right column -->
</div><!-- end grid -->
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Problem Statement/Question</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Problem_Statement_Question__c}" required="true"/>
</span>
</div>
</div>
<apex:outputPanel id="hpOPP" rendered="{!IF(case.Priority__c = 'High - 4 hour response expected', true, false)}" layout="none">
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">High Priority Business Justification <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField id="hpIPF" value="{!c.High_Priority_Business_Justification__c}"/>
</span>
</div>
</div>
</apex:outputPanel>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Current Status <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Current_Status__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Next Steps <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Next_Steps__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Jira Bug</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static full-width">
<apex:inputField value="{!c.Jira_Bug__c}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Jira Feature Request</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static full-width">
<apex:inputField value="{!c.Jira_Feature_Request__c}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Fix in Version</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Fix_in_Version__c}"/>
</span>
</div>
</div>
</apex:outputPanel>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
<!-- case information -->
<apex:pageBlockSection columns="1" title="Case Information">
<apex:pageBlockSectionItem >
<apex:outputPanel layout="none">
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Owner <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static lookup">
<apex:inputField value="{!c.ownerid}" required="false"></apex:inputField>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Deployment Phase <span class="req">*</span></span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Deployment_Phase__c}" required="true"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Escalated</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:inputField value="{!c.Escalated__c}"/>
</span>
</div>
</div>
<div class="slds-form-element slds-hint-parent slds-has-divider--bottom">
<span class="slds-form-element__label">Opened</span>
<div class="slds-form-element__control">
<span class="slds-form-element__static">
<apex:outputField value="{!c.createddate}"/>
</span>
</div>
</div>
<apex:commandButton action="{!save}" value="Update Case"/>
</apex:outputPanel>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:form>
</div>
</apex:page>
Here is my extestion class with the save method and redirect back to the edit page:
public class caseInlineEditExt {
public case c { get; set; }
public caseInlineEditExt(ApexPages.StandardController stdCtrl) {
case currentRecord = (case) stdCtrl.getRecord();
c = [SELECT Id, createddate, origin, casenumber, type, status, contactid, contactemail, contact.firstname, ownerid,
contact.lastname, contactphone, contactmobile, accountid, requesting_company__c, problem_statement_question__c,
assisted_by__c, atscale_version__c, case_issue__c, current_status__c, date_time_resolved__c, deployment_phase__c,
escalated__c, fix_in_version__c, high_priority_business_justification__c, jira_bug__c, jira_feature_request__c, next_steps__c,
priority__c, problem_details__c, product_component__c, product_subcomponent__c, resolution__c, root_cause__c, severity__c,
substatus__c, priority FROM case WHERE Id = :currentRecord.id];
}
public PageReference quickUpdate() {
update c;
return ApexPages.CurrentPage();
}
}
- JDallas
- March 15, 2017
- Like
- 0
Lightning Rich Text display issue
Has abyone able to use Rich Texts as expected with lightning experience ? it displays as text area no matter what.
- Ulas Kutuk
- February 23, 2016
- Like
- 0
Related list for lead history
Hi All,
I want to add lead history as related history in Custom lead view visul force page, as below....
<apex:relatedList list="ActivityHistories" /> like what is for lead history tracking?????
Thanks.......
Mahendra
- mahe_developer
- July 07, 2011
- Like
- 0