在 jTable 上使用 dependsOn 的问题

Question

我想在服务器端使用 PHP 在 jTable 上创建级联下拉列表。我一直在关注 API 中提供的演示，但尽管我很努力，但我似乎没有让它工作。使用 firebug 我发现 AJAX 没有填写第二个下拉列表的请求。无论如何，这是我拥有的部分代码。希望你能对此有所启发。

第一个下拉列表称为 "Region"，第二个下拉列表称为 "Trabajo"，具体取决于我要从数据库中提取属于它的工作场所的区域。

<script type="text/javascript">

    $(document).ready(function () {

        //Prepare jTable
        $('#PeopleTableContainer').jtable({
            title: 'Colaboradores',
            paging: true,
            sorting: true,
            defaultSorting: 'no_empleado ASC',
            actions: {
                listAction: 'usuariosActions.php?action=list',
                createAction: 'PersonActionsPagedSorted.php?action=create',
                updateAction: 'PersonActionsPagedSorted.php?action=update'
            },
            fields: {
                no_empleado: {
                    title: 'Numero de colaborador',
                    key: true,
                    edit: false,
                },
                nombres: {
                    title: 'Nombres',
                },
                apellido_paterno: {
                    title: 'Apellido paterno',
                },
                apellido_materno: {
                    title: 'Apellido materno',
                },
                genero: {
                    title: 'Genero',
                    type: 'radiobutton',
                    options:{'0':'FEMENINO','1':'MASCULINO'},
                    list:false
                },
                fecha_nacimiento: {
                    title: 'Fecha de nacimiento',
                    type: 'date',
                    displayFormat: 'yy-mm-dd',
                    list:false  
                },
                estado_civil: {
                    title: 'Estado civil',
                    options:{ '-1':'','1': 'CASADO', '2': 'DIVORCIADO', '3': 'SOLTERO','4':'UNION LIBRE','5':'VIUDO' },
                    list:false
                },
                dependientes: {
                    title: 'Número de dependientes',
                    options:{ '-1':'','0':'0','1': '1', '2': '2', '3': '3','4':'4','5':'5','6':'6','7':'7','8':'8','9':'9','10':'10','11':'11','12':'12','13':'13','14':'14','15':'15','16':'16','17':'17','18':'18','19':'19','20':'20' },
                    list:false
                },
                seguro_social: {
                    title: 'Número de seguridad social',
                    list:false
                },
                RFC: {
                    title: 'RFC',
                    list:false
                },
                calle: {
                    title: 'Calle',
                    list:false
                },
                no_ext: {
                    title: 'No. Ext',
                    list:false
                },
                no_int: {
                    title: 'No. Int',
                    list:false
                },
                colonia: {
                    title: 'Colonia',
                    list:false
                },
                mun_del: {
                    title: 'Del/Mun',
                    list:false
                },
                zip: {
                    title: 'Zip',
                    list:false
                },
                telefono: {
                    title: 'Telefono',
                    list:false
                },
                entidad_federativa: {
                    title: 'Entidad federativa',
                    list:false
                },
                fecha_antiguedad: {
                    title: 'Fecha ingreso',
                    type: 'date',
                    displayFormat: 'yy-mm-dd',
                    list:false
                },
                fecha_puesto: {
                    title: 'Fecha de inicio en el puesto',
                    type: 'date',
                    displayFormat: 'yy-mm-dd',
                    list:false
                },
                escolaridad: {
                    title: 'Escolaridad',
                    options:{ '-1':'','1': 'PRIMARIA', '2': 'SECUNDARIA', '3': 'PREPARATORIA','4':'UNIVERSIDAD','5':'ESPECIALIDAD','6':'POSGRADO','7':'MAESTRIA' },
                    list:false
                },
                puesto: {
                    title: 'Puesto',
                    list:false
                },
                contrato: {
                    title: 'Contrato',
                    options: {'-1':'','1':'Contrato por Tiempo Indeterminado','2':'Contrato por Tiempo Determinado','3':'Contrato por Obra Determinada','4':'Contrato por Tiempo Determinado'},
                    list:false
                },
                ocupacion:{
                    title: 'Ocupacion',
                    type: 'textarea',
                    list:false
                },
                region: {
                    title: 'Región',
                    options: 'usuariosActions.php?action=region',
                    list:false
                },
                trabajo: {
                    title: 'Centro de trabajo',
                    dependsOn: 'region',
                    options: function(data){
                        if(data.source == 'list'){
                            return 'usuariosActions.php?action=workplaces&region=0';
                        }
                        return 'usuariosActions.php?action=workplaces&region=' + data.dependedValues.region;
                    },
                    list:false
                }
            }
        });

        $('#LoadRecordsButton').click(function (e) {
            e.preventDefault();
            $('#PeopleTableContainer').jtable('load', {
                no_empleado: $('#no_empleado').val()
            });
        });
        //Load person list from server
        $('#LoadRecordsButton').click();
    });
</script>

这是 PHP 代码

