Hello I'm using Datatables on my laravel App from https://datatables.yajrabox.com/eloquent/add-edit-remove-column
In my code, I've got the edit buttons under the Action column to serve as data toggles for a modal which holds a form. Now I'm trying to populate the modal with data from the table row with the currently clicked edit button. What would be the best way to go about this. I've tried several ways to no avail, including trying to use jquery to get the values of the sibling elements and put them into respective input fields in the modal form. I've also tried calling a method in my controller to find the relevant user and return it to the view, before returning the markup for the edit button. All to no avail.below is my code, what would be the best way to go about this?
Kind regards
my view:
@extends('layouts.master')
<?php
echo $_GET['edit-2'];
?>
@section('content')
<table class="table table-bordered" id="users-table">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Email</th>
<th>Created At</th>
<th>Updated At</th>
<th>Action</th>
</tr>
</thead>
</table>
<!-- 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">×</span></button>
<h4 class="modal-title" id="myModalLabel">New Student</h4>
</div>
<div class="modal-body">
<form class="form-horizontal" role="form" method="POST" action="/createStudent">
{{ csrf_field() }}
<div class="form-group{{ $errors->has('name') ? ' has-error' : '' }}">
<label for="name" class="col-md-4 control-label">FullName</label>
<div class="col-md-6">
<input id="name" type="text" class="form-control" name="name" value="" required autofocus> @if ($errors->has('name'))
<span class="help-block">
<strong>{{ $errors->first('name') }}</strong>
</span> @endif
</div>
</div>
<div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
<label for="email" class="col-md-4 control-label">E-Mail Address</label>
<div class="col-md-6">
<input id="email" type="email" class="form-control" name="email" value="{{ old('email') }}" required> @if ($errors->has('email'))
<span class="help-block">
<strong>{{ $errors->first('email') }}</strong>
</span> @endif
</div>
</div>
<div class="form-group{{ $errors->has('phone') ? ' has-error' : '' }}">
<label for="phone" class="col-md-4 control-label">Phone Number</label>
<div class="col-md-6">
<input id="phone" type="text" class="form-control" name="phone" required> @if ($errors->has('phone'))
<span class="help-block">
<strong>{{ $errors->first('phone') }}</strong>
</span> @endif
</div>
</div>
<div class="form-group">
<label for="DOB" class="col-md-4 control-label">Date of Birth</label>
<div class="col-md-6">
<input id="DOB" type="date" class="form-control" name="DOB" required>
</div>
</div>
<fieldset class="offset-4">
<div class="form-group">
<label class="col-xs-3 control-label">Gender</label>
<div class="col-xs-9">
<div class="radio">
<label>
<input id="inlineradio1" name="gender" value="male" type="radio">
Male</label>
</div>
<div class="radio">
<label>
<input id="inlineradio1" name="gender" value="female" type="radio">
Female</label>
</div>
</div>
</div>
</fieldset>
<div class="form-group{{ $errors->has('phone') ? ' has-error' : '' }}">
<label for="qualification" class="col-md-4 control-label">Qualification</label>
<div class="col-md-6">
<input id="qualification" type="text" class="form-control" name="qualification" required> @if ($errors->has('qualification'))
<span class="help-block">
<strong>{{ $errors->first('qualification') }}</strong>
</span> @endif
</div>
</div>
<div class="form-group{{ $errors->has('course') ? ' has-error' : '' }}">
<label for="Course" class="col-md-4 control-label">Course</label>
<div class="col-md-6">
<input id="course" type="text" class="form-control" name="course" required> @if ($errors->has('phone'))
<span class="help-block">
<strong>{{ $errors->first('course') }}</strong>
</span> @endif
</div>
</div>
<div class="form-group{{ $errors->has('amount') ? ' has-error' : '' }}">
<label for="amount" class="col-md-4 control-label">Amount Paid</label>
<div class="col-md-6">
<input id="amount" type="number" class="form-control" name="amount" required> @if ($errors->has('amount'))
<span class="help-block">
<strong>{{ $errors->first('amount') }}</strong>
</span> @endif
</div>
</div>
<div class="form-group">
<div class="col-md-6 col-md-offset-4">
<button type="submit" class="btn btn-primary">
Register
</button>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
@stop @push('scripts')
<script>
$(function() {
$('#users-table').DataTable({
processing: true,
serverSide: true,
ajax: '{!! route('
datatables.data ') !!}',
columns: [{
data: 'id',
name: 'id'
},
{
data: 'name',
name: 'name'
},
{
data: 'email',
name: 'email'
},
{
data: 'created_at',
name: 'created_at'
},
{
data: 'updated_at',
name: 'updated_at'
},
{
data: 'action',
name: 'action',
orderable: false,
searchable: false
}
]
});
});
</script>
@endpushmy controller method:
public function getAddEditRemoveColumnData() {
$users = User::select(['id', 'name', 'email', 'password', 'created_at', 'updated_at']);
return Datatables:: of ($users) ->
addColumn('action', function($user) {
//DatatablesController::current_user($user);
//User::current_user($user->id);
return '<a href="#edit-'.$user - > id.
'" class="btn btn-xs btn-primary" data-toggle="modal" data-target="#myModal"><i class="glyphicon glyphicon-edit"></i> Edit</a>';
}) ->
editColumn('id', 'ID: {{$id}}') ->
removeColumn('password') ->
make(true);
}
