apex:inputFile can not be used in conjunction with an action component

<apex:page standardController="Order" extensions="orderPageLayoutController">    
    <apex:form id="fm">
<apex:pageBlock id="pbsk">	
            <apex:pageBlockSection title="Order Terms and Client POC Details" columns="2">
                <apex:pageblocksectionItem >
                    <apex:outputlabel value="Invoice Contact" />
                    <apex:actionRegion >
                        <apex:inputField value="{!Order.Invoice_Contact__c}" required="true">
                            <apex:actionSupport event="onchange" action="{!autoFillData}" reRender="conEmail,conPhone"/>   
                        </apex:inputField>
                    </apex:actionRegion>
                </apex:pageblocksectionItem>
                <apex:inputField value="{!Order.Invoice_Email__c}" id="conEmail"/>
                <apex:inputField value="{!Order.Invoice_Phone__c}" id="conPhone"/>
                <apex:repeat value="{!$ObjectType.Order.FieldSets.Contact_Name_and_Payment_Terms}" var="f">                             
                    <apex:inputField value="{!Order[f]}"  required="{!OR(f.required, f.dbrequired)}" />
                </apex:repeat>
            </apex:pageBlockSection>   
</apex:pageBlock>
</apex:form>			
            
    <!-- File Uplaod Section -->
    <apex:form enctype="multipart/form-data">
        <apex:pageBlock id="thePageBlock" >
            <apex:pageBlockSection title="Upload Related Files" columns="1">
                <apex:pageMessages />
            </apex:pageBlockSection>
            <apex:pageBlockSection showHeader="false" columns="1" id="block1">
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="File Name" for="fileName"/>
                    <apex:inputField value="{!theConVer.title}" styleClass="slds-input slds-size_1-of-2"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="File" for="file"/>
                    <apex:inputFile value="{!theConVer.versionData}" fileName="{!fileName}" id="file" />
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Document Type"/>
                    <apex:inputField value="{!theConVer.Document_Type__c}" styleClass="slds-listbox slds-input slds-size_1-of-2" required="true" />
                </apex:pageBlockSectionItem>
            </apex:pageBlockSection>
            <input id="uploadButton" type="button" value="Upload file" name="uploadFile" onclick="uploadFileToTemp()" />			   
        </apex:pageBlock>
        <apex:actionFunction action="{!uploadFile}" name="uploadFile" reRender=""/>
    </apex:form> 
    
	<script type="text/javascript">
    function uploadFileToTemp(){
        document.getElementById ('uploadButton').disabled = true;
        uploadFile();    
    }
    </script>
	
</apex:page>

Hello,

Can anyone help me out to fix the rerender with apex:inputfile issue :

November 20, 2019
·
Answer
·
Like
0
·
Follow
2

Shravan Kumar 71
I have two section on the page : One where user enter details and the other where user upload the file. So when user click on Upload File button, the file should get saved to a custom object (this is working as expected), however after clicking on the button the entire page gets refreshed so the details entered in the above section needs to be refilled. The requirement is to refresh only the Upload File section when Upload File button is clicked.

November 20, 2019
·
Like
0
·
Dislike
0

Devi Chandrika (Salesforce Developers)
Hi shravan ,
For this you can use command button and in the reRender attribute of command button give id of the pageblock you want to refresh.
Try this one
<apex:commandButton value="Upload file" action="{!uploadFileToTemp}" reRender="thePageBlock"/>

https://developer.salesforce.com/docs/atlas.en-us.pages.meta/pages/pages_compref_commandButton.htm

Hope this helps you
If this helps kindly mark it as solved so that it may help others in future.

Thanks and Regards

November 20, 2019
·
Like
0
·
Dislike
0

Shravan Kumar 71
I have already tried that, below is the error message that I get :

November 20, 2019
·
Like
0
·
Dislike
0

Devi Chandrika (Salesforce Developers)
Try using only one form by wrapping both the pageblocks into same form.I tried sample code in my org.It is working fine for me.It's a best practice to use only one <apex:form> tag in a page or custom component.

Hope this helps you
If this helps kindly mark it as solved so that it may help others in future.

Thanks and Regards

November 20, 2019
·
Like
0
·
Dislike
0

