Discuss anything related to web development but no technical support questions


Post by adambrown »

Hello there,

I am looking for some assistance in adjusting the UI on my gantt. Please see https://i.stack.imgur.com/BXKxH.png for a screenshot of my current layout.

I need to adjust the numbers in the far left column so that instead of showing 1, 2, 3 etc they show the task IDs from the database. I've tried intercepting the taskStore at load to get to the data but haven't managed to make it change.

Can anyone suggest a suitable method to swap out those incremental IDs for task IDs please?

Thanks

Post by mats »

just use a normal grid column.
{
    text : 'Some text',
    dataIndex : 'yourIdField'
}

https://docs.sencha.com/extjs/6.0.0/clas ... olumn.html

Post by adambrown »

Mats,

Thanks for your reply. However I've tried this previously and it didn't work.

Just so I'm looking in the correct please could you advise where I need to add this so it takes effect at the start of the load process? This may be the issue - I' may have put it in the wrong place. Where is the definite best place for this? Which file?

If you clarify that and it still doesn't work I will upload a test case for you.

Thanks

Post by mats »

Please look at our many samples, they all show how you define your columns.

    // setup your static columns (displayed to the left of the gantt chart)
    columns : [
        {
            xtype : 'namecolumn',
            flex  : 1,
            width : 250
        }
    ],


Post by adambrown »

Mats,

Will this definitely allow me to override the default row numbers? I can't tell from your reply.

I've read what you've linked to about adding a new column - but I don't need to add a new one. Instead, I need to be able to edit the existing IDs. See attached, highlighted.

Please confirm,

thanks
Attachments
screenshot
screenshot
Screen Shot 2017-01-20 at 14.51.57.png (39.5 KiB) Viewed 3109 times

Post by mats »

You can render any content you want in your custom column, both from "dataIndex" or using a custom renderer:
Ext.define('Gnt.examples.basic.view.Gantt', {
extend : 'Gnt.examples.lib.GanttPanel',
xtype : 'basicgantt',

// setup your static columns (displayed to the left of the gantt chart)
columns : [
{
xtype : 'namecolumn',
flex : 1,
width : 250
},
{
xtype : 'gridcolumn',
dataIndex : 'yourIdField',
width : 100
},
{
xtype : 'gridcolumn',
renderer : function(value, meta, task) { return task.get('someField'); },
width : 100
},
],
This should allow you to render anything, let me know if something's still unclear.

Post by adambrown »

Mats,

Your reply made sense - I have implemented a solution and it now works fine.

Many thanks for your prompt assistance - much appreciated.

Post Reply