how to update the dependent() field when editing a record

how to update the dependent() field when editing a record

Frank YuFrank Yu Posts: 22Questions: 7Answers: 3

I can use the dependent() to update the select field in New Data mode. However, I don't know which event & code I should use when editing the data.

The following is the code I use to dynamic retrieve the json data from the server. When the user select the category field, I would get the technician's data from the server. And the editor will auto-update the Technician field select list.

editor.dependent('e.categoryguid', function(val,data,callback){
        $.ajax ( {
            url         : 'ajax/technicians_json.php',
            data        : {
                            "action"        : "getRecords4Select_All",
                            "makerguid"     : editor.val('e.makerguid'),
                            "categoryguid"  : val
                        },
            type        : 'post',
            dataType    : 'json',
            success     : function ( json ) {
                            callback( json );
                          }
        });
    }) ;

The following is my editor code:

var editor = new $.fn.dataTable.Editor( {
        ajax        : "ajax/earlyleaves_json.php",
        table       : "#datatable",
        idSrc       : "guid",
        display     : "envelope",
        fields      : [ {
                            "label"     : "Maker:",
                            "name"      : "e.makerguid",
                            "type"      : "select2"
                        }, {
                            "label"     : "Category:",
                            "name"      : "e.categoryguid",
                            "type"      : "select2"
                        }, {
                            "label"     : "Technician:",
                            "name"      : "e.technicianguids",
                            "type"      : "select2",
                            "attr"      : {
                                            "multiple": true
                                          }
                        }, {
                            "label"     : "Date:",
                            "name"      : "e.tdate",
                            "type"      : "datetime2",
                            "opts"      : {
                                            "format"     : "YYYY-MM-DD",
                                            "defaultDate": Date.now(),
                                            "sideBySide" : true
                                          }
                        }, {
                            "label"     : "Hours:",
                            "name"      : "e.hours"
                        },  {
                            "label"     : "Memo:",
                            "name"      : "e.memo"
                        }
                      ]
    });

I try to use the following code to update the Technician select list but doesn't work:

$.ajax ( {
            url         : 'ajax/technicians_json.php',
            data        : {
                            "action"        : "getRecords4Select_All",
                            "makerguid"     : editor.val('e.makerguid'),
                            "categoryguid"  : editor.val('e.categoryguid')
                        },
            type        : 'post',
            dataType    : 'json'
          //  success     : function ( res ) {
          //                  editor.set('e.technicianguids',res);
          //                }
        });

And the following the my server PHP codes:

        $rows['options']['e.technicianguids'][0]['label'] = 'All Technicians';
        $rows['options']['e.technicianguids'][0]['value'] = 'All';
        $x=1;

        $makerguid=$_POST['makerguid'];
        if ($makerguid=='All') {
            $makerfilter = '';
        } else {
            $makerfilter = " and makerguid = '$makerguid' ";
        };
        $categoryguid=$_POST['categoryguid'];
        if ($categoryguid=='All') {
            $categoryfilter = '';
        } else {
            $categoryfilter = " and categoryguid = '$categoryguid' ";
        };
        $sql   = "select guid, id, name from technician " .
                 "where flag='' $makerfilter $categoryfilter " .
                 "order by id ";
        try{
            $stmcs = $pdohr5->query($sql);
            $rowcss= $stmcs->fetchAll(PDO::FETCH_ASSOC);
            foreach($rowcss as $rowcs) {
                $rows['options']['e.technicianguids'][$x]['label'] = $rowcs['id'] . '--' .$rowcs['name'];
                $rows['options']['e.technicianguids'][$x]['value'] = $rowcs['guid'];
                $x++;
            }
        } catch(PDOException $e){
            writeErrorLogsAjax('technician', $e, $sql);
        };
        $r = $rows;
        echo (json_encode($r));

Answers

  • Frank YuFrank Yu Posts: 22Questions: 7Answers: 3

    The event I use is initCreate:

    editor.on('initCreate', function(e,node,data){
            $.ajax ( {
                url         : 'ajax/technicians_json.php',
                data        : {
                                "action"        : "getRecords4Select_All",
                                "makerguid"     : editor.val('e.makerguid'),
                                "categoryguid"  : editor.val('e.categoryguid')
                            },
                type        : 'post',
                dataType    : 'json'
              //  success     : function ( res ) {
              //                  editor.set('e.technicianguids',res);
              //                }
            });
        });
    
  • Frank YuFrank Yu Posts: 22Questions: 7Answers: 3

    The following codes don't work either, anyone has any solution:

    editor.on('open', function(){
            $.ajax ( {
                url         : 'ajax/technicians_json.php',
                data        : {
                                "action"        : "getRecords4Select_All",
                                "makerguid"     : editor.val('e.makerguid'),
                                "categoryguid"  : editor.val('e.categoryguid')
                            },
                type        : 'post',
                dataType    : 'json',
                success     : function ( res ) {
                              editor.set('options.e.technicianguids',res);
                            }
            });
        });
    
    
  • Frank YuFrank Yu Posts: 22Questions: 7Answers: 3

    Finally got it solved with the follwing codes:

    editor.on('initEdit', function(e, node, data){/
            $.ajax ( {
                url         : 'ajax/technicians_json.php',
                data        : {
                                "action"        : "getRecords4Select_All_4edit",
                                "makerguid"     : editor.val('e.makerguid'),
                                "categoryguid"  : editor.val('e.categoryguid')
                            },
                type        : 'post',
                dataType    : 'json',
                success     : function ( res ) {
                              editor.field('e.technicianguids').update( res );
                            }
            });
        });
    
    

    And the server php codes have to do some modification with the folowing codes:

     $rows[0]['label'] = 'All';
            $rows[0]['value'] = 'All';
            $x=1;
    
            $makerguid=$_POST['makerguid'];
            if ($makerguid=='All') {
                $makerfilter = '';
            } else {
                $makerfilter = " and makerguid = '$makerguid' ";
            };
            $categoryguid=$_POST['categoryguid'];
            if ($categoryguid=='All') {
                $categoryfilter = '';
            } else {
                $categoryfilter = " and categoryguid = '$categoryguid' ";
            };
            $sql   = "select guid, id, name from technician " .
                     "where flag='' $makerfilter $categoryfilter " .
                     "order by id ";
            try{
                $stmcs = $pdohr5->query($sql);
                $rowcss= $stmcs->fetchAll(PDO::FETCH_ASSOC);
                foreach($rowcss as $rowcs) {
                    $rows[$x]['label'] = $rowcs['id'] . '--' .$rowcs['name'];
                    $rows[$x]['value'] = $rowcs['guid'];
                    $x++;
                }
            } catch(PDOException $e){
                writeErrorLogsAjax('technician', $e, $sql);
            };
            $r = $rows;
    
    
  • Frank YuFrank Yu Posts: 22Questions: 7Answers: 3

    The final codes is the following, have to re-set again the value after I do an update:

    editor.on('initEdit', function(e, node, data){
            $.ajax ( {
                url         : 'ajax/technicians_json.php',
                data        : {
                                "action"        : "getRecords4Select_All_4edit",
                                "makerguid"     : editor.val('e.makerguid'),
                                "categoryguid"  : editor.val('e.categoryguid')
                            },
                type        : 'post',
                dataType    : 'json',
                success     : function ( res ) {
                              editor.field('e.technicianguids').update( res );
                              editor.set('e.technicianguids', data.e.technicianguids);
                            }
            })
        });
    
    
This discussion has been closed.