DataTable Dependente

[Dogue150]

Tenho uma dúvida

Tenho duas datatables em uma tela, a primeira seria a tabela principal e a segunda registros dependentes. Gostaria que no ato de clicar sobre um registro da primeira tabela me retornasse valores associados na tabela dependente abaixo. As tabelas já estão criadas com chave estrangeira, porém não sei por onde começar para fazer este evento, se tenho que fazer alguma função em javascript ou algo assim.

`paginas` (
`id_pagina` int(11) NOT NULL AUTO_INCREMENT,
`nome_pagina` varchar(40) DEFAULT NULL,
`descricao` varchar(150) DEFAULT NULL,
PRIMARY KEY (`id_pagina`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;

`dependentes` (
`id_pagina_ref` int(11) NOT NULL AUTO_INCREMENT,
`id_pagina` int(11) NOT NULL,
`nome_pagina` varchar(50) NOT NULL,
`componente_pg` varchar(30) DEFAULT NULL,
`nome_componente` varchar(40) DEFAULT NULL,
`descricao` varchar(150) DEFAULT NULL,
PRIMARY KEY (`id_pagina_ref`),
KEY `fk_animais_usuario` (`id_pagina`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;


Aqui está a função para consulta, como criar um evento para apresentar o valor com a FK igual na tabela ?

public function exibir_nome(){
$resultado = parent::consulta("SELECT * FROM " . self::$tabela );
$html = "";
while ( $row = $resultado->fetch_assoc() ) {
$html .="<tr><td>{$row['nome_pagina']}</td><td>{$row['descricao']}</td><td>{$row['id_pagina']}</td></tr>"; }
return $html;

}

public function exibir_dependentes(){
$resultado = parent::consulta("SELECT * FROM " . self::$tabela_dep );
$html = "";
while ( $row = $resultado->fetch_assoc() ) {
$html .="<tr><td>{$row['nome_pagina']}</td><td>{$row['componente_pg']}</td><td>{$row['nome_componente']}</td><td>{$row['descricao']}</td><td>{$row['id_pagina']}</td></tr>"; }
return $html;

}

}

Obrigado

Editado Fevereiro 5, 2015 por Dogue150

[Lucas Amparo]

Tente a seguinte lógica.

Um evento "onclick" nas linhas da primeira tabela, passando o valor da FK como parâmetro.

Daí você cria uma página qualquer em PHP que sirva só para retornar os dados da segunda tabela, e puxa esses dados via AJAX para atualizar a tabela dependente.

<td onclick="funcao_js(valor_da_fk)">Valor X</td>

function funcao_js(valor_da_fk){
   $.ajax({  url: 'retorna_conteudo.php?x='+valor_da_fk,
  success: function(data) {
    //Aqui você coloca os dados para a segunda tabela.
  }
});
}

Espero ter ajudado.

Editado Fevereiro 10, 2015 por Lucas Amparo