How to include an additional field in Editor ajax/data callback?

terinfire

Fairly new to JavaScript and using DataTables -- fantastic product so far.

My only issue is that when I perform a file upload (uploadMany option on my field), I need to also include the ID.

I've also noticed that id doesn't actually get substituted when the ajax call is made -- my debugger shows it LITERALLY going to /AudioClips/Edit?id=id, rather than /AudioClips/Edit?id=123123123123123123 (or some such thing)

 $(document).ready(function ()
    {

                editor = new $.fn.dataTable.Editor(
                    {
                        ajax: { 
                            type: "POST",
                            url: "/AudioClips/Edit?id=_id_"
                        },
                        idSrc: "id",
                        table: "#Table_7b1e6ea34e74470fa1b1836333a1f899",
                        fields: [
                            { name: "name", label: "Name" },
                            {
                                name: "clips",
                                label: "Audio Clip",
                                type: "uploadMany",
                                noFileText: "No Clips Uploaded.",
                                display: function (fileId, counter)
                                {
                                    return '<img src="' + editor.file('files', fileId).web_path + '"/>';
                                }
                            }
                        ]
                } );

                $('#Table_7b1e6ea34e74470fa1b1836333a1f899').on('click', 'tbody td', function (e)
                {
                    editor.inline(this);
                } );

It'd honestly be easier for me to include the DT_RowID in the actual data getting passed into the ajax -- so using the data() function inside of ajax { } would be far superior, if there is a method to that.

Any thoughts?

allan

The upload Ajax is different from the main form although it can use it from the same source, and it isn't processing the _id_ macro. It probably should!

Best option at the moment is probably to use the ajax and ajaxData options of the upload field type - e.g.:

{
    name: "clips",
    label: "Audio Clip",
    type: "uploadMany",
    ajax: "/AudioClips/Edit",
    ajaxData: function (d) {
        d.append('id', editor.ids());
    },
    ...
}

That way id will be part of the POST data rather than a GET parameter.

Allan

terinfire

Thank you, allan! Your answer didn't work for me, but it helped me get there. I found that the method defined under ajaxData never got called. However, I knew from prior experience that the data method INSIDE ajax did get called. editor.ids() was the missing key.

For anyone else who is trying to get help, this was the "fixed" code:

               editor = new $.fn.dataTable.Editor(
                    {
                        ajax: { 
                            data: 
                            function(d) {
                                d.DT_RowID = editor.ids();
                            },
                            type: "POST",
                            url: "/AudioClips/Edit"
                        },
                        idSrc: "id",
                        table: "#Table_b98388f97bf541d2a963780c14d3ec3b",
                        fields: [
                            { name: "name", label: "Name" },
                            {
                                name: "clips",
                                label: "Audio Clip",
                                type: "uploadMany",
                                noFileText: "No Clips Uploaded.",
                                display: function (fileId, counter)
                                {
                                    return '<img src="' + editor.file('files', fileId).web_path + '"/>';
                                }
                            }
                        ]
                } );

                $('#Table_b98388f97bf541d2a963780c14d3ec3b').on('click', 'tbody td', function (e)
                {
                    editor.inline(this);
                } );