0

I'm trying to hide /show two buttons in grid depending on a method from the controller. Here is my grid actions and actionscolumn:

actions: {
    run: {
        iconCls: 'u4f-backgroundjobs-start-icon',
        tooltip: U4.Titles.getTitle(20637, 'Run'),
        handler: 'onRunClick',
        isActionDisabled: 'isRunDisabled'
    },
    pause: {
         xtype: 'u4_button',
         iconCls: 'u4f-backgroundjobs-pause-icon',
         padding: 0,
         width: 15,
         height: 15,
         tooltip: U4.Titles.getTitle(60600, 'Hold'),
         handler: 'onPauseClick',
         hidden: 'isPauseHidden'
    },
    kill: {
        iconCls: 'u4f-backgroundjobs-kill-icon',
        tooltip: U4.Titles.getTitle(39340, 'Terminate'),
        handler: 'onKillClick',
        isActionDisabled: 'isKillDisabled'
    },
    resume: {
        xtype: 'u4_button',
        iconCls: 'u4f-backgroundjobs-resume-icon',
        padding: 0,
        width: 15,
        height: 15,
        handler: 'onResumeClick',
        hidden: 'isResumeHidden'
    }
},

Column:

{
        text: U4.Titles.getTitle(47035, 'Actions'),
        menuDisabled: true,
        sortable: false,
        xtype: 'actioncolumn',
        flex: 2,
        // items: ['@run', '@pause', '@kill'],
        items: ['@run', '@pause', '@resume', '@kill'],
        draggable: false,
        resizable: false,
        align: 'center'
    },

Here are examples of functions in the controller for the 'isActionDisabled' and 'hidden' properties:

isRunDisabled: function (grid, rowIndex) {
    var me = this,
        gridStore = grid.getStore(),
        storedTask = gridStore.getAt(rowIndex),
        jobCanRunOnDemand = storedTask.get('canRunOnDemand');

    return me.jobIsRunning(grid, rowIndex) || !jobCanRunOnDemand;
},

isResumeHidden: function (grid, rowIndex) {
    var me = this,
        gridStore = grid.getStore(),
        storedTask = gridStore.getAt(rowIndex),
        jobStatus = storedTask.get('jobStatus'),
        activeToTime = storedTask.get('activeToTime'),
        currentTime = new Date();

    return jobStatus === 0 || activeToTime < currentTime;
},

For some reason the 'isActionDisabled' property is working as intended but the 'hidden' property is not. It's only returning true no matter what I alter in the return of those methods. The problem is that I don't want to disable them this time, I want to hide and show dynamically. Am I doing something wrong or missing something? Is there any other kind of approach to it? Thank you in advance.

Weedosaurus
  • 140
  • 8
  • 1
    `isActionDisabled` should work only for action columns. `hidden` property of an `Ext.Action` has type boolean and as far as I know it does not accept a controller function as text. I think the `true` value is because a non-empty string in JS has a boolean value of `true`. – Peter Koltai Jun 01 '23 at 18:10
  • Thank you for the comment. Do you know a workaround to achieve what I'm trying to do? – Weedosaurus Jun 02 '23 at 08:13
  • 1
    An idea: you can have 4 actioncolumns, one for each item: it is easy to hide every actioncolumn that you don't need, and it is so fast that the user won't notice the swap. – Arthur Jun 02 '23 at 08:20
  • I appreciate the idea, but that would be messy and ruin the presentation of the table, right? – Weedosaurus Jun 02 '23 at 09:36
  • I also tried something like this: https://stackoverflow.com/a/17061808/11626412 but with the hidden property and it is still not workin. – Weedosaurus Jun 02 '23 at 10:29
  • It depends on what you want: if disabled is ok, then you can just set the items as disabled; if they need to be hidden according to their state, the 4 actioncolumns is an alternative; it won't mess the table, it will only display the actioncolumn according to the state. – Arthur Jun 02 '23 at 11:13
  • Have you tried ViewModel binding? I am not sure but there is a `setHidden` method and maybe it works, but it is not marked bindable. Otherwise you can try the grid's `reconfigure` method with the new column settings, to exclude actions from the action column. – Peter Koltai Jun 02 '23 at 11:25

0 Answers0