I have a button:
<apex:commandButton action="{!pullReport}" value="Pull Report" id="pullReportbutton"/>
That refreshes the page every time it is clicked. If the page does not refresh, the data will not be returned. (IE: if I use reRender="none" or return= "false")
I have a JS function that will hide the button once it is clicked.
My issue is that once I click the button, the button is hidden for 2 seconds, then the page reloads, and the button is back.
Is there a way around this without having to restructure my apex:form or apex:commandButton? I have written conditionals to try and say "if there is data returned then hide the button" but these get refreshed as well. My last resort is to re-write the button in JS but I would prefer to not do that since I have it already written in visualforce.
some JS I've tried:
/*
$("#pullReportbutton").click(function(event){
event.stopPropagation();
alert("The span element was clicked.");
});
if("{!companyname}" != null){
$(function(){
document.getElementById('pullReportbutton').style.display = 'none';
});
}
function hidebaseObject(e){
e.preventDefault();
var elem = document.getElementById('pullReportbutton');
elem.parentNode.removeChild(elem);
}
*/
UPDATES: Full Code For Easier Viewing
<script type="text/javascript">>
if("{!companyname}" != null){
$(function(){
document.getElementById('pullReportbutton').style.display = 'none';
});
function hidebaseObject(e){
e.preventDefault();
var elem = document.getElementById('pullReportbutton');
elem.parentNode.removeChild(elem);
}
}
</script>
<apex:form id="mainForm">
<div class="col-md-6" style="position:relative">
<div>
Business ID Report
</div>
<div id="removeMePlease">
Instant ID Report has not yet been pulled for this organization.
</div>
<div>
<apex:commandButton action="{!pullReport}" value="Pull Report" id="pullReportbutton" reRender="mainForm" />
</div>
<div>
Business ID Report
</div>
<div>
Company Name: {!companyname}
</div>
<div>
Report Date
</div>
<div>
{!newDate}
</div>
<div>
Full Report
</div>
<div><a href="{!helloKitty}" target="blank">
View Details
</a>
</div>
</div>
</apex:form>
<apex:form />
by adding reRender in the apex:commandButton?<apex:form id="myForm">..... <apex:commandButton action="{!pullReport}" value="Pull Report" id="pullReportbutton" reRender="myForm" /></apex:form>
and it didn't work right?