Answers

• allan Posts: 63,353Questions: 1Answers: 10,444 Site admin

  June 2016

  Can you give me a link to your page so I can check the issue please?

  I am afraid I don't fully understand the description. You have inline and bubble editing being activated when clicking on a single cell?

  Allan
• jgessinger Posts: 38Questions: 6Answers: 0

  June 2016 edited June 2016

  I dont have an example to upload to public sorry. I mean you have i.e. 2 columns. Each cell in the first column has the bubble edit feature, so when you click the cell, the bubble editor opens. Each cell in the second column has the inline feature enabled.
  Scenario: I click on any cell in the second column, so the inline editing is activated. Now I directly click on any cell in the first column to activate the bubble edit. Now the mini lightbox of the bubble editor is destroyed and in the background the default dropdown is displayd in the cell.
• allan Posts: 63,353Questions: 1Answers: 10,444 Site admin

  June 2016

  Can you show me your initialisation code so I can try to recreate the issue please?

  Allan
• jgessinger Posts: 38Questions: 6Answers: 0

  June 2016 edited June 2016

  I just built this example on the fly. The important part are the '.on(' event-listeners at the end. As wrote above, first try to edit a 'last-child' cell so the inline editor opens and then click on a 'first-child' cell to open the bubble editor (but directly, without losing the inline edit focus before).

  var editor = new $.fn.dataTable.Editor({
      ajax: {
          url: 'urlToEditorAction...'
      },
      table: '#example',
      fields: [
          {
              name: 'test1',
              label: 'Test 1'
          },
          {
              name: 'test2',
              label: 'Test 2'
          }
      ]
  });
  
  var table = $('#example').DataTable({
      dom: 'Bfrtip',
      ajax: 'urlToDatatablesAction...',
      serverSide: true,
      columns: [
          {
              data: 'test1',
              title: 'Test 1'
          },                  
          {
              data: 'test2',
              title: 'Test 2'
          }
      ],                
      buttons: [
          {
              extend: 'edit',
              editor: editor
          }                  
      ],
  });
  
  $(table.table().container())
      // Activate bubble edit on click on a table cell in the first column
      .on('click', 'tbody td:first-child', function () {
          $table.data('DTE').bubble(this);
      })
      // Activate inline edit on click on a table cell in the last column
      .on('click', 'tbody td:last-child', function () {
          $table.data('DTE').inline(this);
      })
  

  Will result in something like this: http://www.directupload.net/file/d/4386/of7lqasi_jpg.htm
• jgessinger Posts: 38Questions: 6Answers: 0

  June 2016 edited June 2016

  Allan, its again my fault. I'm really sorry!

  In my case I added a className to a column in the datatables options, for each cell that has a dropdown.
  i.e.:

  columns: [
      {
          data: 'test1',
          title: 'Test 1',
          className: 'dt-select'
      },                 
      {
          data: 'test2',
          title: 'Test 2'
      }
  ]
  ...
  

  Then I added the event-listeners:

  $(table.table().container())
      // Activate bubble edit on click on a table cell in the first column
      .on('click', 'tbody td.dt-select', function () {
          $table.data('DTE').bubble(this);
      })
      // Activate inline edit on click on a table cell in the last column
      .on('click', 'tbody td:not(/*some selectors I had to exclude*/)', function () {
          $table.data('DTE').inline(this);
      })
  

  I forgot to exclude '.dt-select' in the second listener, so it opened every time both, the inline and bubble editor.

  Next time I should watch a bit longer and more specific over my code. Sorry again!
• allan Posts: 63,353Questions: 1Answers: 10,444 Site admin

  June 2016 Answer ✓

  Hi,

  Thanks for posting back - very much appreciated, and great to hear you got to the bottom of it :-)

  Allan