Shravan Kumar 71
Nope that's didn't help either. Here is the revised code :
<apex:page standardController="Order" extensions="orderPageLayoutController"> <apex:page> <apex:form id="fm"> <c:LoadingScreen /> <apex:outputPanel id="error"><apex:pageMessages id="showmsg"></apex:pageMessages></apex:outputPanel> <apex:pageBlock id="pbsk"> <apex:pageBlockSection title="Order Terms and Client POC Details" columns="2"> <apex:pageblocksectionItem > <apex:outputlabel value="Invoice Contact" /> <apex:actionRegion > <apex:inputField value="{!Order.Invoice_Contact__c}" required="true"> <apex:actionSupport event="onchange" action="{!autoFillData}" reRender="conEmail,conPhone"/> </apex:inputField> </apex:actionRegion> </apex:pageblocksectionItem> <apex:inputField value="{!Order.Invoice_Email__c}" id="conEmail"/> <apex:inputField value="{!Order.Invoice_Phone__c}" id="conPhone"/> <apex:repeat value="{!$ObjectType.Order.FieldSets.Contact_Name_and_Payment_Terms}" var="f"> <apex:inputField value="{!Order[f]}" required="{!OR(f.required, f.dbrequired)}" /> </apex:repeat> </apex:pageBlockSection> </apex:pageBlock>  <apex:pageBlock id="thePageBlock" > <apex:pageBlockSection title="Upload Related Files" columns="1"> <apex:pageMessages /> </apex:pageBlockSection> <apex:pageBlockSection showHeader="false" columns="1" id="block1"> <apex:pageBlockSectionItem > <apex:outputLabel value="File Name" for="fileName"/> <apex:inputField value="{!theConVer.title}" styleClass="slds-input slds-size_1-of-2"/> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem > <apex:outputLabel value="File" for="file"/> <apex:inputFile value="{!theConVer.versionData}" fileName="{!fileName}" id="file" /> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem > <apex:outputLabel value="Document Type"/> <apex:inputField value="{!theConVer.Document_Type__c}" styleClass="slds-listbox slds-input slds-size_1-of-2" required="true" /> </apex:pageBlockSectionItem> </apex:pageBlockSection> <apex:pageBlockSection > <div align="center"> <apex:commandButton action="{!UploadFile}" value="Upload File" reRender="pbsk" styleClass="slds-button slds-button_brand"/> </div> </apex:pageBlockSection> </apex:pageBlock> </apex:form> </apex:page>

November 20, 2019
·
Like
0
·
Dislike
0

Foram Rana R
Hi Shravan,

I hope you are doing well .....!!
Then go through the below sample code.
<apex:page controller="CheckController"> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style> * { box-sizing: border-box; } /* Create two equal columns that floats next to each other */ .column { float: left; width: 50%; padding: 10px; height: 300px; /* Should be removed. Only for demonstration */ } /* Clear floats after the columns */ .row:after { content: ""; display: table; clear: both; } </style> <script> function uploadFile() { alert('Call Server method'); UploadFileSaveJS(); } </script> </head> <body> <h2>Two Equal Columns</h2> <apex:form> <apex:actionFunction action="{!UploadFileSave}" name="UploadFileSaveJS" reRender="uploadfilepanel"/> <div class="row"> <div class="column" style="background-color:#aaa;"> <h2>Column 1</h2> First name:<br/> <input type="text" name="firstname" value="" /> <br /> Last name:<br/> <input type="text" name="lastname" value="" /> <br/><br/> <input type="submit" value="Submit" /> </div> <apex:outputPanel id="uploadfilepanel"> <div class="column" style="background-color:#bbb;"> <h2>Column 2</h2> <p>Some text..</p> <input type="file" id="files"/> <button class="rcorners btn btn-info btn-lg" type="button" data-toggle="modal" onclick="uploadFile();" data-target="#myModal1" >Upload</button> </div> </apex:outputPanel> </div> </apex:form> </body> </html> </apex:page>

public class CheckController { public CheckController(){ } public void UploadFileSave(){ System.debug('@@@ File Save successfully....!!!!'); } }

Hope this helps you.
Let me know your review.
If this helps kindly mark it as solved so that it may help others in the future.

Thanks & Regards,
Foram Rana

November 20, 2019
·
Like
0
·
Dislike
0

You need to sign in to do that.

Need an account? Sign Up

Have an account? Sign In

Dismiss

Browse by Topic

Welcome to Support!

Show

sorted by

apex:inputFile can not be used in conjunction with an action component

You need to sign in to do that.