allIfChanged option case typo

pisisler

Hi.

allIfChanged option in formOptions has a letter case typo after Editor 2.0. With Editor 1.x, it was working just like how it is documented in form-options. But after Editor 2.0, this option has one letter case changed like:

allIfChanged => Editor 1.x (as with the documentation)
allIfchanged => Editor 2.x

allan

Hi,

Thanks for your post, however, I'm not seeing that in this example I'm afraid - it appears to be working correctly.

I've also just tried grepping our code base for the incorrect string, but found nothing:

$ grep -r allIfchanged js
$ 

Grepping for the correct spelling finds multiple instances:

$ grep -r allIfChanged js
js/core/private.ts:                                     // data, so we can submit it if `all` or `allIfChanged`
js/core/private.ts:             if ( action === 'create' || changedSubmit === 'all' || (changedSubmit === 'allIfChanged' && changed) ) {
js/model/formOptions.ts:        submit: 'all' | 'changed' | 'allIfChanged';
$ 

Can you give me a link to a test case showing the issue you are seeing please?

Allan

pisisler

I was wrong, allIfchanged with small letters also didn't work. In fact it is completely ignored on my instance. None of the options work for me. If ı set it to changed, the form still submits although nothing has changed in inline edit mode; but with only one cell data. If I set it to allIfChanged, form submits all data, although nothing has changed.

Looks like it correctly regards which data to send while submitting; but it completely ignores whether to submit at all. What could be breaking this option?

PS: I can't give a public link as it has sensitive and integrated data which is behind authentication. I can however PM you if needed.

allan

perhaps you can show me how you are initialising DataTables, Editor and using the inline() method?

Allan

pisisler

This is how I initialize DT, DTE and inline editing;

editor = new $.fn.dataTable.Editor({
    formOptions: {
        main: {
            onBackground: 'none'
        },
        inline: {
            //drawType: 'none',
            submit: 'allIfChanged',
        }
    },
    ajax: {
        url: env.base + "/modules/products/products.php?p=" + env.active_page,
        data: function (d) {
            if (editor.modifier() != null)
                d.before_edit = table.row(editor.modifier()).data();
        }
    },
    table: "#products",
    fields: products_fields
});

table = $('#products').DataTable({
    pageLength:20,
    fixedColumns: { leftColumns: 2 },
    autoWidth: true,
    scrollX: true,
    scrollY: "500px",
    deferRender: true,
    scrollCollapse: true,
    dom: '<"row"<"col-sm-9"B><"col-sm-3"f>>rt<"row"<"col-sm-7"i><"col-sm-5"p>>',
    responsive: false,
    ajax: {
        url: env.base + "/modules/products/products.php?p=" + env.active_page,
    },
    language: { url: env.base + "/languages/"+ env.lang +"/datatables."+ env.lang +".json" },
    rowCallback: function( row, data ) {
        $('td.overflow-hidden', row).css( {'white-space': 'nowrap'} );
        if (data.position == 'unpublished') {
            $(row).closest('tr').removeClass('odd even');
            $(row).closest('tr').addClass('unpublished');
        }
    },
    columns: products_columns,
    order: [ 1, 'asc' ],
    select: {
        style: 'os',
        selector: 'td.select-checkbox'
    },
    buttons: [
        { extend: "create", editor: editor },
        { extend: "edit", editor: editor },
        {
            extend: "remove", editor: editor,
            formMessage: function (editor, dt) {
                products_to_delete =    dt.rows( editor.modifier() ).data().pluck('product_name');
                return '<div class="alert alert-warning"><i class="fas fa-exclamation-triangle"></i> ' +
                    table.i18n('editor.remove.confirm', null, products_to_delete.count())+ table.i18n('editor.remove.noreturn') +
                    '</div><div class="alert alert-light"><ul><li>'+products_to_delete.join('</li><li>')+'</li></ul></div>';
            }
        },
        {
            extend: "selected",
            text: (dt) => dt.i18n('custom.create.similar.button'),
            action: function (e, dt, node, config) {
                editor.edit( table.rows( {selected: true} ).indexes(), {
                    title: table.i18n('custom.create.similar.title'),
                    buttons: table.i18n('custom.create.similar.submit')
                }).mode( 'create' );
            }},
        { extend: 'pageLength', editor: editor},
        {
            extend: "collection", editor: editor,
            text: (dt) => dt.i18n('custom.export'),
            buttons: [
                'copyHtml5', 'print',
                { extend: 'pdfHtml5', download: 'open', orientation: 'landscape' },
                { extend: 'excelHtml5', filename: 'products', autoFilter: true },
                {
                    extend: 'csvHtml5', bom: true, filename: 'products',
                    fieldSeparator: ';', charset: 'utf-8', fieldBoundary: ''
                }
            ]
        },
    ],
});

$('#products').on( 'click', 'tbody td:not(:first-child, :nth-child(5), :nth-child(10))',
    function (e, d) { editor.inline(this); }
);

pisisler

By the way, I also tried passing the options while inline initialization, it didn't work either:

function (e, d) { editor.inline(this, {submit: 'allIfChanged'}); }

allan

That does look right. The only thing I can think of there, is might you have another Editor instance on the page somewhere (since editor appears to be global there)?

If you could PM me a link to the page showing the issue, that would be great. Click my forum user name above and then "Send message".

Thanks,
Allan

pisisler

No there is only one editor instance. I PM'd you development site information.

pisisler

@allan any chance you checked on this one?

allan

Apologies - I've lost track of this one! I've sent back a PM.

Regards,
Allan