1

I am trying to do 2 things here

1.Custom file upload using Lightning:fileupload 2. List of files attached to the same record.

I an hoping after a file is uploaded, the list should refresh after the file upload.

enter image description here

I am not able to refresh the 2nd component after a file is uploaded by 1st component.

Code below:

-->

    <lightning:fileUpload  name="fileUploader"
                          label= "Upload files"
                          multiple="{!v.multiple}"
                          accept="{!v.accept}"
                          disabled="{!v.disabled}"
                          recordId="{!v.recordId}"
                          onuploadfinished="{!c.handleUploadFinished}"/>
</lightning:card>

<c:ListOfFiles recordId="{!v.recordId}"/>

2nd component:

<aura:attribute name="filelist" 
                type="ListWrapper.DisplayRecords[]" />  

<aura:attribute name="recordId" type="Id" />
<aura:attribute name="myBool" type="Boolean" default="true"/>
<aura:attribute name="selectedDocumentId" type="string"/>
<aura:attribute name="hasModalOpen" type="boolean" default="false"/>


<!--- on initialization of component init event will fire and doInit action will execute-->
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:handler name="change" value="{!v.myBool}" action="{!c.doInit}"/>


<div class="slds-card_boundary">
    <h2>Files</h2>
    <table class="slds-table slds-table_cell-buffer slds-table_bordered">
        <thead>
            <tr class="slds-line-height_reset">
                <th></th>
                <!--<th>Id</th>-->
                <th class="slds-text-title_caps" scope="col">
                 <div class="slds-truncate" title="Title">Title</div>
                </th>
                <th class="slds-text-title_caps" scope="col">
                 <div class="slds-truncate" title="File Size">File Size</div>
                </th>
                <th class="slds-text-title_caps" scope="col">
                <div class="slds-truncate" title="File Type">File Type</div>
                </th>
                <th class="slds-text-title_caps" scope="col">
                <div class="slds-truncate" title="File Size">Sharing</div>
                </th>
            </tr>
        </thead>
        <tbody>
            <!-- TO Check if list is not empty-->
            <aura:if isTrue="{!!empty(v.filelist)}">
                <aura:iteration var="files" items="{!v.filelist}" >
                    <tr>
                        <td><ui:inputCheckbox value="{!files.isSelected}"/></td>
                        <td>
                            <a onclick="{!c.getSelected}" data-Id="{!files.ContentDocId}">{!files.Title}</a>
                            </td>
                        <td><ui:outputText value="{!files.Createby.name}"/></td>
                        <td><ui:outputText value="{!files.ContentSize}"/></td>
                        <td><ui:outputText value="{!files.FileType}"/></td>
                        <td><ui:outputText value="{!files.SharingType}"/></td>

                    </tr>
                </aura:iteration>
            </aura:if>
        </tbody>
    </table>
     <!--###### FILE PREVIEW MODAL BOX START ######--> 
<aura:if isTrue="{!v.hasModalOpen}">
    <section onclick="{!c.closeModel}"
             role="dialog"
             aria-modal="true"
             class="slds-modal slds-fade-in-open">
        <div class="slds-modal__container">
            <div class="slds-modal__content slds-p-around_medium slds-text-align_center"
                 style="background: transparent;">
                <div style="width: 50%; margin: 0 auto; text-align: left">
                    <!--<lightning:fileCard> to preview file using content document Id -->
                    <lightning:fileCard fileId="{!v.selectedDocumentId}"/>
                </div>
            </div>
        </div>
    </section>
    <div class="slds-backdrop slds-backdrop_open"></div>
</aura:if>
<!--###### FILE PREVIEW MODAL BOX END ######-->
    <br/>
    <lightning:button label="Mark Private" onclick="{!c.doSomething}"/>
</div>

1 Answer 1

3

From your parent component, you can use aura:method to call child component method.

Define this in child component

<aura:method name="sampleMethod" action="{!c.doInit}" description="Calling chld method">

and in the parent component's handleUploadFinished method call the child component method.

var childCmp = component.find('childCmp'); //childcmp is the aura:id of child component
childCmp.sampleMethod();

Aura:Method

1
  • @HaraPrasadSahoo then you can accept the answer and close this question. Jan 10, 2019 at 11:31

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .