EasyUI Forum

General Category => General Discussion => Topic started by: martinh on July 16, 2018, 06:21:49 AM



Title: Datagrid onClickCell un/highlighting row
Post by: martinh on July 16, 2018, 06:21:49 AM
Hi,

Long story short, when a user clicks on a row, i want it to tick the checkbox (if invoiced = 0) of that row and highlight it.

I have done this (fairly simple/standard function), however, when the user clicks a certain cell, i dont want it to check/highlight the row i want a message to appear instead.

At the moment, when the user clicks on a cell it will check and highlight the row.

How do i only check/highlight the row when they click o na cell not in the list?



Code:
    onClickCell:function(index,field,value){
        //alert(index);// index of row clicked
        //alert(field);// db field name eg. date_edited
        //alert(value);// value of cell/db field eg. 2018-01-01

        var row = $('#dgPOs').datagrid('getRow', index); // Gets row details from datagrid

        // will unselect/uncheck line if it has already been invoiced
        if (row.invoiced == 1){
            $(this).datagrid('unselectRow',index);
        }

        // Switch statement to show msgbox depending on which cell is clicked
        switch(field) {
            case "notes":
                alert(value);
            break;
            default:
                $('#dgPOs').datagrid('highlightRow', index);
                //$('#dgPOs').datagrid('selectRow', index);
                //$('#dgPOs').datagrid('checkRow', index);
        };

    },


Title: Re: Datagrid onClickCell un/highlighting row
Post by: stworthy on July 16, 2018, 05:21:39 PM
Define a variable in a row to indicate if the row can be selected. Returning false in the 'onBeforeSelect' will prevent the row from selecting. Please look at this code.
Code:
$('#dg').datagrid({
  onBeforeSelect: function(index,row){
    var row = $(this).datagrid('getRows')[index];
    return row._selecting;
  },
  onClickCell: function(index,field,value){
    var row = $(this).datagrid('getRows')[index];
    if (field == 'productid'){
      row._selecting = true;
      $(this).datagrid('selectRow', index);
    } else {
      row._selecting = false;
    }
  }
})


Title: Re: Datagrid onClickCell un/highlighting row
Post by: martinh on July 18, 2018, 02:28:05 AM
Thanks for this stworthy.

However, it isnt quite doing what i am after.

if a user clicks on a specific cell, i need the row to remain in its selected/unselected state and then for a msgbox to pop up.

with your code supplied, clicking on the specific cell will deselect the row.


so for example.

user has the following rows selected:

row 1 = selected
row 2 = unselected

user then clicks row 1 cell 3 and a msgbox pops up
row 1's selected state will remain selected

user then clicks row 1 cell (not 3) (no popup box)
row 1's selected state will change to unselected (should toggle between selected/unselected)


does that make sense?