Editor form not closing after submit

Editor form not closing after submit

s.jacqs.jacq Posts: 15Questions: 3Answers: 3

Hi,
I just purchased DTE and need to get rid of an issue with the editor form.

DataTables is populated just fine with Ajax. I have an external button as follows which calls the editor, that works fine, value are populated.

dt_rating_editor.title($msgs["editTitle"])
                .buttons($msgs["updateLabel"])
                .edit(dt_ratings.row(".selected").index());

When I click the update button on the form (the one specified just above), the Ajax request is sent correctly, the record is updated in the database, response is 200 with JSON as follows

{"success":"true","reason":"Record updated"}

but ... the form does not close automatically. It remains open, no error, with the GIF processing.

Obviously, if everything goes well, I'd prefer the form to close by itself rather than implementing code for this (I'll have a lot of tables in this App...)

Note: If relevant, back-end if Laravel 5.2 but that should not make a difference.

Note 2: This is how the editor is built, nothing fancy I believe.

var dt_rating_editor = new $.fn.dataTable.Editor({
        ajax: {
           "contentType": "application/json, charset=utf-8",
            edit: {
                type: "POST",
                method: "PATCH",
                url: *** REMOVED HERE BUT CORRECT                
            },
            create: {
                type: "POST",
                url: *** REMOVED HERE BUT CORRECT    
            }
        },
        table: "#dt_ratings",
        idSrc: "id",
        fields: [{
            name: "id",
            type: "hidden"
        }, {
            label: "Rating",
            name: "ratingId",
            type: "select",
            optionsPair: {value: "ratingId", label: "ratingName"},
            ipOpts: get_mdRatings(),
            dataProp: 0
        }, {
            label: "Issued on",
            name: "issueDate",
            type: "datetime",
            def: function () {
                return new Date();
            },
            format: "DD-MMM-YYYY"
        }, {
            label: "Expiry date",
            name: "expiry",
            type: "datetime",
            format: "DD-MMM-YYYY"
        }]
    });

    dt_rating_editor.on("open", function (e, mode, action) {
        if (action === 'edit') {
            $("#DTE_Field_ratingId").select2().val(this.get("ratingId"));
        } else {
            $("#DTE_Field_ratingId").select2();
        }
    });

Thanks in advance or your assistance,

Regards,

Sébastien

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 54,687Questions: 1Answers: 8,553 Site admin

    Hi Sébastien,

    The issue here is in the JSON response from the server. While it is valid JSON that is being returned, it is not in the format that Editor expects.

    Editor requires that the server send back the data for the row that was updated (this is required in case any fields were updated at the server-side - an "updated time" for example). While not all tables will have such fields, having the server return the data for the row is a requirement.

    You might also find it useful to have a look at the "Ajax data" tab in the examples which shows the JSON response from this server.

    If you have any questions about that protocol, please let me know.

    Regards,
    Allan

  • s.jacqs.jacq Posts: 15Questions: 3Answers: 3

    Hi Allan,

    Thanks for the quick response. I got it from your answer and the links provided.
    So, I implemented the PHP Library from NextGen (which you mention in this post https://www.datatables.net/forums/discussion/30514/what-php-libraries-are-available-for-editor).

    It works very very well, straight out of the box with Laravel 5.2, and the response from the server is now:

    {
        "data": [{
            "DT_RowId": "row_6",
            "id": "6",
            "ratingId": "38",
            "ratingDate": "2016-02-14 12:21:49",
            "ratingExpiry": "2017-02-13 12:21:49"
        }]
    }
    

    and looks as DTE expects. Correct me if I am wrong, pls.

    However, I still have the same behavior, with the data being correctly updated in the database and the editor form staying opened.

    Thanks for your help,
    Rgds
    Sébastien

  • s.jacqs.jacq Posts: 15Questions: 3Answers: 3
    Answer ✓

    Forget my last post. You original answer sorted it.

    I had made some changes to debug while waiting for your answer. So returning the updated data made the trick and the NextGen library works fine.

    Thanks again for your assistance. Case closed for me.

    Rgds
    Sébastien

    BTW, great job with DT and DTE.

This discussion has been closed.