This function is written by Matt and has known issues. Matt may be able to look into this when he'll be back (in January). Meanwhile you can find below a full code of this API. If you or someone on this forum have a better solution I'll appreciate your contribution.
function rbf_showOrHideField(fieldName, showField) {
var labelTD = document.getElementById("rbi_L_"+fieldName);
var fieldTD = document.getElementById("rbi_F_"+fieldName);
if (labelTD == null || fieldTD == null)
return;
rbf_showOrHideElements(labelTD,labelTD.childNodes,showField);
rbf_showOrHideElements(fieldTD,fieldTD.childNodes,showField)
}
function rbf_showOrHideElements(parent, elements, show) {
if (elements && elements.length>0) {
for (var i=0;i
var child = elements[i];
if (show) {
if (child.style) {
child.style.display='block';
}
else {
var div = document.createElement('div'
Hint: There is simpler solution which works fine in IE but not in FireFox:
function rbf_showMe(fieldName, showField) {
var labelTD = document.getElementById("rbi_L_"+fieldName);
var fieldTD = document.getElementById("rbi_F_"+fieldName);
if (labelTD == null || fieldTD == null)
return;
labelTD.style.display=(showField ? 'block' : 'none');
fieldTD.style.display=(showField ? 'block' : 'none');
}
I think Rollbase can offer some descent reward for finding solution which works in both browsers.
Pavel,
This should work.
I tested most field types (text, radio, lookup, group of checkbox, etc.) on New/Edit and View pages with FireFox, IE, Chrome and Safari with no issues.
function rbf_showOrHideField(fieldName, showField)
{
var labelTD = document.getElementById("rbi_L_"+fieldName);
var fieldTD = document.getElementById("rbi_F_"+fieldName);
if (labelTD == null || fieldTD == null)
return;
//detect IE:
var isIE = /*@cc_on!@*/false;
if (isIE)
{
labelTD.style.display=(showField ? 'block' : 'none');
fieldTD.style.display=(showField ? 'block' : 'none');
}
else
{
if (showField)
{
var labelTDDiv = labelTD.firstElementChild;
var fieldTDDiv = fieldTD.firstElementChild;
labelTDDiv.style.display = 'block';
fieldTDDiv.style.display = 'block';
}
else
{
var divL = document.createElement('div');
divL.innerHTML = labelTD.innerHTML;
labelTD.innerHTML = "";
labelTD.appendChild(divL);
divL.style.display = "none";
var divF = document.createEle
Thanks for this solution, works great. Matt will contact you and show a little gratitude from Rollbase.
As it turns out, this solution will not work if you Hide a field more than once consecutively. It creates nested hidden divs. If you use visibility:hidden and visibility:visible, you do not need to create any additional divs, so it looks like it works better.
This is what I use:
function show(fieldName)
{
var labelTd = document.getElementById("rbi_L_" + fieldName);
var fieldTd = document.getElementById("rbi_F_" + fieldName);
if ((labelTd == null) || (fieldTd == null))
{
return;
}
else
{
labelTd.style.visibility = "visible";
fieldTd.style.visibility = "visible";
}
}
function hide(fieldName)
{
var labelTd = document.getElementById("rbi_L_" + fieldName);
var fieldTd = document.getElementById("rbi_F_" + fieldName);
if ((labelTd == null) || (fieldTd == null))
{
return;
}
else
{
labelTd.style.visibility = "hidden";
fieldTd.style.visibility = "hidden";
}
}
Hello, i'm replying this topic because as mentionned by Mike Sancilardi, there is indeed a problem with the current rbf_showOrHideField function.
It seems to perfectly work with Internet Explorer.
However, with Chrome and Firefox (only two other browsers i tested) :
If you hide a field that had already been hidden, you cannot show it anymore.
This is causing trouble to our applications since we have some pages where a lot of fields are being hidden on page load.
They are then either hidden or shown in event handler functions.
But by using this technique, we often time get into the case of hidding a field that was already hidden, and the event handler functions won't ever be able to show it again.
Could you take a look at this ?
Thanks.
Hi Romain,
Thanks for the details. I will look into this this week.
Matt
Here you go, Hope this helps.
Tested: IE7+, FF 2.5+, Chrome. - Section Hide via Title and Show or Hide Fields
// You can include a div with id errors to display error messages in Chrome or FF (not working in IE)
var d=document;
function c__sectionHide(section,flag) {
//CODE CREATION: M.PISCOSO - Custom Section Show Hide (overrides section show hide)
//Created - 06-13-2011
try {
var section = new String(section);
section = d.getElementById("rbi_S_" + String(rbf_getSectionIdByTitle(section)) );
if (flag == true) {
section.style.display = "block";
} else {
section.style.display = "none";
}
} catch(e) { d.getElementById('errors').innerHTML += section + " " + e.message + "
"; }
}
function c__showHide(field,flag) {
//CODE CREATION: M.PISCOSO - Custom Show Hide (overrides field show hide)
//Created - 02-11-2011
var mode, label;
if (String(navigator.appVersion).indexOf('MSIE 7.0') == -1) { mode = 'table-cell'; }
else { mode = 'block'; }
try {
field = new
Martin,
Are you still using this code to fix a problem on our side? If so we should apply your fix. Let me know when you have a chance.
Thanks,
Matt
Hi Matt,
Our team is still using c__sectionHide and c__showHide in place of their standard counterparts.
We haven't run into any problems with them except for a minor layout issue when you have 2 fields side-by-side e.g. A and B ( A || B ) and you hide B, sometimes A will go to B's position ( || A ).
This is inconsistent but can be solved by simply adding a line break or a non-breaking space (nbsp) on B's column either via script component or html component ^_^
i.e.
A || B
nbsp || nbsp (or
)
Apart from that, we are still using them for the browsers IE, FF, and chrome with no other problems :)
Thank you very much,
Piscoso Martin
Rollbase PH