Custom button in editor form - Clear all Select/Input values

Custom button in editor form - Clear all Select/Input values

CapamaniaCapamania Posts: 233Questions: 81Answers: 5
edited September 2016 in Editor

I want to have a 2nd custom button in the create form.

I'm calling editor like this which of course works for one button:  
            
editor              
    .create( {
            title: 'Some Title',
            buttons: 'Create Record'
    } );                    

And e.g. I tried this for having a second button in the form: 

editor              
    .create( {
            title: 'Some Title',
            buttons: [{ 
                        extend: 'create'
                        text: 'Submit your Vote!'           
                    }, {
                        text: 'Clear Select/Input',
                        action: function ( e, dt, node, config ) {
                            // clearing all select/input options
                        }
                    }]
                } );

The second button should clear all the input/select values user has entered in the form so far. But I'm already struggling to with the button itself.

https://editor.datatables.net/reference/type/form-options

This question has an accepted answers - jump to answer

Answers

  • CapamaniaCapamania Posts: 233Questions: 81Answers: 5
    edited September 2016

    Got it ... like described here: https://editor.datatables.net/reference/type/button-options

    editor.buttons( [
        {
        label: 'Clear Select/Input',
        fn: function () {
            alert('Select/Input');
                    // Clear all Select/Input values of form
        }
       },
        {
            label: 'Save',
            className: 'primary',
            fn: function () {
                this.submit();
            }
        },
        {
            label: 'Close',
            fn: function () {
                this.close();
            }
        }
    ] );
    

    Yet, how would a "Clear all Select/Input values of form" button would work?

  • CapamaniaCapamania Posts: 233Questions: 81Answers: 5

    So it works if I directly run the below and call each data field name which should be cleared (e.g. data: 'field_name'):

    ...
        fn: function () {
           $('#DTE_Field_field_name').val('');
        }
    ...
    
  • allanallan Posts: 63,498Questions: 1Answers: 10,471 Site admin
    Answer ✓

    Hi,

    I hadn't thought before after the difference in the fn and action methods for the two different button types from the two different bits of software... I should try and harmonise that - thanks for pointing it out.

    Regarding your question about setting them all to empty - you could do that, although it would probably be easier to use field().val() or val().

    You can get a list of the field names (meaning you can set them all to an empty string in a simple for loop) using displayed().

    Allan

  • CapamaniaCapamania Posts: 233Questions: 81Answers: 5

    Perfect ... thanks a lot!

This discussion has been closed.