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
200
Adding button template in Hierarchical Grid
posted

Hi,

i am using grid edit mode as row and i have two butons inside the grid. once clicking on any of the button, grid row edit mode is opening.

Is there any way we can avoid grid edit mode for the unbound columns or for the readonly columns.

Thanks

Nitesh

 

Parents
  • 1905
    posted

    Hello Nitesh,

    Thank you for posting in our community.

    You can achieve the desired behavior with the use of the Selection feature and handling the rowEditingStarting event of the igGrid. By setting the mode option to “cell” and activation option to “true”, you will be able to select cells without forcing the entire row into edit mode. 

    Code Snippet
    1. {
    2.     name: "Selection",
    3.     mode: "cell",
    4.     activation: true
    5. }

     In our Updating feature, you will now want to set the editMode: to "row".  After this, you can write a function for the editRowStarting event.  This event is triggered before the start of row editing and will allow you to control when you want row editing to begin.  An example of how the Selection feature and the function should look can be seen in the code snippet below: 

    Code Snippet
    1. {
    2.     name: "Updating",
    3.     editMode: "row",
    4.     editRowStarting: function () {
    5.         // Retrieve the cell which is currently active
    6.         var cell = $(this).igGridSelection("activeCell");
    7.         // Decide whether we want the column to start editing
    8.         if (cell.index == indexOfColumnsWhichYouDoNotWantEditor){
    9.             return false;
    10.         }
    11.     }
    12. }

    cell.index will refer to the column which the active cell is in.  It begins at 0 and increments by 1 for each subsequent column.  For example, if the readOnly buttons you have exist in the first and fourth column, your if statement will look like:

    Code Snippet
    1. if( cell.index == 0 || cell.index == 3 )
    2.      return false;

    By returning false, editing is canceled and no editor is shown in the row. 

    I hope this solves your problem.  Please refer to the attached sample for more insight.

    Sample.zip
Reply Children