Modal Bootstrap no Laravel

Asked

Viewed 1,665 times

0

I’m having problems with a modal, when I make a request via ajax to pick up the content of my route the modal opens the entire content in json, but I can’t format this content

My View

       @extends('layout.admin.app')

    @section('content')
    <script>
    $(document).ready(function(){       
        $('.botao').on('click', function(){
            valor = $(this).attr('data-id');
            //alert(valor);
            $.ajax({
                url:"/admin/aluno/detalhe/"+valor,
                success:function(data){
                      //alert(data.nome);
                      $('#myModal .modal-content').html(data.nome);

                  },
                  error:function(msg){
                      console.log(msg);
                  }
            });
        });

    });
    </script>
    <hr>
    <div class="col-md-12">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <h1>Alunos</h1>
            </div>
            <div class="panel-body">
                <div class="row-fluid">
                    <div class="form-inline">
                        {!! Form::open(['route' => 'admin.aluno.pesquisar', 'method' => 'GET' ]) !!}
                            {!! Form::label('nome', 'Nome Completo', ['class' => 'label-control']) !!}
                            {!! Form::text('nome', null, ['class' => 'form-control']) !!}
                            {!! Form::label('ra', 'R.A', ['class' => 'label-control']) !!}
                            {!! Form::text('ra', null, ['class' => 'form-control']) !!}
                            {!! Form::submit('Pesquisar', ['class' => 'btn btn-default']) !!}
                        {!! Form::close() !!}
                    </div>
                </div>
                <hr>
                <table class="table table-striped table-bordered text-center">
                    <tr>
                        <th>Id</th>
                        <th>Nome</th>
                        <th>R.A</th>
                        <th>Endereço</th>
                        <th>Idade</th>
                        <th>Sala</th>
                        <th>Ações</th>
                    </tr>
                    @forelse($alunos as $aluno)
                    <tr>
                        <td>{{ $aluno->id }}</td>
                        <td>{{ $aluno->nome }}</td>
                        <td>{{ $aluno->ra }}</td>
                        <td>{{ $aluno->endereco }}</td>
                        <td>{{ $aluno->idade($aluno->data_nascimento) }}</td>
                        <td>{{ $aluno->sala->nome }}</td>
                        <td>
                            <a href="{{ route('admin.aluno.editar', $aluno->id) }}" class="btn btn-warning">Editar</a>
                            <a href="" class="btn btn-danger">Deletar</a>
                            <a href="{{ route('admin.aluno.detalhe', $aluno->id) }}" data-id="{{ $aluno->id }}" class="botao"data-toggle="modal" data-target="#myModal">vear</a>
                        </td>
                    </tr>
                    @empty
                        <tr>
                            <td colspan="7"><p>Não há nenhum aluno cadastrado</p></td>
                        </tr>
                    @endforelse
                </table>
            </div>
            <div class="panel-footer">
                <a href="{{ route('admin.aluno.adicionar') }}" class="btn btn-success">Novo Aluno</a>
            </div>
        </div>
    </div>



    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" 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">Modal title</h4>
          </div>
          <div class="modal-body">
            ...
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
          </div>
        </div>
      </div>
    </div>


    @endsection
]

My controller

<?php

namespace App\Http\Controllers\Admin;

use Illuminate\Http\Request;
use App\Http\Controllers\Controller;

use App\Models\Aluno;
use App\Models\Sala;

class AlunoController extends Controller
{
    public function index()
    {
        $alunos = Aluno::all();
        return view('admin.aluno.index', compact('alunos'));
    }

    public function detalhe($id)
    {
        $aluno = Aluno::find($id);
        return response()->json($aluno);
    }
  • Try to use that: var response = $.parseJSON(data); and then call out the name response.nome

  • Unfortunately not yet solved. keeps appearing messy.

  • Hello tries this in its ajax function: $.ajax({ url: '/admin/student/detail/'+value, dataType: 'json',

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.