inline editor

marianidiego

I need help!!!!

I made a whole site with datatables, but one thing I can't do! HELP!!!!!!!

PURPOSE: I wanted to screare a page where I could put my personal notes. It was supposed to be simple. I thought I would make it so that with a double-click of the mouse, I would activate the inlineeditor, and when I got out of focus, it would save it for me.

PROBLEM: When I press ENTER, I get out of focus onblur.... very annoying!

MY FILES:

SERVER:
// Build our Editor instance and process the data coming from _POST
Editor::inst( $db, 'login', 'login_id' )
->fields(
Field::inst( 'login_id' )->set(false),
Field::inst( 'personalnotes' )
)

                ->where( 'login_id', $_SESSION['user_id'])
                ->process( $_POST )
                ->write( $ADMIN['login']->hasPermission('ModifyData') )
                ->debug($_SESSION['config']['PHP']['SHOW_ERROR'])
                ->json();

FRONTEND:

    <!-- page script -->    
    <script>

        var fatherEditor;

        <?php $csrf1=CSRF::generate('personalnotes');?>

        $(document).ready(function() {

            fatherEditor = new $.fn.dataTable.Editor( {
                "serverSide":   true,
                ajax: {
                    url: "dist/cont/tpl_login/personalnotes.php",
                    type: 'POST',
                    data: function ( d ) {
                        d.csrf_token = "<?=$csrf1?>";
                    }
                },
                "table": "#example",        
                "fields": [             
                    {
                        title:  'Notes', 
                        width:  "80%",
                        name:   "personalnotes",
                        type:   "textarea"
                        /*type: "ckeditorClassic" DONT WORK !?!?*/
                    }
                ],
                formOptions: {
                    main: { submitOnReturn: false }
                }
            });




            var fatherTable = $('#example').DataTable({
                "language": {   "url": "<?=$ADMIN['lng']->t('DATATABLES', 'i18n');?>" },
                dom: "Bt",
                info:           false,
                serverSide:     false,
                select:         true,
                ajax: {
                            url: "dist/cont/tpl_login/personalnotes.php",
                            type: 'POST',
                            data: function ( d ) {
                                d.csrf_token = "<?=$csrf1?>";
                            }
                },
                columns: [
                    {
                        "width":            '100%',
                        "data":             "personalnotes",
                        render: function (data) {
                            return (data.length>0?data.replaceAll('\n', '<br>'):"Inserisci qui il tuo testo personale...");
                        }
                    }
                ],
                autoFill: {
                    editor:  fatherEditor
                },
                keys: {
                    submitOnReturn: false,
                    editor:  fatherEditor,
                    editOnFocus: false
                },
                buttons: [
                    /*{ extend: "edit",   editor: fatherEditor }*/
                ]
            });



            var height;
            $('#example').on( 'click', 'tbody td', function (e) {
                height = $('.sorting_1')[0].clientHeight;
                fatherEditor.inline( this, {
                    submitOnReturn: false,
                    submitOnBlur: true
                } );
            });

            fatherEditor.on( 'onOpen', function () {
                $('.DTE_Field_InputControl').attr('style','height:' + height + 'px!important;');
                $("textarea").each( function( i, el ) {
                    $(el).height(height);
                    $(el).height( el.scrollHeight );
                    $("textarea").width("400");
                });
            } );

        });

Then I will still have a little problmea, but I have to try it myself first.

THANK YOU!!! I have learned more about programming with you, than in the rest of my life!!!

kthorngren

Sounds like you will want to use a [Field Type plugin] to allow for text that includes returns. Take a look at CKEditor, Quill and TinyMCE.

Kevin

marianidiego

the problem is that "submitOnReturn" doesn't work.... ideas?

allan

Use onReturn: 'none' rather than submitOnReturn: https://editor.datatables.net/reference/type/form-options#onReturn .

If that doesn't fix it, can you give me a link to your page please and I'll debug it.

Allan

marianidiego

It works!!!! Thanks

marianidiego

I'm wrong, it still doesn't go. If I adding onReturn: 'none'no longer saves anything...

tangerine

If that doesn't fix it, can you give me a link to your page please and I'll debug it.
Allan

marianidiego

Resolved! And I learned how to trigger events from the browser!!!!

I inserted this line at the completion of loading the page:

$('tbody').off("keyup");

The automatism when pressing ENTER was thus disabled. Now I can write in my textarea without being thrown out....