datatable type field - nested editing

UMR5558 · August 2021

Hello everybody.
I tried datatable type fields, it's really great and it works really well.
Currently when I add an item to the datatable type fields the options are hard in the code. Is there a way to make option filling dynamic by querying a table in a database.
Thanks for your help
Lionel

allan · August 2021

Taking this example do you mean the options on line 13-20? If so, then yes, the options for that Editor would be populated in the same way as a regular list of options.

Allan

UMR5558 · August 2021

I am currently trying this solution hand in vain at the moment. But as you tell me that this is the solution I will continue to look in this direction. Thank you again and have a good day.
Lionel

allan · August 2021

Feel free to post a link to the page you are having problems with - we can take a look.

Allan

UMR5558 · September 2021

Hello Allan thanks agin for your help. My project is on the internal network of my university behind a gatekeeper and therefore not accessible from the outside. So I can't give a link. As the options go back up as in the case of the select type I did some tests with this type of fields. I am encountering a problem. I built a select type that works in an editor. When I take this same type select and I place it in the second editor (siteEditor) of the datatable type field the options do not go up and the select remains empty.
I don't uderstand why.
Lionel

my code in nested2.html file
var siteEditor = new $.fn.dataTable.Editor( {
ajax: '../../controllers/sitesNested2.php',
fields: [ {
label: 'Designation:',
name: 'magasin.articles.designation'
}, {
label: 'Categories:',
name: 'magasin.articles.categorie_id',
type: 'select'
}, {
label: 'Date creation:',
name: 'magasin.articles.date_creation',
type: 'datatable',
options:
[
{ label: '2020-06-07', value: '2020-06-07' },
{ label: '2020-07-07', value: '2020-07-07' }
]
}
]
} );

in my sitesNested2.php file
Editor::inst( $db, 'magasin.articles' )
->fields(
Field::inst( 'magasin.articles.id' ),
Field::inst( 'magasin.articles.designation' ),
Field::inst( 'magasin.articles.date_creation' ),
Field::inst( 'magasin.articles.categorie_id' )
->options( Options::inst()
->table( 'magasin.categories' )
->value( 'magasin.categories.id' )
->label( 'magasin.categories.nom' )
),
Field::inst( 'magasin.categories.nom' )
)
->leftJoin( 'magasin.categories', 'magasin.categories.id', '=', 'magasin.articles.categorie_id' )
->process( $_POST )
->json();

UMR5558 · September 2021

Hello again.
Je continue mes tests. j'ai ajouté une nouvelle datatable $('#example2') et une var editor2 pour voir si cela fonctionne bien avec mon fichier joinNested3.php. Cela fonction bien.
Pour mon datatable type field j'appelle le meme editor2 et cela fonctionne.
La seule difference entre editor2 et siteEditor c'est la ligne table: '#example2',. Si je supprime cette ligne cela ne fonctionne plus exactement comme si j'appelle siteEditor.
C'est un peu comme si les options qui sont bien remontées par le fichier php ne savaient pas ou elle doivent s'appliquer.
J'ai conscience que j'utilise un langage un peu imagé pour etre le plus explicite possible.
J'aimerais joindre mon fichier mais je ne sais pas comment. Je colle donc la source a la suite de ce message. la présentation n'est pas belle et difficile a lire, j'en suis desolé. merci pour votre aide.
Lionel
....
var editor; // use a global for the submit and return data rendering in the examples

