On the Standard-Related-List "Notes" there is a New Button. This New Button opens a Panel on the bottom of the screen like this:

enter image description here

How can I invoke the opening of this "New Note" Panel? I've tried so far (from Visualforce-context) sforce.one.createRecord('ContentNote',null,{Title:"test"}); which should pretty much be similar to $A.get("e.force:createRecord"); but unfortunately, this only looks very poor:

enter image description here

It is important to say, that there is no field on ContentNote which allows to link the note to the parent object. This is missing, because one ContentNote can relate to many parent SObject, so it is an m:n Relationship, hence a Junction Object is used in the data model called ContentDocumentLink. I suppose this is one of the reasons, why createRecord is doing so bad for the ContentNote entity.


Is there any way to make it better in order to create new notes in my own components and visualforce pages? Or do I have to write my Notes editor from the scratch?

  • Did you find any way out for creating New Notes properly in Lightning? – VarunC Dec 1 '17 at 14:42
  • @VarunC sadly nothing good so far... – Uwe Heim Dec 18 '17 at 13:08
  • @UweHeim nothing new on this i imagine? I tried using force:editRecord w an existing note and got the same as the screenshot above. the only thing i've gotten to work (for editing an existing note) is pure ugliness : window.open("hotpotato-dev-ed.lightning.force.com" + noteId); – gorav Apr 19 '18 at 16:19

I have Created one custom component which can be used as a quick action and it enables you to create the note related to the current record.

Look what I have done:-

enter image description here

Here is my code:-


<aura:component controller="CreateNoteRecord" 
                access="global" >
    <!-- Define Attribute-->
    <aura:attribute name="note" type="ContentNote" default="{'sobjectType': 'ContentNote','Title': '','Content': ''}"/>

    <div class="slds-m-around--xx-large">
        <div role="dialog" tabindex="-1" aria-labelledby="header99" class="slds-modal slds-fade-in-open ">
            <div class="slds-modal__container">
                <div class="slds-modal__header">
                    <button class="slds-button slds-modal__close slds-button--icon-inverse" title="Close" onclick="{!c.closeModel}">
                        <span class="slds-assistive-text">Close</span>
                    <h2 id="header99" class="slds-text-heading--medium">Creating Custom Note</h2>
                <div class="slds-modal__content slds-p-around--medium">
                    <div class="slds-page-header">
                        <div class="slds-media">
                            <div class="slds-media__body">
                                    <h1 class="slds-page-header__title slds-truncate slds-align-middle" title="Requests User Guides">New Note</h1>
                    <ui:inputText class="form-control" value="{!v.note.Title}"/>
                    <lightning:inputRichText value="{!v.note.Content}" placeholder="Type something interesting"/>
                    <div class="slds-modal__footer">
                        <div class="col-md-4 text-center">
                            <ui:button class="btn btn-default" press="{!c.create}">Create</ui:button>
                             <ui:button class="btn btn-default" press="{!c.closeModel}">Cancel</ui:button>

JavaScript Controller:-

    create : function(component, event, helper) {
        //getting the candidate information
        var candidate = component.get("v.note");
        //Calling the Apex Function
        var action = component.get("c.createRecord");
        //Setting the Apex Parameter
            nt : candidate,
            PrentId : component.get("v.recordId")
        //Setting the Callback
            //get the response state
            var state = a.getState();
            //check if result is successfull
            if(state == "SUCCESS"){
                //Reset Form
                var newCandidate = {'sobjectType': 'ContentNote',
                                    'Title': '',
                                    'Content': ''
                //resetting the Values in the form
            } else if(state == "ERROR"){
                alert('Error in calling server side action');
        var navEvt = $A.get("e.force:navigateToSObject");
            "recordId": component.get("v.recordId"),
            "slideDevName": "detail"
        //adds the server-side action to the queue        
    closeModel : function (component, event, helper) {
        var navEvt = $A.get("e.force:navigateToSObject");
            "recordId": component.get("v.recordId"),
            "slideDevName": "detail"


.THIS .slds-modal__container{
       max-width: 50rem !important;
       width:100% !important;


APEX Controller:-

public with sharing class CreateNoteRecord {
    public static void createRecord (ContentNote nt, id PrentId){
            if(nt != null){
                insert nt;
                ContentDocument cd=[select id from ContentDocument where id=:nt.Id];
                ContentDocumentLink cdl=new ContentDocumentLink();
                insert cdl;
        } catch (Exception ex){


Once the note is getting created, I am inserting the ContentDocumentLink object to link the current record to this note.

Hope it helps you.

  • nice work! I will test it the next time I need this – Uwe Heim Sep 12 '18 at 12:02
  • @UweHeim WelCome :) But it still needs more modification to make it as much powerful as standard one in terms of functionality – sanket kumar Sep 12 '18 at 12:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.