2

Tenho uma tabela que trás os meus resultados de uma pesquisa via Ajax. Mas preciso abrir um modal com mais detalhes sobre os itens da tabela, mas não consigo passar os dados para o modal. Segue o código:

Conteúdo do meu Controller de consulta

public function consultandoPropriedade(Request $request){

    if($request->ajax()){
        $output="";
        $resultados = DB::table('tb_propriedades')
                        ->join('tb_empreendimentos', 'tb_propriedades.cod_empreendimento', '=','tb_empreendimentos.cod_empreendimento' )
                        ->select('tb_propriedades.denominacao as nomePropriedade', 'tb_empreendimentos.denominacao', 'tb_empreendimentos.cod_empreendimento', 'tb_propriedades.valor', 'tb_propriedades.area', 'tb_propriedades.descricao', 'tb_propriedades.cod_propriedade')
                        ->where('tb_propriedades.denominacao', 'ILIKE', '%'.$request->criterio.'%')
                        ->orWhere('tb_empreendimentos.denominacao','ILIKE', '%'.$request->criterio.'%')
                        ->orWhere('tb_propriedades.descricao','ILIKE', '%'.$request->criterio.'%')                          
                        ->get();      

        if($resultados){
            foreach ($resultados as $key => $resultado) {
                $output.='<tr>'.                                
                             '<td>'.$resultado->nomePropriedade.'</td>'.                                
                             '<td>'.$resultado->denominacao.'</td>'.
                             '<td>'.$resultado->cod_empreendimento.'</td>'.
                             '<td>'.$resultado->cod_empreendimento.'</td>'.
                             '<td>'.$resultado->valor.'</td>'.
                             '<td>'.$resultado->area.'</td>'.
                             '<td>'.$resultado->descricao.'</td>'.                              
                             '<td><a class="teste detalhes" data-toggle="modal" data-target="#detalhes" data-denominacao="{{$resultado->nomePropriedade}}" style="color: #00628d;" href="#"><span class="glyphicon glyphicon-list" aria-hidden="true" title="Detalhes"></span></a></td>'.
                        '</tr>';
            }
            return Response($output);
        }else{
            $output.='<tr>'.
                            '<td>'."Nenhum resultado encontrado".'</td>'.                               
                        '</tr>';                
        }return Response($output);

    }

}

Conteúdo da página de consulta

                <table class="table table-bordered table-hover">
                <thead>
                    <tr>                            
                        <th>Nome da propriedade</th>
                        <th>Empreendimento</th>
                        <th>Característica</th>
                        <th>Status</th>
                        <th>Valor (R$)</th>
                        <th>Área (ha) </th>
                        <th>Descrição </th>
                        <th>Ação</th>
                    </tr>
                </thead>
                <tbody>                     

                </tbody>                    
                </table>

                <!--Modal de visualização de detalhes do item -->
                <div class="modal fade" id="detalhes" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                  <div class="modal-dialog modal-lg" role="document">
                    <div class="modal-content">
                      <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">Detalhes da propriedade</h4>
                      </div>
                      <div class="modal-body">
                         <div class="container teste">
                            <h4>Aqui irão todos os detalhes da propriedade</h4>


                                <span class="denominacao"></span>

                        </div>
                    </div>

                      <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>                                      
                      </div>  
                    </div>
                  </div>
                </div>
        </div>      
    </div>
</div>
<script type="text/javascript">
    $('#criterio').on('keyup', function(){
        $valor = $(this).val();
        $.ajax({
            type :'get',
            url : '{{URL::to('/consulta/consultandoPropriedade')}}',
            data : {
                'criterio':$valor
            },              
            success :  function(data){                  
                $('tbody').html(data);
            }
        });
    })
</script>
<script type="text/javascript">
    $('.detalhes').on('click', function(){
    var nome = $(this).data('denominacao');        

    $('span.denominacao').text('nome');

});

</script>   

Já tentei de algumas formas, mas não obtive exito, alguém pode me ajudar?

8
  • Já que está utilizando jquery, deixe seu código javascript dentro de: $(function () { //codigo aqui }) Commented 29/03/2017 às 19:01
  • insira algum valor em $output exemplo $output="Valor teste"; se o que inseriu imprimir algo, significa que tem algo de errado com requisição com o banco , eu fiz um código parecido de acordo com o código que postou, funcionou formalmente Commented 29/03/2017 às 19:03
  • Assim à a primeira vejo que devias tirar as pelicas do nome quando inseres no span
    – Miguel
    Commented 29/03/2017 às 20:32
  • @MarcosKubis Obrigada, fiz a modificação.
    – Thamyt
    Commented 30/03/2017 às 13:25
  • @Robsongomesdejesus Fiz o teste, os dados estão sendo trazidos perfeitamente para a tabela de exibição inicial. Porém ainda não consigo passar os dados para o modal.
    – Thamyt
    Commented 30/03/2017 às 13:26

1 Resposta 1

0

Como solução eu concatenei o código do Eloquent que eu estava tentado passar para o modal.

Antes:

'<td><a class="teste detalhes" data-toggle="modal" data-target="#detalhes" data-denominacao="{{$resultado->nomePropriedade}}" style="color: #00628d;" href="#"><span class="glyphicon glyphicon-list" aria-hidden="true" title="Detalhes"></span></a></td>'

Depois:

'<td><a class="teste detalhes" data-toggle="modal" data-target="#detalhes" data-denominacao="'.$resultado->nomePropriedade.'" style="color: #00628d;" href="#"><span class="glyphicon glyphicon-list" aria-hidden="true" title="Detalhes"></span></a></td>'

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .