Tables imbriquées : bas & bas fixe

position('bottom')

Affiche la table imbriquée comme une section pleine largeur ajoutée directement en dessous des propres champs du formulaire parent (ou en dessous de la barre d'onglets, si ce même formulaire a aussi d'autres enfants nested_table() utilisant encore la position tab par défaut - tous les placements coexistent librement sur un même formulaire). Aucun clic d'onglet n'est nécessaire pour la voir :

$xcrud = Xcrud::get_instance();
$xcrud->table('orders');
$xcrud->route('orders');
$xcrud->columns('orderNumber,orderDate,status,customerNumber');

$orderdetails = $xcrud->nested_table('Order details', 'orderNumber', 'orderdetails', 'orderNumber');
$orderdetails->columns('productCode,quantityOrdered,priceEach');
$orderdetails->fields('productCode,quantityOrdered,priceEach');
$orderdetails->order_by('productCode', 'asc');
$orderdetails->position('bottom');

echo $xcrud->render();

Ouvrir le formulaire d'édition d'une commande affiche désormais « Order details » comme un titre avec sa propre grille juste sous les propres champs de la commande - faire défiler le formulaire fait défiler la section imbriquée avec tout ce qui se trouve au-dessus.

position('bottom-fixed')

La variante collante de bottom : la même section, mais épinglée (CSS position: sticky) au bas du propre panneau défilant du formulaire pendant que le visiteur fait défiler les champs au-dessus - restant accessible sans avoir à tout faire défiler jusqu'en bas. Elle occupe par défaut 35% de la hauteur de la fenêtre (min-height: 90px, max-height: 70vh), avec une poignée de préhension déplaçable sur son propre bord supérieur pour la redimensionner, et son propre défilement interne pour les lignes enfants afin de ne jamais avoir à grandir pour tout montrer d'un coup.

La différence avec l'exemple ci-dessus tient en une seule ligne :

$orderdetails->position('bottom-fixed');

Exemple complet, correspondant à pages/nested-table-bottom-fixed.php :

$xcrud = Xcrud::get_instance();
$xcrud->table('orders');
$xcrud->route('nested-table-bottom-fixed');
$xcrud->columns('orderNumber,orderDate,status,customerNumber');

$orderdetails = $xcrud->nested_table('Order details', 'orderNumber', 'orderdetails', 'orderNumber');
$orderdetails->columns('productCode,quantityOrdered,priceEach');
$orderdetails->fields('productCode,quantityOrdered,priceEach');
$orderdetails->order_by('productCode', 'asc');
$orderdetails->change_type('priceEach', 'price', '2', ['prefix' => '$']);
$orderdetails->relation('productCode', 'products', 'productCode', 'productName', null, null, false, ' ', true);

// La seule ligne qui diffère de 'bottom' simple.
$orderdetails->position('bottom-fixed');

echo $xcrud->render();

Ouvrez le formulaire d'édition de la commande et faites défiler ses propres champs - « Order details » reste épinglé près du bas du panneau tout du long, au lieu de défiler avec le reste du formulaire comme le fait bottom simple. Faites glisser la barre de préhension sur son propre bord supérieur vers le haut ou le bas pour la redimensionner.

Référence de position()