how can i easily retrieve data from another table when click on a cell

how can i easily retrieve data from another table when click on a cell

robertvirussrobertviruss Posts: 2Questions: 0Answers: 0

how can i easily retrieve data from another table when click on a cell where the condition is the data of the cell i clicked?

the data i retrieved it will be displayed in a jquery ui popup when click that cell

any help or guidance is welcomed!

Replies

  • allanallan Posts: 63,161Questions: 1Answers: 10,406 Site admin

    You would need to use the API. Probably the rows().data() method would be the best starting point. Also cell().data() to get the data for the cell that was clicked on.

    Allan

  • robertvirussrobertviruss Posts: 2Questions: 0Answers: 0
    edited December 2015

    resolved thx Allan !!!

    working code bellow

    code js:

    <script>
    var editor; // use a global for the submit and return data rendering in the examples
    
    $( document ).ready(function() {
        
    
    editor = new $.fn.dataTable.Editor( {
        
    ajax: "ajax/loc.php",
    table: "#loc",
    fields: [ 
    {label: "Parcela:", name: "loc.parcela", type: "select"},
    {label: "Zona:", name: "loc.zona", type: "select"},
    {label: "Rand:", name: "loc.randx"},
    {label: "Loc:", name: "loc.loc"},
    {label: "Nord:", name: "loc.nord"},
    {label: "Sud:", name: "loc.sud"},
    {label: "Est:", name: "loc.est"},
    {label: "Vest:", name: "loc.vest"},
    {label: "Id Unic:", name: "loc.idunic"}
    ]
    } );
    
    
    
    var table = $('#loc').DataTable( {
    
    ajax: {
                url: "ajax/loc.php",
                type: "POST"
            },
            processing: true,
            serverSide: true,
            
    columns: [
    { data: "loc.parcela" },
    { data: "loc.zona" },
    { data: "loc.randx" },
    { data: "loc.loc" },
    { data:  function ( row, type, val, meta ) {
    $('#d1'+row.DT_RowId).dialog({autoOpen : false, modal : true, show : "blind", hide : "blind"});
    $('#a1'+row.DT_RowId).on("click", function() {$('#d1'+row.DT_RowId).dialog("open");});
    return '<a href="#" id="a1'+row.DT_RowId+'">'+row.loc.nord+'</a><div style="display:none;" id="d1'+row.DT_RowId+'">Decedat: '+row.a.nume+'</div>';
    }},
    { data:  function ( row, type, val, meta ) {
    $('#d2'+row.DT_RowId).dialog({autoOpen : false, modal : true, show : "blind", hide : "blind"});
    $('#a2'+row.DT_RowId).on("click", function() {$('#d2'+row.DT_RowId).dialog("open");});
    return '<a href="#" id="a2'+row.DT_RowId+'">'+row.loc.sud+'</a><div style="display:none;" id="d2'+row.DT_RowId+'">Decedat: '+row.b.nume+'</div>';
    }},
    { data:  function ( row, type, val, meta ) {
    $('#d3'+row.DT_RowId).dialog({autoOpen : false, modal : true, show : "blind", hide : "blind"});
    $('#a3'+row.DT_RowId).on("click", function() {$('#d3'+row.DT_RowId).dialog("open");});
    return '<a href="#" id="a3'+row.DT_RowId+'">'+row.loc.est+'</a><div style="display:none;" id="d3'+row.DT_RowId+'">Decedat: '+row.c.nume+'</div>';
    }},
    { data:  function ( row, type, val, meta ) {
    $('#d4'+row.DT_RowId).dialog({autoOpen : false, modal : true, show : "blind", hide : "blind"});
    $('#a4'+row.DT_RowId).on("click", function() {$('#d4'+row.DT_RowId).dialog("open");});
    return '<a href="#" id="a4'+row.DT_RowId+'">'+row.loc.vest+'</a><div style="display:none;" id="d4'+row.DT_RowId+'">Decedat: '+row.d.nume+'</div>';
    }},
    { data: "loc.idunic"}
    ],
    select: true
    
    } );
    
    /*
    $('#loc tbody').on( 'click', 'button', function () {
            var data = table.row( $(this).parents('tr') ).data();
            alert( data[0] +"'s salary is: "+ data[ 5 ] );
        } );
    
     
    $('#loc tbody').on( 'click', 'td', function () {
        alert( table.cell( this ).data() );
    } );
    */
        
    editor.on( 'open', function ( e, type ) {
            $( "#DTE_Field_loc-idunic" ).prop( "disabled", true );
    } );
    
    editor.on( 'preSubmit', function ( e, d, action ) {
    if ( action === 'create' || action === 'edit' ) {
    $.each( d.data, function ( key, row ) {
    row.loc.idunic = row.loc.parcela+'-'+row.loc.zona+'-'+row.loc.randx+'-'+row.loc.loc;
    } );
    }});
    
    
    // Display the buttons
        new $.fn.dataTable.Buttons( table, [
            { extend: "create", editor: editor },
            { extend: "edit",   editor: editor },
            { extend: "remove", editor: editor },
            { extend: 'collection', text: 'Export', buttons: ['copy', 'excel', 'csv', 'pdf', 'print']}
        ] );
     
        table.buttons().container()
            .appendTo( $('.col-sm-6:eq(0)', table.table().container() ) );
    
    });
    
    </script>
    

    php code

    <?php
     
    /*
     * Example PHP implementation used for the index.html example
     */
     
    // DataTables PHP library
    include( "../php/DataTables.php" );
     
    // Alias Editor classes so they are easy to use
    use
        DataTables\Editor,
        DataTables\Editor\Field,
        DataTables\Editor\Format,
        DataTables\Editor\Join,
        DataTables\Editor\Upload,
        DataTables\Editor\Validate;
     
     
    // Build our Editor instance and process the data coming from _POST
    Editor::inst( $db, 'loc' )
        ->fields(
            Field::inst( 'loc.parcela' ) ->options( 'parcele', 'parcela', 'parcela' ) ->validator( 'Validate::notEmpty' ),
            Field::inst( 'loc.zona' ) ->options( 'zone', 'zona', 'zona' ) -> validator( 'Validate::notEmpty' ),
            Field::inst( 'loc.randx' ) -> validator( 'Validate::notEmpty' ),
            Field::inst( 'loc.loc' ) -> validator( 'Validate::notEmpty' ),
            Field::inst( 'loc.nord' ) -> validator( 'Validate::notEmpty' ),
            Field::inst( 'loc.sud' ) -> validator( 'Validate::notEmpty' ),
            Field::inst( 'loc.est' ) -> validator( 'Validate::notEmpty' ),
            Field::inst( 'loc.vest' ) -> validator( 'Validate::notEmpty' ),
            Field::inst( 'loc.idunic' ) -> validator( 'Validate::unique' ),
            Field::inst( 'a.nume' ),
            Field::inst( 'b.nume' ),
            Field::inst( 'c.nume' ),
            Field::inst( 'd.nume' )
            ) 
        ->leftJoin( 'decedati as a', 'a.loc', '=', 'loc.nord')
        ->leftJoin( 'decedati as b', 'b.loc', '=', 'loc.sud')
        ->leftJoin( 'decedati as c', 'c.loc', '=', 'loc.est')
        ->leftJoin( 'decedati as d', 'd.loc', '=', 'loc.vest')
        ->where( $key = 'loc.loc', $value = '', $op = '!=' )
        ->process( $_POST )
        ->json();
    
    
This discussion has been closed.