当另一列为真/假时，数据表编辑器显示/隐藏编辑行中复选框列表的复选框

Posted 2023-05-07

【中文标题】当另一列为真/假时，数据表编辑器显示/隐藏编辑行中复选框列表的复选框

【英文标题】：Datatables Editor show/hide a checkbox of a list of checkbox in edit row when another column is true/false

【发布时间】：2022-01-16 22:02:11

【问题描述】：

我是数据表和编辑器的新手。

我需要帮助来隐藏或显示复选框列表的某些元素，这取决于布尔“已删除”是真还是假。 编辑行时会显示复选框，但我需要显示将其已删除列设置为 false 的人员的姓名。

我有两张表，再加上另一张表，其中第一个和第二个的引用。 第一个表是“person”，具有 FirstName、LastName、age 和 ID 自动增量以及已删除标志。 第二个表是“机构”，仅包含名称、ID 自动增量和已删除标志。

这是我的 php 代码：

<?php

include('configDB.php');
include('lib/DataTables.php');

date_default_timezone_set('UTC');

use
    DataTables\Editor,
    DataTables\Editor\Field,
    DataTables\Editor\Format,
    DataTables\Editor\Mjoin,
    DataTables\Editor\Options,
    DataTables\Editor\Upload,
    DataTables\Editor\Validate,
    DataTables\Editor\ValidateOptions;

Editor::inst($db, 'agency', 'ID')
    ->fields(
            Field::inst( 'agency.Name' )->setFormatter(Format::ifEmpty(null)),
            Field::inst( 'agency.deleted' )->setFormatter(Format::ifEmpty(false))
    )
    ->join(
        Mjoin::inst( 'person' )
            ->link( 'agency.ID', 'job.IDagency' )
            ->link( 'person.ID', 'job.IDperson' )
            ->order( 'FirstName asc' )
            ->fields(
                Field::inst( 'deleted' )->setFormatter(Format::ifEmpty(false)),
                Field::inst( 'FirstName' )->setFormatter(Format::ifEmpty(null)),
                Field::inst( 'ID' )
                    ->validator( 'Validate::required' )
                    ->options( Options::inst()
                        ->table( 'person' )
                        ->value( 'ID' )
                        ->label( 'FirstName' )
                    )
            )
            ->where('person.deleted', 0, '=')
    )
    ->process( $_POST )
    ->json();
?>

这里是我的 index.js 文件：

editor_agency = new $.fn.dataTable.Editor(
        ajax:'agency_table_backend.php',
        table:'#agency_table',
        fields: [
            
                name: 'agency.Name',
                label: 'Agency name:',
                type: 'textarea'
            ,
                name: 'person[].deleted',
            ,
                name: 'person[].ID',
                label: "Person name:",
                type: "checkbox"
            ,
                name: 'agency.deleted'
            
        ]
    );

let table = $('#agency_table').DataTable(
        dom: "Bfrtip",
        select: true,
        serverSide: true,
        processing: true,
        responsive: true,
        ajax: 
            type: 'POST',
            url: 'agency_table_backend.php'
        ,
        columns: [
            
                data: 'agency.Name',
                orderable: true,
                searchable: true
            ,
                data: 'person',
                render: '[, ].deleted',
                orderable: false,
                searchable: false
            ,
                data: 'person',
                render: '[, ].FirstName',
                orderable: false,
                searchable: false
            ,
                data: 'agency.deleted',
                orderable: false,
                searchable: false
            
        ], // END columns
        buttons:[
            
                extend: 'create',
                editor: editor_agency,
                text: 'Add agency',
                formTitle: '<h3>Add agency</h3>'
            ,
                extend: 'edit',
                editor: editor_agency,
                text: 'Edit agency',
                formTitle: '<h3>Edit agency</h3>'
            ,
                extend: 'remove',
                editor: editor_agency,
                text: 'Delete agency',
                formTitle: '<h3>Delete agency</h3>'
            
            ,
                extend: "selectedSingle",
                editor: editor_agency,
                text: "Delete FLAG agency",
                action: function ( e, dt, node, config ) 
                    var confirmDeleteA = confirm("Are you sure to remove selected agency ?");
                    if(confirmDeleteA)
                        editor_agency
                            .edit( table.row(  selected: true  ).index(), false )
                            .set( 'agency.deleted', 'true' )
                            .submit();
                    
                
            ,
                extend: "selectAll",
                editor: editor_agency,
                text: "RESTORE all agency",
                action: function ( e, dt, node, config ) 
                    var confirmRestoreA = confirm("Are you sure to restore all agency ?");
                    if(confirmRestoreA)
                        editor_agency
                            .edit( table.row(  selected: true  ).index(), false )
                            .set( 'agency.deleted', '' )
                            .submit();
                    
                
            
        ], // END buttons
        rowCallback: function( row, data, index ) 
            if (Number(data.agency.deleted).toFixed(0) == 1) 
                $(row).addClass('hidden');
            else
                $(row).removeClass('hidden');
            
        
    ); // END table

我知道什么时候隐藏已删除列的列，但我还没有这样做，看看它是否有效。

提前致谢， 黑狼

【参考方案1】：

我在 DataTables 和 Editor 的公共文档中找到了解决方案： enter link description here 在“SearchPaneOptions 类”的第 4 点

我已经改变了这个：

Field::inst( 'ID' )
                    ->validator( 'Validate::required' )
                    ->options( Options::inst()
                        ->table( 'person' )
                        ->value( 'ID' )
                        ->label( 'FirstName' )
                    )

有了这个：

Field::inst( 'ID' )
                    ->validator( 'Validate::required' )
                    ->options( Options::inst()
                        ->table( 'person' )
                        ->value( 'ID' )
                        ->label( 'FirstName' )
                        ->where(function($q)
                            $q->where('deleted', 0);
                        )
                    )