<?php
require_once("dbconnect.php");
if($_GET["action"] == "list")
{
    //Get record count
    if(isset($_POST['no_empleado']) && $_POST['no_empleado'] != ""){
        $sql_result = 'SELECT
        c.`no_empleado`,
        c.`nombres`,
        c.`apellido_paterno`,
        c.`apellido_materno`,
        c.`fecha_nacimiento`,
        c.`fecha_antiguedad`,
        c.`fecha_puesto`,
        c.`estado_civil`,
        c.`dependientes`,
        c.`seguro_social`,
        C.`escolaridad`,
        C.`puesto`,
        C.`RFC`,
        C.`genero`,
        C.`contrato`,
        C.`ocupacion`,
        C.`calle`,
        C.`no_int`,
        C.`no_ext`,
        C.`colonia`,
        C.`zip`,
        C.`mun_del`,
        C.`telefono`,
        C.`entidad_federativa`,
        c.`id_workplace` as trabajo,
        r.`id_region` as region
        FROM `colaboradores` AS c 
        INNER JOIN `workplaces` AS w
        ON w.`id_workplace` = c.`id_workplace`
        INNER JOIN `regiones` AS r
        ON r.`id_region` = w.`id_region`
        WHERE `no_empleado`= '.$_POST["no_empleado"].';';
        $sql_count = 'SELECT COUNT(*) AS RecordCount FROM `colaboradores` WHERE `no_empleado`= '.$_POST["no_empleado"].';';
    }
    else{
        $sql_result = 'SELECT
        c.`no_empleado`,
        c.`nombres`,
        c.`apellido_paterno`,
        c.`apellido_materno`,
        c.`fecha_nacimiento`,
        c.`fecha_antiguedad`,
        c.`fecha_puesto`,
        c.`estado_civil`,
        c.`dependientes`,
        c.`seguro_social`,
        C.`escolaridad`,
        C.`puesto`,
        C.`RFC`,
        C.`genero`,
        C.`contrato`,
        C.`ocupacion`,
        C.`calle`,
        C.`no_int`,
        C.`no_ext`,
        C.`colonia`,
        C.`zip`,
        C.`mun_del`,
        C.`telefono`,
        C.`entidad_federativa`,
        r.`id_region` as region,
        c.`id_workplace` as trabajo
        FROM `colaboradores` AS c 
        INNER JOIN `workplaces` AS w
        ON w.`id_workplace` = c.`id_workplace`
        INNER JOIN `regiones` AS r
        ON r.`id_region` = w.`id_region`
        ORDER BY ' . $_GET["jtSorting"] . ' LIMIT ' . $_GET["jtStartIndex"] . ',' . $_GET["jtPageSize"] . ';';
        $sql_count = 'SELECT COUNT(*) AS RecordCount FROM `colaboradores`';
    }

    $result = $mysqli->query($sql_count);
    $row = $result->fetch_assoc();
    $recordCount = $row['RecordCount'];
    //Get records from database
    $result = $mysqli->query($sql_result);

    //Add all records to an array
    $rows = array();
    while($row = $result->fetch_assoc())
    {
        $rows[] = $row;
    }
    //Return result to jTable
    $jTableResult = array();
    $jTableResult['Result'] = "OK";
    $jTableResult['TotalRecordCount'] = $recordCount;
    $jTableResult['Records'] = $rows;
    print json_encode($jTableResult);
}
if($_GET["action"] == "region"){

    $sql_count = 'SELECT `id_region` as Value ,`nombre_region` as DisplayText FROM `regiones`;';
    $result = $mysqli->query($sql_count);
    $rows = array();
    while($row = $result->fetch_assoc()){
        $rows[] = $row;
    }
    //Get records from database
    $jTableResult = array();
    $jTableResult['Result'] = "OK";
    $jTableResult['Options'] = $rows;
    print json_encode($jTableResult);   
}
if($_GET["action"] == "workplaces"){
    $region=$_GET['region'];
    if ($region == "")
        $result = $mysqli->query("SELECT `id_workplace` as Value, `nombre_workplace` as DisplayText FROM `workplaces` ");
    else
        $result = $mysqli->query("SELECT `id_workplace` as Value, `nombre_workplace` as DisplayText FROM `workplaces` WHERE `id_region` = '".$region."'");
    $rows = array();
    while ($row = $result->fetch_assoc()) {
        $rows[] = $row;
    }
    $jTableResult = array();
    $jTableResult['Result'] = "OK";
    $jTableResult['Options'] = $rows;
    print json_encode($jTableResult);
}

Answer 1

我是对的，dependsOn 没有发送任何类型的事件信号，因此没有进行 ajax 调用。我使用的是 zip 附带的 min.js，但它不是最新版本 2.4.0，而是 2.2.0。似乎此功能尚未在该版本上实现或存在错误。

无论如何，请坚持使用 2.4.0 版本，如果您运行遇到麻烦，请务必查看 js 版本。

在 jTable 上使用 dependsOn 的问题

Issue using dependsOn on jTable

php

ajax

jquery

jquery-jtable