Displaying a modal in Slick Grid when a cell has focus only the first time it has focus

Question

I'm trying to display a message when a user gives focus to a field called reference number that is column 10 and row 1 on my slick grid. It also happens to be the last field in the grid. A modal should display a message informing the user that the reference number they are about to enter can be used to do lookups of their account activity. The following is the slick grid layout.

<script>
var columns = [
            { id: "Country", name: "Country", field: "Country", minWidth: 120,  editor: Slick.Editors.Auto},
    { id: "Manufacturer", name: "Manufacturer", field: "Manufacturer", minWidth: 120, editor: Slick.Editors.Text },
    { id: "ReferenceNumber", name: "Reference Number", field: "ReferenceNumber", minWidth: 120, editor: Slick.Editors.Text },

       ];

Here is the script that I want to use when the cell is clicked to display modal.

<script>
function cellClicked(e) {
    var grid = Columns;
    var cell = grid.getCellFromEvent(e);
    var item = grid.getDataItem(cell.row); // all the data in the row
    if (cell.cell == grid.getColumnIndex('ReferenceNumber')) {

        $('#ReferenceModal').modal('show');
        console.log("ReferenceNumber");
    }
}

How do I change the editor on the reference number field to show the modal only when the cell (column 10, row 1 ) has been entered by the user?

Thanks

winghei winghei · Accepted Answer · 2016-09-01T17:29:55

try using grid.onClick.subscribe e.g.

grid.onClick.subscribe(function(e, args) {
    var item = grid.getDataItem(args.row);
    if (args.cell == grid.getColumnIndex('ReferenceNumber')) {
        $('#ReferenceModal').modal('show');
        console.log("ReferenceNumber");
    }
    //.. do more stuff here to flag that the modal was once diplayed. I would imagine modify the item prop e.g. item.displayed=true... then invalidate the items on grid again. 
});

Displaying a modal in Slick Grid when a cell has focus only the first time it has focus

1 Answers