Edited fields with if/else conditionals display correctly, but not submitting data when changed

Edited fields with if/else conditionals display correctly, but not submitting data when changed

HollyLHollyL Posts: 10Questions: 2Answers: 0

Link to test case: Sorry this is running on a protected server, so I don't have a test case easily available.

Error messages shown:
No error messages are shown.

Description of problem:
I have an inline edit, with 2 fields that are editable. LASTLOAD and ACRESR
LASTLOAD has a select option of Yes or No

What I need to happen is,
if LASTLOAD gets changed to Y, then ACRESR =0
else if LASTLOAD gets changed to N and ACRESR < HVSTACRES, then keep what is in ACRESR
else if LASTLOAD gets changed to N then ACRESR = HVSTACRES

This technically displays correctly, if you look in the datatables render function, however, it doesn't submit.
How can I get this to submit to the database? I am new to Editor and am still building my javascript skills.

I did try adding it in the editor.on function and submit function, but it didn't work there, what would that look like?
Do you have a full good example of this? I have looked through many similar forum questions, but couldn't get it to work.

Thank you!

//javascript code below

$(document).ready(function() {
    var editor = new $.fn.dataTable.Editor( {
        ajax: 'php/table.acresremain.php',
        table: '#agbfrep',
        responsive: true,
        buttons: [
            'copy', 'excel', 'pdf',
                {
                    extend: 'pdfHtml5',
                    messageTop: 'PDF created by PDFMake with Buttons for DataTables.'
                }
          ],
        fields: [

            {
                "label": "Last Load:",
                "name": "LASTLOAD", //Last Load Toggle
                type:  "select",
                options: [
                    { label: "No", value: "N" },
                    { label: "Yes",  value: "Y" }
                ],

            },
            {
                "label": "Acres Remaining:",
                "name": "ACRESR",


            }
        ]
    } );







    var table = $('#agbfrep').DataTable( {
        //serverSide: true,
        responsive: true,
        ajax: 'php/table.acresremain.php',
        dom: 'Bfrtip',
        order: [ 1, 'asc' ],
        columns: [

            {
                "data": "YEAR" //Year must remain for compound key, even though we hiding it
            }, 
            {
                "data": "NAME" //Common Name
            },
            {
                "data": "CONFIELD" //Contract Number + Field
            },
            {
                "data": "HVSTACRES" //Harvest ACres
            }, 


            {
                "data": "LASTLOAD", //Last Load
                type:  "select",
                options: [
                    { label: "No", value: "N" },
                    { label: "Yes",  value: "Y" }
                ],
                render: function ( data, type, row, e) {
                    lastopt = '';
                    if ((row.LASTLOAD) === 'Y'){
                        lastopt = 'Yes';
                    }
                    else {
                        lastopt ='No';
                    }
                    return lastopt;
                }

            },
            {
                "data": "ACRESR", //Acres Remaining
                    render: function ( data, type, row, id, e ) {
                        acre = '';
                            if ((row.LASTLOAD) == 'Y')
                            {
                                acre = '0';
                            }
                            else if ((row.ACRESR) < (row.HVSTACRES))
                            {
                                acre = (row.ACRESR);
                            }
                            else
                            {
                                acre = (row.HVSTACRES);
                            }

                        return acre;
                    },

            },

            {
                "data": "DEFPYMT" //Deffered Payment
            },
            {
                "data": "TAREPCT",
                render: DataTable.render.number( null, null, 2 )  //Tare %
            },
            {
                data: null,
                render: function ( data, type, row ) {
                    sugarpct = ( Math.round(( row.SUGPCTP / row.QUALRAW ) * 100) / 100  );
                    return sugarpct; //sugar percent
                }
            },
            {
                data: null,
                render: function ( data, type, row ) {
                    num = (( row.TRKTOTAL * (100 - row.TRKTARE) /100 )/ row.HVSTACRES ) ; 
                   return num.toFixed(1); // yield
                }
            },


            {
                "data": null, 
                render: function ( data, type, row ) {
                    slm = (sugarpct - (row.RECOVSUG));
                    return slm.toFixed(2); //SLM
                }  
            }


        ],
        "columnDefs": [{
            //"targets": -1,
            //"data": null,
        },
            {
            "targets": [0],
            "visible": false,
                "searchable": false
            }
        ],

        select: true,
        lengthChange: false,
    } );


    // I tried this but can't get it to work when adding field values and if/else statements
    // $( editor.field( 'LASTLOAD' ).input() ).on( 'change', function (e, d) {
    //     if ( ! d || ! d.editor ) {

    //         //**Reset Acres Remaining
    //         editor.field( 'ACRESR' ).val(0);
    //   }} );








// Activate an inline edit on click of a table cell
$('#agbfrep').on( 'click', 'tbody td:not(.child)', function (e) {
    // Ignore the Responsive control and checkbox columns
    if ( $(this).hasClass( 'control' ) || $(this).hasClass('select-checkbox') ) {
        return;
    }

    editor.inline( this, {onBlur: 'submit',

    submit: 'allIfChanged'} );
} );



    table.buttons().container()
        .appendTo( $('.col-md-6:eq(0)', table.table().container() ) );
} );



}(jQuery));

This question has accepted answers - jump to:

Answers

  • allanallan Posts: 56,888Questions: 1Answers: 9,042 Site admin
    Answer ✓

    Hi,

    dependent() is going to be the function to use here, but the call back will need to be a function with the logic you describe in it. I'd suggest also having HVSTACRES as a hidden field type, which will help make the value more easily obtainable.

    You note that you could get the logic to work - perhaps you could show me what you had?

    Allan

  • HollyLHollyL Posts: 10Questions: 2Answers: 0

    Thank you so much Allan.

    It is working now! :)

    One more question, I need to add validation, would I add that separately or would I be able to add that right in this dependent statement? Do you have a good example showing use of dependent fields with validate function?

    for anyone else looking into this issue, here is the working code using the dependent function:

        editor.dependent( ['LASTLOAD'], function( val, data, callback, e ) {
            if (val === 'Y') {
                editor.field('ACRESR').set('0');
            }
    
            else if((val === 'N' ) && (editor.get('ACRESR') == '0')){ 
                harvestacres = editor.get('HVSTACRES');
                editor.set('ACRESR' , harvestacres)
            }
    
            else if ( (val === 'N') && (editor.get('ACRESR') < editor.get('HVSTACRES')) ){
                editor.field('LASTLOAD').set('N');
                editor.field('ACRESR').val;
    
            }
            callback(true);
        } );
    
  • allanallan Posts: 56,888Questions: 1Answers: 9,042 Site admin
    Answer ✓

    For this kind of validation, I'd do it with a server-side global validator. Client-side validation can be bypassed too easily!

    Regards,
    Allan

  • HollyLHollyL Posts: 10Questions: 2Answers: 0

    Thank you, the global validation worked great. Appreciate your help.

Sign In or Register to comment.