Visualforce page tab panel tabs enable/disable can easily controlled by client side java script.
I came through a requirement to allowing user to go back by clicking directly on tab and let change data and restart process from that tab.In this situation it require to disable all forward tabs.
I came through a requirement to allowing user to go back by clicking directly on tab and let change data and restart process from that tab.In this situation it require to disable all forward tabs.
Following code , that can be change easily as per requirement.
/**
Method called on onclick event of tab and pass tab number.
It disable next tabs from the current tabs(clicked tab). In my case i have 4 tabs , code can be change accordingly.
@param e tab number
**/
function disabledNextTabs(e){
if(e == '1'){ // use actual tab ID in all places.
if(document.getElementById('page:tab_step2_shifted') != null){ // use actual tab ID
document.getElementById('page:tab_step2_shifted').onclick=''; // use actual tab ID
}
if(document.getElementById('page:tab_step2_lbl') != null){ // use actual tab ID
document.getElementById('page:tab_step2_lbl').className ='dr-tbpnl-tb rich-tab-header dr-tbpnl-tb-dsbl rich-tab-disabled';
document.getElementById('page:tab_step2_lbl').onmouseover='';
document.getElementById('page:tab_step2_lbl').onmouseout='';
}
if(document.getElementById('page:tab_step2_cell') != null){
document.getElementById('page:tab_step2_cell').className ='dr-tbpnl-tbcell-dsbld rich-tabhdr-cell-disabled';
}
document.getElementById('page:tab_step3_shifted').onclick='';
document.getElementById('page:tab_step3_cell').className ='dr-tbpnl-tbcell-dsbld rich-tabhdr-cell-disabled';
document.getElementById('page:tab_step3_lbl').onmouseover='';
document.getElementById('page:tab_step3_lbl').onmouseout='';
document.getElementById('page:tab_step3_lbl').className ='dr-tbpnl-tb rich-tab-header dr-tbpnl-tb-dsbl rich-tab-disabled';
document.getElementById('page:tab_step4_shifted').onclick='';
document.getElementById('page:tab_step4_lbl').className ='dr-tbpnl-tb rich-tab-header dr-tbpnl-tb-dsbl rich-tab-disabled';
document.getElementById('page:tab_step4_lbl').onmouseover='';
document.getElementById('page:tab_step4_lbl').onmouseout='';
document.getElementById('page:tab_step4_cell').className ='dr-tbpnl-tbcell-dsbld rich-tabhdr-cell-disabled';
}
else if(e == '2'){
document.getElementById('page:tab_step3_shifted').onclick='';
document.getElementById('page:tab_step3_cell').className ='dr-tbpnl-tbcell-dsbld rich-tabhdr-cell-disabled';
document.getElementById('page:tab_step3_lbl').onmouseover='';
document.getElementById('page:tab_step3_lbl').onmouseout='';
document.getElementById('page:tab_step3_lbl').className ='dr-tbpnl-tb rich-tab-header dr-tbpnl-tb-dsbl rich-tab-disabled';
document.getElementById('page:tab_step4_shifted').onclick='';
document.getElementById('page:tab_step4_lbl').className ='dr-tbpnl-tb rich-tab-header dr-tbpnl-tb-dsbl rich-tab-disabled';
document.getElementById('page:tab_step4_lbl').onmouseover='';
document.getElementById('page:tab_step4_lbl').onmouseout='';
document.getElementById('page:tab_step4_cell').className ='dr-tbpnl-tbcell-dsbld rich-tabhdr-cell-disabled';
}else if(e == '3'){
document.getElementById('page:tab_step4_shifted').onclick='';
document.getElementById('page:tab_step4_lbl').className ='dr-tbpnl-tb rich-tab-header dr-tbpnl-tb-dsbl rich-tab-disabled';
document.getElementById('page:tab_step4_lbl').onmouseover='';
document.getElementById('page:tab_step4_lbl').onmouseout='';
document.getElementById('page:tab_step4_cell').className ='dr-tbpnl-tbcell-dsbld rich-tabhdr-cell-disabled';
}
}
