Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
595
How can I add a title attribute (tooltip) to a cell in the grid?
posted

I'm using Knockout JS and I have an additional model property 'comments' that I want to display on hover of a row's cell.

Is there a nice way I can do this without using JavaScript to retrospectively apply the title to cell each after the grid is rendered?

I'm using version 13.1.20131.2143 and I'm binding my grid using knockout JS:

                <table id="scenarioGrid" style="table-layout: auto !important" data-bind="
                    igGrid: {
                        dataSource: scenarios,
                        primaryKey: 'id',
                        features: [{
                            name: 'Updating',
                            editMode: 'none',
                            enableAddRow: false,
                            enableDeleteRow: false
                        }],
                        autoGenerateColumns: false,
                        columns: [
                            { key: 'id', headerText: 'Scenario ID', width: 0, hidden: true, dataType: 'number' },
                            { key: 'description', headerText: 'Description', width: 'auto', dataType: 'string' },
                            { key: 'createdBy', headerText: 'Created By', width: 120, dataType: 'string' },
                            { key: 'created', headerText: '', width: 90, dataType: 'date' },
                            { key: 'lastModifiedBy', headerText: 'Last Modified By', width: 120, dataType: 'string' },
                            { key: 'lastModified', headerText: '', width: 90, dataType: 'date', format: 'date' },
                            { key: 'options', headerText: '', width: 60, dataType: 'string', template: optionsTemplate }
                        ]
                    }">
                </table>

Parents
  • 23953
    Offline posted

    Hi will_telford,

    You can use column template in this scenario.

    For example here is an example configuration for the description column:

    { key: 'description', headerText: 'Description', width: 'auto', dataType: 'string', template: '<div style=\'width: 100%\' title=\'${comments}\'>${id}</div>' }

    Of course the "comments" model property should be declared in the grid as a column (probably hidden) in order to be available for the templating engine.

    Hope this helps,
    Martin Pavlov
    Infragistics, Inc.

Reply Children