Hide certain fields conditionally in a List DataPage

[cordova]

Hi,

I have a List Report DataPage and among the fields, I have School_1, Educ_Attainment_1, School_2, Educ_Attainment_2, which basically means that users should add in their two highest educational attainments and from which school they studied (for example, one person would have a Bachelor's Degree in Harvard University, and a Master's Degree in Princeton University, while another person would have a Master's Degree in University of Michigan and a Doctorate Degree in Stanford University), and that works fine. But is it possible to hide one's educational attainment (and the affiliated university) if it's a Bachelor's one? So for those who records who has educational attainments of Bachelor's  that field should be hidden and the university.

 

 

[futurist]

22 minutes ago, cordova said:

Hi,

I have a List Report DataPage and among the fields, I have School_1, Educ_Attainment_1, School_2, Educ_Attainment_2, which basically means that users should add in their two highest educational attainments and from which school they studied (for example, one person would have a Bachelor's Degree in Harvard University, and a Master's Degree in Princeton University, while another person would have a Master's Degree in University of Michigan and a Doctorate Degree in Stanford University), and that works fine. But is it possible to hide one's educational attainment (and the affiliated university) if it's a Bachelor's one? So for those who records who has educational attainments of Bachelor's  that field should be hidden and the university.

 

 

Hi @cordova,

You can achieve this with some JavaScript, here's what I have come up with:

<script type="text/javascript">
document.addEventListener('DataPageReady', function (event) {

var elems = document.querySelectorAll("div[class*='cbReportBlock']");

[].forEach.call(elems, function(elem, i) {

var type1 = elem.querySelector("dl dt:nth-child(7)").nextElementSibling;

if(type1.innerText  == 'Bachelors' ){
type1.style.display = "none";
type1.previousElementSibling.style.display = "none";
type1.previousElementSibling.previousElementSibling.style.display = "none";
type1.previousElementSibling.previousElementSibling.previousElementSibling.style.display = "none";
}

var type2 = elem.querySelector("dl dt:nth-child(11)").nextElementSibling;
if(type2.innerText == 'Bachelors') {
type2.style.display = "none";
type2.previousElementSibling.style.display = "none";
type2.previousElementSibling.previousElementSibling.style.display = "none";
type2.previousElementSibling.previousElementSibling.previousElementSibling.style.display = "none";
}

});

});
</script>
 

 

But the crucial part here is determining which nth-child you need to look for, so I guess you can try switching up the nth-child value until you get the value of the Educ_Attainment (or if youre a bit techy, you can inspect element for you to determine at which order does the Educ_attainment value comes in)

 

Here's my table containing all records including those with Bachelor's degrees (i've highlighted those fields which should be removed on the DataPage): 

 

 

And on the DP with the Script, here's how that looks like (notice that the bachelors value has been removed as well as the school affiliated to them):

Here's the sample DP: https://c1hch576.caspio.com/dp/db26a0007b8cbbe6f560451f9197

 

Hope this helps!