Wednesday, January 2, 2013

Hide/Show button based on field value on Page Layout


Use Case :- Let's say we need to hide the "Submit For Approval" button on Account Page Layout when the field "Status" has "Approved" value.

Steps to acomplish this :-
1.     Create a html area type component on home page. Name it like admin toolbox.
2.     Keep the component position as Narrow Left column and in the body click on show html.
3.     Put the below Javascript in the body and save the component. To find the name of button, you can use firebug on firefox or console on any other browser. In this example it is "submit".


<!--------Wait for the loading of the page---------> 
<script type="text/javascript">   
  function addLoadEvent(func) {    
    var oldonload = window.onload;    
if (typeof window.onload != 'function') {    
    window.onload = func;    
    }else {     
    window.onload = function() {      
 if (oldonload) {       
   oldonload();      
 }      func();     
}    
}   
  }   
  addLoadEvent(function() { 
    findandremovebuttons();
    }
  ); 
</script> 
<!--------/Wait for the loading of the page--------->

<!--------Button Removal---------> 
<script type="text/javascript">   
  
  function findandremovebuttons(){   
    var currentURL = window.location.href; 
      
if(currentURL.indexOf('/001') != -1 ) {  
 var tds = document.getElementsByTagName("td");
 var trColLabels = document.querySelectorAll('.labelCol');
 for(var i=0; i<trColLabels.length; i++){
var singleCol = trColLabels[i].innerHTML;
if(singleCol == 'Status') {
   var myTd = trColLabels[i];
for(var i = 0; i < tds.length;i++){
  if(tds[i] == myTd){
var next = tds[i + 1];
if(next.getElementsByTagName("div").length > 0){
var innerDiv = next.getElementsByTagName("div")[0];
if(innerDiv.innerHTML == 'Approved'){
  if (document.getElementsByName("submit")[0] != null)            
document.getElementsByName("submit")[0].style.display = 'none';        
  if (document.getElementsByName("submit")[1] != null)            
document.getElementsByName("submit")[1].style.display = 'none';
}
}
  }
}
}
 }
}
  }  
  
</script> 
<!--------/Button Removal--------->





4.     Now make this component available on all home page layouts to get this going.

No comments:

Post a Comment