use two or more tables from database in editor

use two or more tables from database in editor

heissenheissen Posts: 14Questions: 5Answers: 0

I use codeigniter to create editor datatables, it was normal for one table, but when i use two tables, there problem in ajax, here is model.

public function getNdsar2020($post)
{
// Build our Editor instance and process the data coming from _POST
Editor::inst( $this->editorDb, 'ndsar2020' )
    ->fields(
        Field::inst( 'no_ndsar' ),
        Field::inst( 'tgl_ndsar' ),
            // ->validator( Validate::dateFormat( 'd/m/y' ) )
            // ->getFormatter( Format::dateSqlToFormat( 'd/m/y' ) )
            // ->setFormatter( Format::dateFormatToSql( 'd/m/y' ) ),
        Field::inst( 'surat' ),
        Field::inst( 'tgl_surat' ),
        Field::inst( 'keterangan' ),
        Field::inst( 'hal' )
    )
    ->process( $_POST )
    ->json();
}

public function getPelanggan2020($post)
{
// Build our Editor instance and process the data coming from _POST
Editor::inst( $this->editorDb, 'pelanggan_2020' )
    ->fields(
        Field::inst( 'nama_pelanggan' ),
        Field::inst( 'idpel' ),
        Field::inst( 'tarif_lama' ),
        Field::inst( 'daya_lama' ),
        Field::inst( 'tarif_baru' ),
        Field::inst( 'daya_baru' ),
        Field::inst( 'jumlah' ),
        Field::inst( 'alamat' ),
        Field::inst( 'daerah_kerja' ),
        Field::inst( 'kontak' )
    )
    ->process( $_POST )
    ->json();
}

}

****and then here my editorlib.****

public function process($post)
{   
    // DataTables PHP library
    require dirname(__FILE__).'/Editor-PHP-1.9.2/lib/DataTables.php';

    //Load the model which will give us our data
    $this->CI->load->model('Sar_model');

    //Pass the database object to the model
    $this->CI->Sar_model->init($db);

    //Let the model produce the data
    $this->CI->Sar_model->getNdsar2020($post);

    //Let the model produce the data
    $this->CI->Sar_model->getPelanggan2020($post);

}

i check the ajax load result with jsonlint, and here is the problem .

