Hi,
I have a datatable with a col named "actions". In this col is an icon for editing. If I click this icon I would like to open the editor form for this row.
I searched a lot but don't find a working solution.
Below is my code for this case.
I hope someone is able to help me.
Thanks a lot
Michael

  const editorGoodsGroups = new DataTable.Editor
  ( 
    {
      table: '#goodsgroups',
      fields: 
      [        
        { 
          label: l.ADMINISTRATION_GOODS_GROUPS.ID ,
          name: "id" 
        },
        { 
          label: l.ADMINISTRATION_GOODS_GROUPS.GOODSGROUPNAME, 
          name: "labels" 
        },
        { 
          label: l.ADMINISTRATION_GOODS_GROUPS.ATTRIBUTES, 
          name: "attribute_set_id" 
        },
        { 
          label: l.ADMINISTRATION_GOODS_GROUPS.ACTIVE, 
          name: "active",
          type: "checkbox",
          separator: "|",
          options:
          [
            { label: '', value: 1 }
          ]
        }
      ]
    } 
  );     

  editorGoodsGroups.hide 
  ( 
    [ 
      'id'
    ]
  );

  var goodsgroups = new DataTable
  (
    '#goodsgroups', 
    {
      data: d,
      dom: 'Bfrtiflp',
      buttons: [
        { extend: 'create', editor: editorGoodsGroups }
      ],         
      select: false,
      pageLength: dataTablesPageLength,
      language: l.DataTables,    
      columns: 
      [
        { data: 'id', visible: false },
        { data: 'labels',
          render: function ( data, type, row )
          {
            ret = '';

            for ( j=0; j<data.length; j++ )
            {
              if ( data [ j ].lang == sprache )
              {
                ret = data [ j ].label;
              }
            }

            return ret;
          }
        },
        { data: 'attribute_set_id', visible: false },
        { data: 'active',
          render: function ( data, type, row )
          {
            if ( data == true )
            {
              return '<img src="media/aktiv-32.png" class="status_icon" />';
            }
            else
            {
              return '<img src="media/inaktiv-32.png" class="status_icon" />';
            }
          }
        },
        { data: null,
          render: function ( data, type, row )
          {
            actions = '<img src="media/bearbeiten-32.png" class="action_icon goodsgroup_edit data-id="' + data.id + '" title="' + l.ADMINISTRATION_GOODS_GROUPS.EDITDATASET + '" />';
            actions+= '<img src="media/muelleimer-32.png" class="action_icon goodsgroup_delete" title="' + l.ADMINISTRATION_GOODS_GROUPS.DELETEDATASET + '" />';

            return actions;
          }
        }
      ]
    }
  );

  $( '#goodsgroups' ).on ( 'click', '.goodsgroup_edit', function (){
    editorGoodsGroups.edit ( $( this ).attr('data-id') );
  })