Extend remove button and change mode to rename the action.

Extend remove button and change mode to rename the action.

yajrayajra Posts: 21Questions: 1Answers: 1

I am trying to extend the remove button and change the action value using mode but the data being submitted to the server is empty.

{
 extend: "remove",
 editor: editor,
 text: "Publish",
 action: function ( e, dt, node, config ) {
  editor.remove(dt.rows({selected: true}).indexes())
   .title('Publish posts')
   .buttons('Confirm Publish')
   .message('Publish selected posts.')
   .mode('publish')
 }
}

There is a related issue but it does not work for me.

The expected server data I need is something like:

action: publish
data[0][id]: 1
data[0][etc]: etc

But the actual data being sent is:

action: publish

Or is there anyway that we can edit the data being sent to the server before submitting? Tried preSubmit event but does not work.

Thanks in advance!

Answers

  • yajrayajra Posts: 21Questions: 1Answers: 1

    I found a work around by just extending the selected button and creating custom post ajax request.

    {
     extend: 'selected',
     action: function ( e, dt, node, config ) {
      var formData = {
      action: 'publish',
      data: $.map(dt.rows({selected: true}).data(), function (o) {
        return o.DT_RowId;
       })
      };
                                        
      $.post(editor.s.ajax, formData)
       .then(function(response) {
        dt.draw(false);
       })                                    
    }
    

    But it would be nice to have remove button extended for the built-in confirmation prompt, etc...

  • allanallan Posts: 63,498Questions: 1Answers: 10,471 Site admin

    Hi,

    The mode() method, when being used as a setting can only be create, edit or remove. It cannot be some other arbitrary string since Editor is specifically looking for those values on the client-side (i.e. it tells it what to send).

    What to do is to use ajax.data and add some other custom property to the data object being sent to the server to add that information. You could use it to change the action string value at that point as well, Editor doesn't use that object's string value from that point.

    Allan

  • yajrayajra Posts: 21Questions: 1Answers: 1

    Found a more elegant solution based on this post https://datatables.net/forums/discussion/comment/71750/#Comment_71743.

    I just need to override the action value when the button is being submitted.

    An example is a forceDelete button. See https://github.com/yajra/laravel-datatables-assets/blob/master/js/buttons/forceDelete.js#L18-L21 for the actual button code.

                    buttons: [
                        {
                            text: '<i class="fa fa-trash"></i> Delete',
                            className: 'btn btn-danger btn-editor-remove',
                            action: function () {
                                this.submit(null, null, function(data) {
                                    data.action = 'forceDelete';
                                });
                            }
                        },
                        {
                            text: 'Cancel', className: 'btn btn-secondary ml-2', action: function () {
                                this.close();
                            }
                        }
                    ]
    
This discussion has been closed.