Editor - Changes to JSON structure after ugrading from 1.8.1 to 1.9.0

Editor - Changes to JSON structure after ugrading from 1.8.1 to 1.9.0

craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0

Hi,

After upgrading to 1.9.0, the returned POSTDATA json string is not being processed. Here is a stringified simple example (2 validation errors)
{"data":[],"fieldErrors":[{"name":"lpattgds","status":"Value must be entered."},{"name":"lpviewid","status":"Value must be entered."}],"error":""}

If I rollback to 1.8.1 , everything works okay and the errors are displayed, or the updated data is diplayed in the table.

Regards,

Craig.

Replies

  • craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0

    Here is another example of a JSON object that is processed correctly in 1.8.1 , but fails to process in 1.9.0:

    {
    "data": [
    {
    "DT_RowId": 197,
    "ucactcode": "A00002",
    "ucactcded": "Review Exception5 6s352de",
    "ucactnot": "Please review this exception and correct if necessary.notes",
    "lw3shpurl": "http://www.lansa.com"
    }
    ],
    "fieldErrors": [],
    "error": ""
    }

  • allanallan Posts: 50,077Questions: 1Answers: 7,411 Site admin

    Hi,

    Thanks for posting this. I've not seen that problem I'm afraid - could you give me a link to your page so I can take a look and see what is going wrong?

    Thanks,
    Allan

  • craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0

    Hi Allan,

    Thank you for replying.

    Unfortunately our development server is behind a firewall and the server processing is written using LANSA which requires licensing to port elsewhere. I will see if I can get a tunnel opened.

    Is there some console.log statements I can insert in your JavaScript (dataTables.editor.js, editor.bootstrap.js) to troubleshoot in the meantime?

    Regards,

    Craig.

  • allanallan Posts: 50,077Questions: 1Answers: 7,411 Site admin

    I'm not sure where to start is the problem - as this should be working :).

    Perhaps you can show me your Javascript for the Editor and DataTable initialisation?

    Thanks,
    Allan

  • craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0
    edited May 15

    I have set up a Global JS File with defaults:

    $.extend(true, $.fn.dataTable.defaults, {
        dom: "<'row'<'col-3'l><'col-3'f><'col-6'p>>" +
        "<'row'<'col-12'tri>>",
        autoWidth: true,
        responsive: true,
        select: true,
        colReorder: false,
        scrollY: '78vh',
        scrollX: false,
        scrollCollapse: true,
        lengthChange: true,
        lengthMenu: [[10, 25, 50, 100, 250, 500, 1000, -1], [10, 25, 50, 100, 250, 500, 1000, "All"]],
        ajax: {
            dataSrc: function (data) {
                var lData = transformWebroutineData('loadData', data.webroutine);
                return lData;
            },
            type: "POST",
            data: function (d) {
                return postData('loadData');
            },
            dataType: "json",
            contentType: "application/json; charset=utf-8",
        },
        processing: true
    });
    
    $.extend(true, $.fn.dataTable.Editor.defaults, {
        display: "bootstrap",
        ajax: {
    
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            type: 'POST',
            data: function (d) {
                return postData(gEditorAction);
            },
        },
        table: "#editorTable",
        template: "#editorForm",
        formOptions: {
            main: {
                buttons: true,
                focus: 0,
                message: true,
                onBackground: 'blur',
                onBlur: 'none',
                onComplete: 'close',
                onEsc: 'close',
                onFieldError: 'focus',
                onReturn: 'none',
                submit: 'all',
                title: false,
                drawType: false,
                scope: 'row'
            },
            inline: {
                onBlur: true
            }
        }
    });
    

    Then for the specific object there is a js file:

    function DTE_Definition()  {
                
        gEditor = new $.fn.dataTable.Editor({
            
            ajax: {
                    url: wamUrl(gWam, 'wAction')
        },
        
                fields: [{
                        label: "Action Code:",
                        name: "ucactcode"
                    }, {
                        label: "Description:",
                        name: "ucactcded"
                    }, {
                        label: "Notes:",
                        name: "ucactnot",
                        type: "textarea"
                    }, {
                        label: "Tracking URL:",
                        name: "lw3shpurl",
                        type: "textarea"
                    }
                ]
            });
    
        gTable = $('#editorTable').DataTable({
            
                ajax: {
                    url: wamUrl(gWam, 'wLoadData')
                },
    
                columns: [{
                        data: "ucactcode"
                    }, {
                        data: "ucactcded"
                    }, {
                        data: "ucactnot"
                    }, {
                        data: "lw3shpurl"
                    }
                ],
                
            });
    
    };
    

    And a specific HTML include:

    <div id="editorForm">
    
        <div>
            <editor-field name="ucactcode"/>
        </div>
        <div>
            <editor-field name="ucactcded"/>
        </div>
        <div>
            <editor-field name="ucactnot"/>
        </div>
        <div>
            <editor-field name="lw3shpurl"/>
        </div>
        <div>
            <fieldset >
                <legend>User View</legend>
                <div id="uv_ucactnot">
                notes
                </div>  
                <div>
                    <a media="screen" id="uv_hyperLink" >
                    hyperlink
                    </a>
                </div>
                <div style="display:none" id="uv_hyperLink_error" class="alert alert-danger" role="alert">
                error message
                </div>  
            </fieldset>
        </div>
    
    </div>
    
    <table id="editorTable" class="table table-striped table-bordered wrap">
        <thead>
            <tr>
    
                <th>Code</th>
                <th>Description</th>
                <th>Notes</th>
                <th>Link</th>
    
            </tr>
        </thead>
    </table>
    

    Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

  • allanallan Posts: 50,077Questions: 1Answers: 7,411 Site admin

    This looks a little odd:

            data: function (d) {
                return postData(gEditorAction);
            },
    

    Its not using the data being submitted by Editor at all. That shouldn't stop a success callback though.

    In the dataTables.editor.js file if you find the line:

    complete: [ function ( xhr, text ) {
    

    and as the first line inside that function add a console.log(xhr, text);.

    Can you show me what that output is please?

    Thanks,
    Allan

  • craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0

    Hi Allan ,

    The Post is working for 1.8.1 and 1.9.0 . I use postData(action) to modify the JSON string for the LANSA expected format. Rows are being created/deleted/updated on the server in both versions.

    Version 1.8.1 (working - displays errors in editor form) and 1.9.0 (not working. editor form closes and rows in table are not updated) have identical trace strings.

  • craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0

    ````
    dataTables.editor.js
    complete: [ function ( xhr, text ) {
    // Use complete rather than success so that all status codes are
    // caught and can return valid JSON (useful when working with REST
    // services).
    trace('dte.js' + ': ' + xhr.responseText + ' - ' + text);

    output:
    dte.js: {"webroutine":{"context":{"action-request":"/CGI-BIN/lansaweb","dec-separator":".","images-path":"/images","iso-lang":"en","language":"ENG","partition":"UCP","service-name":"KWDTE01_wAction","session-key":"","session-key-method":"hidden","session-key-name":"_SESSIONKEY","technology-service":"LANSA:XHTML","user-id":"PCXUSER","webapplication":"KWDTE01","webapplication-title":"Workflow Action Code Maintenance","webroutine":"wAction","webroutine-title":""},"fields":{"W_ERROR":{"type":{"t":"H","l":8000},"value":""}},"lists":{"L_DATA":{"header":[{"name":"R_RRN","type":{"t":"I","l":8}},{"name":"UCACTCODE","type":{"t":"A","l":6}},{"name":"UCACTCDED","type":{"t":"A","l":30}},{"name":"UCACTNOT","type":{"t":"A","l":225}},{"name":"LW3SHPURL","type":{"t":"A","l":256}}],"entries":[]},"L_ERROR":{"header":[{"name":"R_FIELD","type":{"t":"H","l":10}},{"name":"R_ERROR","type":{"t":"H","l":1024}}],"entries":[["ucactcode","Value must be entered."],["ucactcded","Value must be entered."]]}}}} - success

    In my JS.

    gEditor.on('postSubmit', function (e, json, data, action, xhr) {
    gElementFocus = false;
    gPostSubmit = true;
    var debug = true;
    json = transformWebroutineData(action, json.webroutine);
    gPostSubmit = false;
    trace(JSON.stringify(json));
    return json;
    });

    output:
    {"fieldErrors":[{"name":"ucactcode","status":"Value must be entered."},{"name":"ucactcded","status":"Value must be entered."}],"data":[]}

    ```

  • craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0

  • allanallan Posts: 50,077Questions: 1Answers: 7,411 Site admin

    I'm afraid I honestly don't know - I'd need to be able to debug it directly. Any luck with the tunnel?

    Thanks,
    Allan

  • craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0

    Sorry Allan,

    The IT guy is not going to open up a port for me .

    I'll just stay with 1.8.1 until I can port an example for at a later stage.

    Thank you for looking at this. BTW , I've been using DataTables extensively for years (image below of current application). Currently trying to get Editor adapted using a POC. 1.9.0 has some needed enhancements (Bootstrap 4 , Row Sorting , Upload ) .

    Pretty busy right now, if I can get some time I'll install a local version and open a port into my local pc. For now , It looks pretty good with 1.8.1.

    Kind Regards,

    Craig.

  • craiggriffincraiggriffin Posts: 12Questions: 0Answers: 0

  • allanallan Posts: 50,077Questions: 1Answers: 7,411 Site admin

    That would be awesome - thanks. When you get a chance to set it up, drop me a PM by clicking my name above and then "Send message".

    Allan

Sign In or Register to comment.