$(document).ready(function() {

var siteEditor = new $.fn.dataTable.Editor( {
    ajax: '../../controllers/joinNested3.php',
    fields: [ {
            label: 'Designation:',
            name: 'magasin.articles.designation'
        }, {
            label: 'Categories:',
            name: 'magasin.articles.categorie_id',
            type: 'select'
        }, {
            label: 'Date creation:',
            name: 'magasin.articles.date_creation',
            type: 'datatable',
            options: 
            [
                { label: '2020-06-07', value: '2020-06-07' },
                { label: '2020-07-07', value: '2020-07-07' }
            ]
        }
    ]
} );

var editor2 = new $.fn.dataTable.Editor( {
    ajax: '../../controllers/joinNested3.php',
    table: '#example2',
    fields: [ {
            label: 'Designation:',
            name: 'magasin.articles.designation'
        }, {
            label: 'Categories:',
            name: 'magasin.articles.categorie_id',
            type: 'select'
        }, {
            label: 'Date creation:',
            name: 'magasin.articles.date_creation',
            type: 'datatable',
            options: 
            [
                { label: '2020-06-07', value: '2020-06-07' },
                { label: '2020-07-07', value: '2020-07-07' }
            ]
        }
    ]
} );




editor = new $.fn.dataTable.Editor( {
    ajax: '../../controllers/joinNested2.php',
    table: '#example',
    fields: [ {
            label: 'sortie id:',
            name: 'magasin.sorties.id'
        }, {
            label: 'date_sortie:',
            name: 'magasin.sorties.date_sortie'
        }, {
            label: 'quantite:',
            name: 'magasin.sorties.quantite'
        }, {
            label: 'type sortie:',
            name: 'magasin.sorties.type_sortie_id',
            type: 'select'
        }, 
        {
            label: 'article id:',
            name: 'magasin.sorties.article_id',
            type: 'datatable',
            editor: editor2,
            optionsPair: {
                value: 'id',
            },
            config: {
                dom: 'Bfrtip',
                ajax: {
                    url: '../../controllers/joinNested3.php',
                    type: 'POST'
                },
                columns: [
                    {
                        title: 'Designation',
                        data: 'magasin.articles.designation'
                    },
                    {
                        title: 'Date creation',
                        data: 'magasin.articles.date_creation'
                    },
                    {
                        title: 'Categories',
                        data: 'magasin.categories.nom'
                    }
                ],
                select: true,
                buttons: [
                    { extend: 'create', editor: editor2 },
                    { extend: 'edit',   editor: editor2 },
                    { extend: 'remove', editor: editor2 }
                ]
            }
        }
    ]
} );





$('#example').DataTable( {
    dom: 'Bfrtip',
    ajax: {
        url: '../../controllers/joinNested2.php',
        type: 'POST'
    },
    columns: [
        { data: 'magasin.sorties.id' },
        { data: 'magasin.sorties.date_sortie' },
        { data: 'magasin.sorties.quantite' },
        { data: 'magasin.sorties.article_id' }
    ],
    select: true,
    buttons: [
        { extend: 'create', editor: editor },
        { extend: 'edit',   editor: editor },
        { extend: 'remove', editor: editor }
    ]
} );

$('#example2').DataTable( {
    dom: 'Bfrtip',
    ajax: {
        url: '../../controllers/joinNested3.php',
        type: 'POST'
    },
    columns: [
        { data: 'magasin.articles.date_creation' },
        { data: 'magasin.articles.designation' }
    ],
    select: true,
    buttons: [
        { extend: 'create', editor: editor2 },
        { extend: 'edit',   editor: editor2 },
        { extend: 'remove', editor: editor2 }
    ]
} );

} );

</script>

</head>
<body class="dt-example php">
<div class="container">
<section>
<div class="demo-html">
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>id</th>
<th>date_sortie</th>
<th>quantite</th>
<th>article_id</th>
</tr>
</thead>
<tfoot>
<tr>
<th>id</th>
<th>date_sortie</th>
<th>quantite</th>
<th>article_id</th>
</tr>
</tfoot>
</table>
<table id="example2" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>date_creation</th>
<th>designation</th>
</tr>
</thead>
<tfoot>
<tr>
<th>date_creation</th>
<th>designation</th>
</tr>
</tfoot>
</table>

        </div>



    </section>
</div>

</body>

UMR5558 · September 2021

Sorry, in my last message i paste the french version now the google english version:
Hello again.
I continue my tests. I added a new datatable $ ('# example2') and a var editor2 to see if it works well with my joinNested3.php file. It works well.
For my datatable type field I call the same editor2 and it works.
The only difference between editor2 and siteEditor is the table line: '# example2' ,. If I delete this line it no longer works exactly like calling siteEditor.
It is a bit as if the options which are correctly reported by the php file do not know where they should apply.
I am aware that I use a slightly colorful language to be as explicit as possible.
I would like to attach my file but I don't know how. I therefore paste the source after this message. the presentation is not beautiful and difficult to read, I am sorry. Thanks for your help.
Lionel

UMR5558 · September 2021

Also I have a related question. in the siteEditor I added a new datatable type field. But I can not add the buttons of creation of edition, nor the parameters of config. Is there a possibility of stacking datatable type fields into datatype fields?

allan · September 2021

Is there a possibility of stacking datatable type fields into datatype fields?

I don't quite understand what you mean I'm afraid. Could you illustrate with an example?

Regarding the files - do you want to drop them to me by e-mail please? allan @ this domain

Allan

datatable type field - nested editing

datatable type field - nested editing

Answers

Howdy, Stranger!

Categories

DataTables

datatable type field - nested editing

datatable type field - nested editing

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables