How to clear the filename and value of apex:inputFile
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ margin-bottom:0;
}
I have and apex:inputFile tag where a user can input a filename to upload on a visualforce page. I have a javascript function which checks and alerts if a filesize is too large. After the Alert the inputfield stays filled with the file. How do I clear the input in javascript.
Visualforce
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event)" />
Javascript
<script>
function checkFileSize(event) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
}
}
</script>
visualforce javascript event inputfield
add a comment |
I have and apex:inputFile tag where a user can input a filename to upload on a visualforce page. I have a javascript function which checks and alerts if a filesize is too large. After the Alert the inputfield stays filled with the file. How do I clear the input in javascript.
Visualforce
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event)" />
Javascript
<script>
function checkFileSize(event) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
}
}
</script>
visualforce javascript event inputfield
add a comment |
I have and apex:inputFile tag where a user can input a filename to upload on a visualforce page. I have a javascript function which checks and alerts if a filesize is too large. After the Alert the inputfield stays filled with the file. How do I clear the input in javascript.
Visualforce
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event)" />
Javascript
<script>
function checkFileSize(event) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
}
}
</script>
visualforce javascript event inputfield
I have and apex:inputFile tag where a user can input a filename to upload on a visualforce page. I have a javascript function which checks and alerts if a filesize is too large. After the Alert the inputfield stays filled with the file. How do I clear the input in javascript.
Visualforce
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event)" />
Javascript
<script>
function checkFileSize(event) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
}
}
</script>
visualforce javascript event inputfield
visualforce javascript event inputfield
asked Dec 31 '18 at 13:48
ThomasThomas
738419
738419
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
You can pass the element id in the checkFileSize
method, and then do your processing then
<apex:page controller="FileUploadController">
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event,id)" />
<script>
function checkFileSize(event , id ) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
document.getElementById(id).value ='';
}
}
</script>
</apex:page>
Thanks for your answer, how can I make this work if the apex:input is between an apex repeat. For now it only works for the first input. How do I get the event inputfile?
– Thomas
Dec 31 '18 at 14:31
@Thomas updated code to support apex:reperat7
– Pranay Jaiswal
Dec 31 '18 at 14:36
add a comment |
Your Answer
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "459"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fsalesforce.stackexchange.com%2fquestions%2f245072%2fhow-to-clear-the-filename-and-value-of-apexinputfile%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You can pass the element id in the checkFileSize
method, and then do your processing then
<apex:page controller="FileUploadController">
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event,id)" />
<script>
function checkFileSize(event , id ) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
document.getElementById(id).value ='';
}
}
</script>
</apex:page>
Thanks for your answer, how can I make this work if the apex:input is between an apex repeat. For now it only works for the first input. How do I get the event inputfile?
– Thomas
Dec 31 '18 at 14:31
@Thomas updated code to support apex:reperat7
– Pranay Jaiswal
Dec 31 '18 at 14:36
add a comment |
You can pass the element id in the checkFileSize
method, and then do your processing then
<apex:page controller="FileUploadController">
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event,id)" />
<script>
function checkFileSize(event , id ) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
document.getElementById(id).value ='';
}
}
</script>
</apex:page>
Thanks for your answer, how can I make this work if the apex:input is between an apex repeat. For now it only works for the first input. How do I get the event inputfile?
– Thomas
Dec 31 '18 at 14:31
@Thomas updated code to support apex:reperat7
– Pranay Jaiswal
Dec 31 '18 at 14:36
add a comment |
You can pass the element id in the checkFileSize
method, and then do your processing then
<apex:page controller="FileUploadController">
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event,id)" />
<script>
function checkFileSize(event , id ) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
document.getElementById(id).value ='';
}
}
</script>
</apex:page>
You can pass the element id in the checkFileSize
method, and then do your processing then
<apex:page controller="FileUploadController">
<apex:inputFile id="inputfile" value="{!newAtt.body}" filename="{!newAtt.name}" onchange="checkFileSize(event,id)" />
<script>
function checkFileSize(event , id ) {
if(event.target.files[0].size > 2**20*5) {
alert('File must be less than 5Mb');
//**Clear input**
document.getElementById(id).value ='';
}
}
</script>
</apex:page>
edited Dec 31 '18 at 14:35
answered Dec 31 '18 at 14:18
Pranay JaiswalPranay Jaiswal
18.8k53159
18.8k53159
Thanks for your answer, how can I make this work if the apex:input is between an apex repeat. For now it only works for the first input. How do I get the event inputfile?
– Thomas
Dec 31 '18 at 14:31
@Thomas updated code to support apex:reperat7
– Pranay Jaiswal
Dec 31 '18 at 14:36
add a comment |
Thanks for your answer, how can I make this work if the apex:input is between an apex repeat. For now it only works for the first input. How do I get the event inputfile?
– Thomas
Dec 31 '18 at 14:31
@Thomas updated code to support apex:reperat7
– Pranay Jaiswal
Dec 31 '18 at 14:36
Thanks for your answer, how can I make this work if the apex:input is between an apex repeat. For now it only works for the first input. How do I get the event inputfile?
– Thomas
Dec 31 '18 at 14:31
Thanks for your answer, how can I make this work if the apex:input is between an apex repeat. For now it only works for the first input. How do I get the event inputfile?
– Thomas
Dec 31 '18 at 14:31
@Thomas updated code to support apex:reperat7
– Pranay Jaiswal
Dec 31 '18 at 14:36
@Thomas updated code to support apex:reperat7
– Pranay Jaiswal
Dec 31 '18 at 14:36
add a comment |
Thanks for contributing an answer to Salesforce Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fsalesforce.stackexchange.com%2fquestions%2f245072%2fhow-to-clear-the-filename-and-value-of-apexinputfile%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown