Make TinyMCE checkbox that returns a value instead of true/false

From my understanding the checkbox of the TinyMCE checkboxes only return true or false. Is this correct?

Is there a way to get a checkbox list? And all the item’s values inside the checkbox list that are checked will be inserted into the post through the editor.insertContent() method?

Or perhaps, do a for loop to check if each of these are checked, and if they are, retrieve a value?

(function() {
    tinymce.PluginManager.add('portfolio_shuffle_button', function( editor, url ) {
        editor.addButton( 'portfolio_shuffle_button', {
            text: 'Popup',
            icon: false,



                onclick: function() {
                    editor.windowManager.open( {
                        title: 'Choose which Items',
                        body: [

//or perhaps do a for loop to check each of these are checked and if they are retrieve a value?
                        {
                            type: 'checkbox',
                            name: 'title',
                            label: 'Your title',
                            classes: 'what' 
                        },

                        {
                            type: 'checkbox',
                            name: 'lol',
                            label: 'Your title',
                            classes: 'what'                         
                        },




                        ],
                        onsubmit: function( e ) {
                            console.log(e.data[0]);
                            console.log(e);
                            editor.insertContent( '<h3>' + e.data.body + '</h3>');
                        }
                    });
                }
        });
    });
})();

Solutions Collecting From Web of "Make TinyMCE checkbox that returns a value instead of true/false"

Proper object names

First, make sure you are using the proper object names. Instead of using label for checkboxes; use text instead. (TinyMCE Checkbox Syntax)

onsubmit:

When using the onsubmit() function; the information from the form is passed into the function. So, we can use the first argument of the function to check for form values.

So, the value from the first checkbox would be e.data.title. The second checkbox would be e.data.lol. The name of the form element will be the key for the e.data. object.

Checking values

Now, in the onsubmit() function; we can test if each checkbox holds a true or false value; and code accordingly.

Entire code

Here is the entire modified code:

editor.windowManager.open( {
    title: 'Choose which Items',
    body: [
        {
            type: 'checkbox',
            name: 'title',
            text: 'Your title',
            classes: 'what' 
        },
        {
            type: 'checkbox',
            name: 'lol',
            text: 'Your title',
            classes: 'what'                         
        }
    ],
    onsubmit: function( e ) {

        // Set var for sending back to editor
        send_to_editor = '';

        // Check first checkbox
        if(e.data.title === true) {

            send_to_editor += 'whatever value for true title';
        }
        // Check second checkbox
        if(e.data.lol === true) {

            send_to_editor += 'another value for true lol';
        }

        // Send back to editor
        editor.insertContent(send_to_editor);
    }
});

You will probably want to adjust the send_to_editor variable to suit your needs.