Adding a new column to resource assignment popup.

[mchourishi]

I want to add a new column in resource assignment popup.

I have created a custom grid by extending Gnt.widget.AssignmentGrid class and overriding its buildColumns method.

Code: Select all

Ext.define('MyApp.AssignmentGrid', {
    extend: 'Gnt.widget.AssignmentGrid',
    alias : 'widget.myassignmentgrid',
    buildColumns : function () {
        return this.callParent(arguments).concat({
            header: 'Role',
            dataIndex: 'Role',
            width: 100
        });
    }
});

Then created a custom field by extending Gnt.field.Assignment class and then override its createPicker method.
HEre replaced Gnt.widget.AssignmentGrid with custom class created above

Code: Select all

Ext.define('MyApp.AssignmentField', {
    alias           : 'widget.myresourceassignment',
    extend          : 'Gnt.field.Assignment',
     createPicker: function() {
        var grid = new MyApp.AssignmentGrid(Ext.apply({
            frame       : true,
            floating    : true,

            height      : 200,
            width       : 300,

            resourceStore       : this.task.getResourceStore(),
            assignmentStore     : this.task.getAssignmentStore(),

            fbar                : this.buildButtons()
        }, this.gridConfig || {}));

        return grid;
    },
});

Then setting new field as editor to resourceassignment column
{
xtype : 'resourceassignmentcolumn',
editor : new MyApp.AssignmentField()
}

Now when clicking on assigned resources record popup is not coming,however when clicked displays a dropdown and clicking on dropdown's arrow displays the new Role column , but how can I get back the popup.

Thanks!

[Maxim Gorkovsky]

Hello.
Set expandPickerOnFocus to true on your assignment field.

[mchourishi]

Thanks Maxim , It worked!

[mchourishi]

Does this config needs some extra code to display the new column value.

The column is displayed , however its value is not being displayed.

I have created a new model

Code: Select all

Ext.define("MyResourceModel", {
    extend              : 'Gnt.model.Resource',

    fields : [
        {name : 'Role' , type : 'string' , dataIndex    : 'Role'}
    ]
});

and have passed this model to store

resourceStore = new Gnt.data.ResourceStore({
model : 'MyResourceModel'
});


and then have passed Role value in resource data array. Still the role value is not being displayed.

var arrResourceData = [{ "Id":1,"Name":"Mike","Role":"Developer"}];
resourceStore.loadData(arrResourceData);

[Maxim Gorkovsky]

That widget is showing you assignments, not resources. To show resource's role in AssignmentEditGrid you need to provide a renderer function to your Role column, smth like:

Code: Select all

renderer : function (val, meta, record) {
    return record.getResource().get('Role');
}

[mchourishi]

Thanks Maxim , the above rendered worked.

However the code to add a custom column to resource assignment popup do have some issues.
1. Checkboxes that are displayed in front of the resources to select is not displayed anymore.
2 . Also only the resources that are assigned to the task displayed and not other resources.
So , if a task is not assigned to resource , the popup goes blank.

It seems that the createPicker function is creating the issues.

Here only the resource that is assigned to a task is displayed.

resourceass-issue.png (5.18 KiB) Viewed 8485 times

[mchourishi]

I have replaced AssignmentEditGrid with AssignmentGrid and the checkboxes with other resources are being displayed properly.
However the custom column "Role" value is not being displayed.
It seems that the renderer function is not working now.

Code: Select all

 Ext.define('MyAssignmentGrid', {
            extend: 'Gnt.widget.AssignmentGrid',
            alias : 'myassignmentgrid',
            // extend buildColumns method to append extra column
            buildColumns : function () {
                // add custom column as last one
                return this.callParent(arguments).concat({
                    header       : 'Role',
                    dataIndex    : 'Role',
                    width        : 100,
                    renderer : function (val, meta, record) {
                       return record.getResource().get('Role');
                    }
                });
            }
        });

[Maxim Gorkovsky]

This should fix it:

Code: Select all

renderer : function (val, meta, record) {
    return record.getResource(this.resourceStore).get('Role');
}

[nischal]

While setting expandPickerOnFocus = true, i am getting the below error and pop-up is not opening.
"Uncaught TypeError: Cannot read property 'apply' of null"

[Maxim Gorkovsky]

Please provide runnable test case. You can modify one of our examples.