rbf_showOrHideField doesn't work for fields with Minimum

Posted by Rollbase User on 14-Dec-2010 17:18

rbf_showOrHideField() does not work correctly for fields with a minimum value in Firefox. After a field is hidden then shown, only the label is displayed (the input box is missing). Normal:  After hide, then show with rbf_showOrHideField:  Thanks

All Replies

Posted by Admin on 14-Dec-2010 17:43

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'

Posted by Admin on 14-Dec-2010 18:15

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.

Posted by Admin on 15-Dec-2010 02:42

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

Posted by Admin on 16-Dec-2010 12:46

Thanks for this solution, works great. Matt will contact you and show a little gratitude from Rollbase.

Posted by Admin on 29-Jan-2011 18:14

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";
}
}

Posted by Admin on 19-Sep-2011 09:39

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.

Posted by Admin on 19-Sep-2011 12:30

Hi Romain,



Thanks for the details. I will look into this this week.



Matt

Posted by Admin on 19-Sep-2011 19:50

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

Posted by Admin on 05-Dec-2011 23:59

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

Posted by Admin on 06-Dec-2011 06:54

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

This thread is closed