Datatables as editor field

ubdpeters

This is probably pretty trivial, but I can't seem to figure this out.
I have a list of parts being displayed in a datatable. Each of those parts can have sub-parts associated with each of them. When the user selects one of the parts I would like the editor to list, in a datatable, the sub-parts associated with that part that they selected. Once the editor is open, they can add/edit/delete from that list of sub-parts.
Do I need to fill the datatable of sub-parts on the editor preOpen event?
Looking for the best solution.

allan

Do you mean like this?

Allan

ubdpeters

Yes, kind of like that. I'll look at that example a little more.

ubdpeters

I looked at the example some more and understand how it's working.
Is there a way to pass data to the ajax request for the datatable field in the editor? I only want to display specific items from a table. Not all items the example.
If I have a part number: 1234 and items 1, 5, 10 are associated with it, I only want to display those items in the editor datatable. Not items 1 - 10.

From nested.html:

            }, {
                label: 'Site:',
                name: 'users.site',
                type: 'datatable',
                editor: siteEditor,
                optionsPair: {
                    value: 'id',
                },
                config: {
                    ajax: '../../controllers/sitesNested.php',
****Like this                     data: function(d) {
                                          d.Id = dataFromAnotherTable;
                                        },
                    buttons: [
                        { extend: 'create', editor: siteEditor },
                        { extend: 'edit',   editor: siteEditor },
                        { extend: 'remove', editor: siteEditor }
                    ],
                    columns: [
                        {
                            title: 'Name',
                            data: 'name'
                        },
                        {
                            title: 'Continent',
                            data: 'continent'
                        }
                    ]
                }
            }

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

colin

You can access the main table still in that ajax.data function - so something like:

$('#mainTable').DataTable().row('selected: true').data()

which you can then pull out the field you're interested in and include like you are. Hope that helps,

Colin

ubdpeters

I'm getting: Uncaught TypeError: Cannot read property 'DT_RowId' of undefined
when I try using the ajax.data function.

colin

We would need to see that. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

ubdpeters

I get the same error message if I add the ajax.data function to the example nested.html file.

        fields: [ {
                label: 'First name:',
                name: 'users.first_name'
            }, {
                label: 'Last name:',
                name: 'users.last_name'
            }, {
                label: 'Phone #:',
                name: 'users.phone'
            }, {
                label: 'Site:',
                name: 'users.site',
                type: 'datatable',
                editor: siteEditor,
                optionsPair: {
                    value: 'id',
                },
                config: {
                    ajax: '../../controllers/sitesNested.php',
                    data: function(d) {
                        console.log("hello");
                    },
                    buttons: [
                        { extend: 'create', editor: siteEditor },
                        { extend: 'edit',   editor: siteEditor },
                        { extend: 'remove', editor: siteEditor }
                    ],
                    columns: [
                        {
                            title: 'Name',
                            data: 'name'
                        },
                        {
                            title: 'Continent',
                            data: 'continent'
                        }
                    ]
                }
            }

tangerine

We would need to see that. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.