Why Inline editing taking more space and flickering?

Why Inline editing taking more space and flickering?

sparkstersajjadsparkstersajjad Posts: 10Questions: 4Answers: 0
edited February 2020 in General

I have created datatable with inline editing.
I have few question and issue.

  1. while clicking the column of inline edit it's taking extra space from top and flickering.
  2. How to get the data after mouse move out from the inline edit mode. Actually i want on onmousemove inine edit mode should close and the same it has to call one method with editable data.
  3. How to delete the entire row data and get the deleted data details.
  4. how to fecth the data immediatel after saving.

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    edited February 2020

    while clicking the column of inline edit it's taking extra space from top and flickering.

    That doesn't happen here - can you link to your page please so we can take a look.

    Actually i want on onmousemove inine edit mode should close

    You can create an onmousemove event, then call close() to close any opened edit.

    How to delete the entire row data and get the deleted data details.

    You can call remove(). postRemove can give you details about that record.

    how to fecth the data immediatel after saving.

    Changed data will be in postSubmit. The table will update automatically.

    Colin

  • sparkstersajjadsparkstersajjad Posts: 10Questions: 4Answers: 0
    edited February 2020

    Thanks Colin

  • sparkstersajjadsparkstersajjad Posts: 10Questions: 4Answers: 0
    edited February 2020
    1. Inline Editing when click enter only it's updating the data in table. otherwise empty is printing. Actually I want on click of another column(for inline edit) and onclose (mouse out) it should update.
    2. How do I get the updated data with column name on mouseout. Now i'm getting only updated data not column name.
      if you see my code i'm using on blur but i want in moustout event (please provide examples)

                         this.dtEditor = new $.fn.dataTable.Editor({  
                          table: '#dtGrid',
                          idSrc: this.uniqueField,
                          fields: this.dataTableFields,
                          formOptions: {
                            inline: {
                              onBlur:        'close',
                              onComplete:    'close',
      
                            }
                            }
                     });
      
                     $('#dtGrid').on( 'click', 'tbody td:not(:first-child)', function(e) {
                       self.dtEditor.inline(this, {
                        onBlur: self.getColumnData(this) // i'm am binding method here on blur but i want on mouseout of column(inline editing column)
                       });
                    });
      
                    getColumnData(val) {
                      console.log('DataTable', val);
                      console.log(JSON.stringify(this.dataObj));   
                     // this.saveData(val);
                  }
      
  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    edited February 2020 Answer ✓
    1. that's submit on blur - see example here

    2. that's my second comment on my first reply above, but instead of close(), call submit() to submit the data.

    Colin

This discussion has been closed.