How to add non-data attributes to a form, with a custom button?

How to add non-data attributes to a form, with a custom button?

nick_psnick_ps Posts: 12Questions: 3Answers: 0
edited February 2021 in Editor

Hi Guys,

I'd like to add a number of non-data attributes to a form, which is then processed server side.

For example, 'number_of_copies' and 'new_document_prefix'. Theses are not stored in the database, but are used to process the selected row data. There are a large number of validations that need to be processed on the server side.

Is it possible to create a button that shows a custom form with additional attributes, that can be processed by 'preSubmit' before submitting it to the server?

The alternative is sending the selected rows to a separate form, and then return to DataTables page on submission.

I have searched the Documentation, and I am stumped. If anyone could point me in the right direction it would be greatly appreciated.

Thanks,

Nick

Answers

  • nick_psnick_ps Posts: 12Questions: 3Answers: 0
    edited February 2021

    ~~~~

  • nick_psnick_ps Posts: 12Questions: 3Answers: 0
    edited February 2021

    Is this the right strategy?

    buttons: [
    { extend: 'edit',
      text: 'Increment',
      editor: editor,
      action: function(e, dt, node, config) {
        // Instantiate a custom form here?
        editor...
        // Submit to server here? 
        ajax...
        }
      }
    ]
    
  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    Appolgies, I'm not quite understanding the intention. Let's take number_of_copies - do you just want that to be another form field that the user will fill in? You can do so even if that doesn't exist in the data for the table row - e.g.:

    {
      name: 'number_of_copies',
      label: 'Copies:',
      def: 0
    }
    

    Allan

  • nick_psnick_ps Posts: 12Questions: 3Answers: 0
    edited March 2021

    Hi Allan,
    Thanks for the reply. It pointed me in the right direction. :)

    I ended up doing this:

    buttons: [
      {
        extend: "edit",
         text: 'Increment Version',
         action: function ( e, dt, button, config ) {
            //var rows = dt.rows( { selected: true } ).count();
        //alert('Increment Version function called!');
        var path = '/projects/' + project_id + '/increment_versions'
        var parameters = { project: { 'id': project_id, 'version_ids': JSON.stringify(selected_rows_ids) }}
            if (selected_rows_ids == 0) {
               } else {
               // Using GET :-|
           //window.location = '/projects/' + project_id + '/increment_versions/' + '[' + selected_rows_ids + ']';
               // Using POST :-)
           post(path, parameters)
               }
           }
    }]
    

    Ultimately, I'll put the external form in a DataTables pop-over.

This discussion has been closed.