Hiding a tab based on whether a field Contains Data or not

(0) Share

Report

Posted on by JonClay

Hi everyone

I'm trying to show or hide a tab based on whether or not a field contains data.

The basic principle is if a field called Type contains data then tab_16 should show. If the field called Type does not contain data then tab_16 should not show.

I know that I have to do this in Javascript, and I believe that I might have got part of the way. However, I know that the second part of the code is wrong, but my experience of Javascript is very minimal! Could anyone help me with this please?

Also, how do I ensure that tab_16 shows if Type changes from not containing data to containing data?

function hideOrShowSubgrids() {

var taskTab = Xrm.Page.ui.tabs.get('tab_16');

//Time out function to wait untill the component loads.
if (taskTab == null || taskTab == "undefined") {
setTimeout(function () { hideOrShowSubgrids(); }, 1000);
return;
}

//Set the tab as visible if the Field "Type" contains data.
if (fieldname == "Type") {
Xrm.Page.ui.tabs.get('tab_11').setVisible(true);
}
}

Many thanks
Jon

I have the same question (0)

All responses (6)

Answers (1)

Inogic 682 on at

Like (0)

Report

Please find the below changes in your code

Note: Attach this event OnChange of Type field also, so if the user manually makes the Type field empty that time also tab_11 get to hide or show and while registering the script pass the executioncontext as first parameter as shown in below screenshot.

function hideOrShowSubgrids(executionContext) {

    var formContext = executionContext.getFormContext();

    var taskTab = formContext.ui.tabs.get('tab_16');

    var type = formContext.getAttribute("Type").getValue();

    //Time out function to wait untill the component loads.

    if (taskTab == null || taskTab == "undefined") {

        setTimeout(function () { hideOrShowSubgrids(); }, 1000);

        return;

    }

    //Set the tab as visible if the Field "Type" contains data.

    if (type != null && type != undefined && type != "") {

        formContext.ui.tabs.get('tab_11').setVisible(true);

    } else {

        //hide data if Field "Type" does not contains data

        formContext.ui.tabs.get('tab_11').setVisible(false);

    }

}

Hope this helps.

Thanks!

Was this reply helpful? Yes No
Suggested answer

Abdul Wahab 12,119 Moderator on at

Like (0)

Report
Hi Jon Clay ,

Please try below code. It will help to solve your problem

function showHideTab2(executionContext) { try { //Get the form contex let formContext = executionContext.getFormContext(); let attributeValue = getValue(formContext, "atrribute"); if (attributeValue !== "") { showHideTab(formContext, "tab_2", true); } else { showHideTab(formContext, "tab_2", false); } } catch (e) { openAlertDialog("Error from showHideTab2: " "e: " e ". e.mesage: " e.message); } } function showHideTab(formContext, tabName, isVisible) { try { let tabObj = formContext.ui.tabs.get(tabName); if (tabObj) { tabObj.setVisible(isVisible); } } catch (e) { openAlertDialog("Error from showHideTab: " "e: " e ". e.mesage: " e.message); } } function getValue(formContext, attribute) { let value = ""; try { if (this.getControl(formContext, attribute) !== "") { value = formContext.getAttribute(attribute).getValue(); } } catch (e) { openAlertDialog("Error from getValue: " "e: " e ". e.mesage: " e.message); } return value; } function getControl(formContext, control) { let controlValue = "" try { controlValue = formContext.getControl(control); } catch (e) { openAlertDialog("Error from getControl: " "e: " e ". e.mesage: " e.message); } return controlValue } function openAlertDialog(alertStrings) { try { Xrm.Navigation.openAlertDialog(alertStrings).then(); } catch (e) { Xrm.Navigation.openAlertDialog("Error from openAlertDialog: " "e: " e ". e.mesage: " e.message).then(); } }

Was this reply helpful? Yes No
JonClay on at

Like (0)

Report

Thank you so much. I'll try this next week.

Was this reply helpful? Yes No
Suggested answer

Abdul Wahab 12,119 Moderator on at

Like (0)

Report

Hi Jon Clay,

sure, You are welcome.

Was this reply helpful? Yes No
Verified answer

CRMJetty 3,512 on at

Like (0)

Report
Hello Jonclay,

The Type field is located in the Contact entity. The form has a tab labeled Types of Contact. Tab should be visible when Type field contains data, and hidden when it doesn't.

To hide/show the tab in the form, follow the steps below.

Step 1: Create one JS file and write the following code.

'new_type' is the logical name of the field.

type_contact: This is the name of a tab that we want to hide or show.

function hideShowTab() { var type = Xrm.Page.getAttribute("new_type").getValue(); if (type != “”) { window.parent.Xrm.Page.ui.tabs.get("type_contact").setVisible(true); } else { window.parent.Xrm.Page.ui.tabs.get("type_contact").setVisible(false); } }

also, You can refer this blog to hide tab based field contain or not.

Was this reply helpful? Yes No
JonClay on at

Like (0)

Report

Hi Maulik Shah

Many thanks for sending me this solution.

I'm just about to go on my holidays, so I will try this once I'm back!

Best wishes
Jon

Was this reply helpful? Yes No