CODEWITHSUNDEEP
phplaravel
Chandhru Sekar
Chandhru Sekar

Reputation: 318

Send Data Ajax to Controller and assign to modal box [laravel]

<script type="text/javascript">$('#myModal').on('show.bs.modal', function(e) {  var csrf = '<?php echo csrf_token() ?>';
var $modal = $(this),
    Id = e.relatedTarget.id;
    var url= 'showmodal';
    $.ajax({
        cache: false,
        type: 'post',
        url: url,
        data:  { 'EID': Id,'_token': csrf },
        success: function(data) {
            alert(data);
            $modal.find('.modal-body').html(data);
        }
    });
});</script>

controller method

public function showmodal()
{
    $EID = $_POST['EID'];
    $stud_details= Student::find($EID);
    //return $stud_details; 
    return view('student.index',compact('stud_details'));
}

Route

Route::get('showmodal', 'StudentController@showmodal'); Route::post('showmodal', 'StudentController@showmodal');

view

<a href="javascript:void(0)" id="{{ $student->id }}" data-toggle="modal" data-target="#myModal"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
         <!-- 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">Student Details</h4>
          </div>
          <div class="modal-body">
          @if ($stud_details!= '')
                <table class="table table-bordered">
                    <tr><td>{{ Form::label('name', 'Name:') }}</td><td>{{ $stud_details->name}}</td></tr>
                    <tr><td>{{ Form::label('rollno', 'RollNo:') }}</td><td>{{ $stud_details->rollno}}</td></tr>
                    <tr><td>{{ Form::label('dept', 'Department:') }}</td><td>{{ $stud_details->department}}</td></tr>
                    <tr><td>{{ Form::label('course', 'Course:') }}</td><td>{{ $stud_details->course}}</td></tr>
                </table>
          @endif 
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          </div>
        </div>
      </div>
    </div>

i need to show the modal box with student details.but ajax post is not working.i am already return student array from index method so if i am return stud_details array it displays student is undefined.. i dont know..

Upvotes: 1

Views: 2414

Answers (2)

Saran
Saran

Reputation: 41

blade page use this meta code and make ajax request 

<meta name="csrf-token" content="{{ csrf_token() }}">

Ajax 

$.ajaxSetup({

 headers: {
 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}         
});
$.ajax({
    cache: false,
    type: 'post',
    url: url,
    data:  { 'EID': Id},
    success: function(data) {
        alert(data);
        $modal.find('name').html(data['name']);
        $modal.find('rollno').html(data['email']);
          ........
    }

if you using ajax request to controller don't use return view so change

return view

to

return json_encode('stud_details')

controller i made some changes pls refer 

public function showmodal(){
$EID = $_POST['EID'];
$stud_details= Student::find($EID);
//return $stud_details; 
return json_encode('stud_details');}

Upvotes: 1

Onix
Onix

Reputation: 2179

you should have a different fucntion to load your view, and different one to get the data..

to retrieve your student do this:

Route:

Route::get('showmodal', 'StudentController@getStudent');

StudentController

public function getStudent()
{
    $EID = $_POST['EID'];
    $stud_details= Student::find($EID);
    return $stud_details;   //just return the value not the View
}

AJAX

$.ajax({
    cache: false,
    type: 'get',
    url: url,
    data:  { 'EID': Id,'_token': csrf },
    success: function(data) {
        alert(data);
        $modal.find('name').html(data['name']);
        $modal.find('rollno').html(data['email']);
          ........
    }
});

The idea is that you send the data back to the ajax and get every field of your modal to load each value in.

Upvotes: 1

Related Questions