Would you give me solution ??

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin

    It looks like you are dumping the JSON from both tables into the same response. If so, then yes, that will cause a problem because:

    1. It's not valid JSON
    2. DataTables expects onto the data back from the request it makes - not multiple tables worth.

    Can you show me how you are initialising the two tables on the client-side please? Are you using two different URLs or just a common one? I would typically suggest using different ones so it is easy to route them as needed on the server-side and respond only with the data needed for that request.

    If you want to combine them together into a single Ajax request, then you need to use ->data() rather than ->json() to get the data and then dump it out into JSON in your own output array.

    Allan

  • heissenheissen Posts: 14Questions: 5Answers: 0
    edited February 2020

    I'm a newbe,
    this is the controller.

    public function Ndsar2020()
        {
                $this->load->view('sar/ndsar2020',$data);
         }
            
    public function Pelanggan2020()
         {
                $this->load->view('sar/pelanggan2020',$data);
         }
    

    I use different url,
    then here my script for ndsar2020.

    var editor; // use a global for the submit and return data rendering in the examples
    
    $(document).ready(function () {
        $.fn.dataTable.moment('DD/MM/YYYY');
        editor = new $.fn.dataTable.Editor({
            ajax: "Ajax/ndsar2020.php",
            table: "#ndsar2020",
            fields: [{
                label: "Nomor Nota Dinas:",
                name: "no_ndsar",
                def: "000\/AGA.01.01\/MBSARPP\/2020"
            }, {
                label: "Tgl Nota Dinas:",
                name: "tgl_ndsar",
                type: "date",
                def: function () {
                    return new Date();
                },
                format: 'DD/MM/YYYY'
            }, {
                label: "Surat:",
                name: "surat"
            }, {
                label: "Tgl Surat:",
                name: "tgl_surat",
                type: "date",
                def: function () {
                    return new Date();
                },
                format: 'DD/MM/YYYY'
            }, {
                label: "Keterangan:",
                name: "keterangan",
                type: "textarea"
            }, {
                label: "Perihal:",
                name: "hal",
                type: "select",
                options: [{
                        label: "Survey/KKP",
                        value: "1"
                    },
                    {
                        label: "SPBJ",
                        value: "2"
                    },
                    {
                        label: "PDL",
                        value: "3"
                    }
                ]
    
            }]
        });
    
        var table = $('#ndsar2020').DataTable({
            lengthChange: false,
            ajax: "Ajax/ndsar2020.php",
            lengthChange: false,
            scrollY: 300,
            scrollCollapse: true,
            info: false,
    
            columns: [{
                    data: "no_ndsar"
                },
                {
                    data: "tgl_ndsar"
                },
                {
                    data: "surat"
                },
                {
                    data: "tgl_surat"
                },
                {
                    data: "keterangan",
    
                },
                {
                    data: "hal",
                    "render": function (val, type, row) {
                        return val == 1 ? "Survey/KKP" :
                            val == 2 ? "SPBJ" : val == 3 ? "PDL" : "";
                    }
    
                }
            ],
            select: true
        });
    
        // Display the buttons
        new $.fn.dataTable.Buttons(table, [{
                extend: "create",
                editor: editor
            },
            {
                extend: "edit",
                editor: editor
            },
            {
                extend: "remove",
                editor: editor
            }
        ]);
    
        table.buttons().container()
            .appendTo($('.col-md-6:eq(0)', table.table().container()));
    });
    

    and here my script for pelanggan2020

    var editor; // use a global for the submit and return data rendering in the examples
    
    $(document).ready(function () {
        $.fn.dataTable.moment('DD/MM/YYYY');
        editor = new $.fn.dataTable.Editor({
            ajax: "Ajax/pelanggan2020.php",
            table: "#pelanggan2020",
            fields: [{
                label: "Nama Pelanggan:",
                name: "nama_pelanggan"
            }, {
                label: "ID Pelanggan:",
                name: "idpel"
            }, {
                label: "Tarif Lama:",
                name: "tarif_lama"
            }, {
                label: "Daya Lama:",
                name: "daya_lama"
            }, {
                label: "Tarif Baru:",
                name: "tarif_baru"
            }, {
                label: "Daya Baru:",
                name: "daya_baru"
            }, {
                label: "Jumlah Pelanggan:",
                name: "jumlah"
            }, {
                label: "Alamat:",
                name: "alamat"
            }, {
                label: "Daerah Kerja:",
                name: "daerah_kerja"
            }, {
                label: "Kontak:",
                name: "kontak"
    
    
            }]
        });
    
        var table = $('#pelanggan2020').DataTable({
            lengthChange: false,
            ajax: "Ajax/pelanggan2020.php",
            lengthChange: false,
            scrollY: 300,
            scrollCollapse: true,
            info: false,
    
            columns: [{
                    data: "nama_pelanggan"
                },
                {
                    data: "idpel"
                },
                {
                    data: "tarif_lama"
                },
                {
                    data: "daya_lama"
                },
                {
                    data: "tarif_baru"
    
                },
                {
                    data: "daya_baru"
    
                },
                {
                    data: "jumlah"
    
                },
                {
                    data: "alamat"
    
                },
                {
                    data: "daerah_kerja"
    
                },
                {
                    data: "kontak"
                }
            ],
            select: true
        });
    
        // Display the buttons
        new $.fn.dataTable.Buttons(table, [{
                extend: "create",
                editor: editor
            },
            {
                extend: "edit",
                editor: editor
            },
            {
                extend: "remove",
                editor: editor
            }
        ]);
    
        table.buttons().container()
            .appendTo($('.col-md-6:eq(0)', table.table().container()));
    });
    

    Collin, would you give me suggestion, how to create singel Ajax request, the use
    -> data() to get the data and then dump it to JSON ??? I have searched various literature from yesterday, and no found solution :cry:

  • heissenheissen Posts: 14Questions: 5Answers: 0

    Sorry, I mean Allan...

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin
    Answer ✓

    You have the tables pointing to two different files:

    ajax: "Ajax/pelanggan2020.php",
    

    and

            ajax: "Ajax/ndsar2020.php",
    

    Assuming they each return their own JSON object, that should be all that is needed. If they are both returning the data for both tables, that then is an error in the controller.

    Allan

  • heissenheissen Posts: 14Questions: 5Answers: 0

    Thanks Allan,
    So, the problem in the controller. What should i do now to clear last JSON data when i access new url ?

  • heissenheissen Posts: 14Questions: 5Answers: 0

    Solved,
    I create new EditorLib file to make singel Ajax response. thanks Allan, you're just awsome.....

This discussion has been closed.