Forum Stats

  • 3,871,980 Users
  • 2,266,360 Discussions
  • 7,911,018 Comments

Discussions

How to dynamicaly show/hide columns with JS based on current month?

User_F6L1B
User_F6L1B Member Posts: 7 Green Ribbon

Hello,

I have a table with month names as columns and each month I would like to show and hide specific columns dynamically without manually changing the application each month. For e.g, if it is February now, I want to hide the column named 'January' and show the column 'February' till 'December'. When March starts, the JS function should hide February and show from March column onwards.

Right now I am doing something like this in 'Attributes -> JS Initialisation Code':

const d = new Date();

let month = d.getMonth();

if (month === 1) {
gridView.view$.grid("hideColumn", "JANUARY");}
else {
gridView.view$.grid("showColumn", "FEBRUARY");}

However, this is not working at all. Any sort of help will be appreciated.

Best Answer

  • Hamza Al-abbasi
    Hamza Al-abbasi Member Posts: 770 Bronze Crown
    Answer ✓

    In Function and Global Variable Declaration:

    function hideCol(){
      const d = new Date();
      let month = d.getMonth(),
          gridView = apex.region("prognose_ig").call("getViews").grid;
    
      if (month === 1) {
        gridView.view$.grid("hideColumn", "JANUARY");
      }
      else {
        gridView.view$.grid("showColumn", "FEBRUARY");
      }
    }
    

    In Execute when Page Loads :

    hideCol();
    

Answers

  • SmithJohn45
    SmithJohn45 Member Posts: 776 Silver Badge
    edited Feb 21, 2022 2:04PM

    when we use Show/Hide Action using Dynamic Action on an IG column, it throws error that "Show/Hide column not supported actions for Interactive Grid columns" may be this is the problem.

    let the seniors advise.

  • User_F6L1B
    User_F6L1B Member Posts: 7 Green Ribbon

    I am so far not using DA because something needs to happen for the DA to trigger. I want this to be part of my JS code to get current month every time the application is started and show/hide columns based on the month.

  • Hamza Al-abbasi
    Hamza Al-abbasi Member Posts: 770 Bronze Crown
    edited Feb 21, 2022 2:22PM

    However, this is not working at all. Any sort of help will be appreciated.

    How ? do you get any error ?

    Have you defined the grid first ?

    var gridView = apex.region("YOUR_IG_STATIC_ID").call("getViews").grid; // Replace "YOUR_IG_STATIC_ID" with your IG static id attribute
    
  • User_F6L1B
    User_F6L1B Member Posts: 7 Green Ribbon
    • when I try to edit the 'Attributes -> JS Initialisation Code', I get a strange error like: 'Value too long by 95 characters!'

    function(config) {

        config.reportSettingsArea = false;

        const d = new Date();

        let month = d.getMonth();

        var gridView = apex.region("prognose_ig").call("getViews").grid;

        if ('month' === 1){ 

            gridView.view$.grid("hideColumn", "JANUARY_PROGNOSE");}

    return config;

    }


    I am also trying by creating a function at 'Page->Function and Global Variable Declaration':

    function hideCol() {

        const d = new Date();

        let month = d.getMonth();

        var gridView = apex.region("prognose_ig").call("getViews").grid;

        if ('month' === 1){ 

            gridView.view$.grid("hideColumn", "JANUARY_PROGNOSE");}

    }

    Can you tell me exactly where the code should be put and what should the code look like? Thank you.

  • Hamza Al-abbasi
    Hamza Al-abbasi Member Posts: 770 Bronze Crown
    Answer ✓

    In Function and Global Variable Declaration:

    function hideCol(){
      const d = new Date();
      let month = d.getMonth(),
          gridView = apex.region("prognose_ig").call("getViews").grid;
    
      if (month === 1) {
        gridView.view$.grid("hideColumn", "JANUARY");
      }
      else {
        gridView.view$.grid("showColumn", "FEBRUARY");
      }
    }
    

    In Execute when Page Loads :

    hideCol();
    
  • User_F6L1B
    User_F6L1B Member Posts: 7 Green Ribbon

    Thank you for help. I guess I was doing also almost the same thing as you. My IG static id attribute was 'prognose' but it showed as 'prognose_ig' in page source. It works now with 'prognose'

  • InoL
    InoL Member Posts: 10,179 Blue Diamond

    As you see you can do this with JS, but it looks much easier to do this with a Server Side Condition on the column.

    Column: January

    Condition: to_number(to_char(sysdate,'mm') <= 1

    etc.

  • User_F6L1B
    User_F6L1B Member Posts: 7 Green Ribbon
    edited Feb 22, 2022 8:12AM

    so if this condition is true, the column will act the way we make it to, i.e., hidden, display only, number field, etc.?

    I find it a bit confusing to be honest.