As indicated I have 2 tables that have similar content... the only difference is the 'watchlist has an extra 'reason field
what I'm trying to achieve is moving the selected data from 1 table to another table and adding ...
so the process is like
I need to select the row of data and click the button 'add to watchlist ' and input the 'reason' then submit the form. but after I have to click the submit button the following error occurs.. may I ask what part I miss? sorry, I'm just new in Laravel .. Really appreciate any help.
here is my controller
public function AddToWatchlist(Request $request, $id)
{
$watchlist = new watchlist();
//Select the data from visitor
$record = DB::table('visitors')
->select('firstname')
->select('lastname')
->select('email')
->select('phonenumber')
->where('id',$id)
->first();
//Insert data from visitor to watchlist
DB::table('watchlist')->insert([
'firstname' => $record->firstname,
'lastname' => $record->lastname,
'email' => $record->email,
'phonenumber' => $record->phonenumber,
'reason' => $request->reason
]);
//Delete the data from visitor after shifted
$record->delete();
$watchlist->save();
return redirect('visitor.visitorlist')>with('status','Student Image Added Successfully' );
}
my viewpage
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
#if(session('status'))
<h6 class="alert alert-success">{{ session('status') }}</h6>
#endif
<div class="card">
<div class="card-header">
<h4> Visitor List</h4>
Add Visitor
<a href="{{ url('addwatchlist') }}" class="btn btn-primary float-end" data-bs-toggle="modal" data-bs-target="#exampleModal">
Add to watchlist
</a>
</div>
<div class="card-body">
<table class="table table-borderd table-striped">
<thead>
<tr>
<th>#</th>
<th>ID</th>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
<th>Phone number</th>
</tr>
</thead>
<tbody>
#foreach($visitor as $item)
<tr>
<td><input class="form-check-input" type="checkbox" value="" id="flexCheckDefault"></td>
<td>{{ $item->id}}</td>
<td>{{ $item->firstname}}</td>
<td>{{ $item->lastname}}</td>
<td>{{ $item->email}}</td>
<td>{{ $item->phonenumber}}</td>
<!-- <td>
<form action="{{ url('delete-student/'.$item->id) }}" method="POST">
#csrf
#method('DELETE')
<button type="submit" class="btn btn-danger">Delete</button>`
</form>
</td> -->
</tr>
#endforeach
</tbody>
</table>
<!-- Modal -->
<form action="{{ url('addtowatch/'.$visitor->id) }}" method="POST">
#csrf
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<label for="reason"> Indicate the reason for adding to watchlist</label>
<input type="text" name="reason " class="form-control" name="reason">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/#popperjs/core#2.11.5/dist/umd/popper.min.js" integrity="sha384-Xe+8cL9oJa6tN/veChSP7q+mnSPaj5Bcu9mPX5F5xIGE0DVittaqT5lorf0EI7Vk" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap#5.2.0-beta1/dist/js/bootstrap.min.js" integrity="sha384-kjU+l4N0Yf4ZOJErLsIcvOU2qSb74wXpOhqTvwVx3OElZRweTnQ6d31fXEoRD1Jy" crossorigin="anonymous"></script>
</body>
</html>
my web.php code
Route::post('addtowatch/{id}', [WatchlistController::class, 'AddToWatchlist']);
update new problem
now the problem are being solve but there is no error ,on getting the property item of 'firstname'.. any idea ?
ok i got your point.
Please use the laravel comment {{-- body --}} instead of the because it is the blade template engine, not your html file.
Your mistake is that you call the modal outside your foreach loop,
so that the visitor id not found because it is the array not model.
so...
Replace your blade file code with this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
#if (session('status'))
<h6 class="alert alert-success">{{ session('status') }}</h6>
#endif
<div class="card">
<div class="card-header">
<h4> Visitor List</h4>
Add Visitor
<a href="{{ url('addwatchlist') }}" class="btn btn-primary float-end" data-bs-toggle="modal"
data-bs-target="#exampleModal">
Add to watchlist
</a>
</div>
<div class="card-body">
<table class="table table-borderd table-striped">
<thead>
<tr>
<th>#</th>
<th>ID</th>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
<th>Phone number</th>
</tr>
</thead>
<tbody>
#foreach ($visitor as $item)
<tr>
<td><input class="form-check-input" type="checkbox" value=""
id="flexCheckDefault"></td>
<td>{{ $item->id }}</td>
<td>{{ $item->firstname }}</td>
<td>{{ $item->lastname }}</td>
<td>{{ $item->email }}</td>
<td>{{ $item->phonenumber }}</td>
{{-- <td>
<form action="{{ url('delete-student/'.$item->id) }}" method="POST">
#csrf
#method('DELETE')
<button type="submit" class="btn btn-danger">Delete</button>`
</form>
</td> --}}
</tr>
<!-- Modal -->
<form action="{{ url('addtowatch/' . $item->id) }}" method="POST">
#csrf
<div class="modal fade" id="exampleModal" tabindex="-1"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title
</h5>
<button type="button" class="btn-close"
data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<label for="reason"> Indicate the reason for adding to
watchlist</label>
<input type="text" name="reason " class="form-control"
name="reason">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary"
data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save
changes</button>
</div>
</div>
</div>
</form>
#endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/#popperjs/core#2.11.5/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap#5.2.0-beta1/dist/js/bootstrap.min.js"></script>
</body>
</html>
Related
This is my Livewire Component. When I try to click a function like delete it doesn't work and doesn't give me dd(). Everything is ok I've checked several times and tried everything.
#extends('admin.layouts.layout')
#section('content')
<!-- Modal -->
<div>
<div
class="modal fade"
id="deleteModal"
tabindex="-1"
aria-labelledby="exampleModalLabel"
aria-hidden="true"
>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Catagory Delete</h5>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<form wire:submit.prevent="destroyCatagory">
<div class="modal-body">
<h6>Are You Sure YOu Want To Delete this Data?</h6>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal"
>
Close
</button>
<button type="submit" class="btn btn-primary">Yes Delete</button>
</div>
</form>
</div>
</div>
</div>
<div class="row">
#if (session()->has('message'))
<div class="alert alert-success">{{session('message')}}</div>
#endif
<div class="col-md-12">
<div class="card">
<div class="card-header">
<h4>
Catagory
<a
href="{{url('admin/catagory/create')}}"
class="float-end btn btn-primary"
>Add Catagory</a
>
</h4>
</div>
<div class="card-body">
<table class="table table-striped table-hover">
<tr>
<th>ID</th>
<th>Name</th>
<th>Status</th>
<th>Action</th>
</tr>
#forelse ($catagories as $catagory)
<tr>
<td>{{$catagory->id}}</td>
<td>{{$catagory->name}}</td>
<td>{{$catagory->status=='1'? 'Hidden':'visible'}}</td>
<td>
<a
href="{{url('admin/catagory/'.$catagory->id.'/edit')}}"
class="btn btn-success"
>
Edit</a
>
<a
wire:click="deleteCatagory({{$catagory->id}})"
class="btn btn-primary"
data-bs-toggle="modal"
data-bs-target="#deleteModal"
>Delete</a
>
</td>
</tr>
#empty #endforelse ($catagories as $catagory)
</table>
{{$catagories->links()}}
</div>
<div class="card-footer"></div>
</div>
</div>
</div>
</div>
#endsection
This is my index.blade.php for the livewire component. Everything seems to be ok in this component. I've checked everything several times and I've been stuck on this for many days, please help me.
public function deleteCatagory($id)
{
dd($id);
$this->catagory_id = $id;
}
public function destroycatagory()
{
$catagory= Catagory::find($this->catagory_id);
$path = 'uploads/catagory/'.$catagory->image;
if(File::exists($path)) {
File::delete($path);
}
$catagory->delete();
session()->flash('message','Catagory Deletd Successfully');
}
I'm trying to fill a table in a jsp with a List I put in the model from a Spring controller but the table is not being filled. This is the page:
<%# page import="cl.onvision.dte.be.utils.*" %>
<%
String order = request.getParameter("o");
String search = request.getParameter("s");
String strTitulo = "Gestor usuarios";
%>
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<title>Administrador / Inicio</title>
</head>
<body>
<!-- Header layer -->
<div class="container">
<div class="row" style="background-color: rgb(255,130,0); padding: 10px">
<div class="col-sm-3"><img src="/img/index/slogan150.png" /></div>
<div class="col-sm-4"></div>
<div class="col-sm-5 text-right text-white">
<!--a href="/login/salir">Salir</a-->
<%#include file="/views/include/bannerSesion.jsp"%>
</div>
</div>
</div>
<!-- Menu layer -->
<div class="container">
<ul class="nav nav-tabs nav-justified">
<li class="nav-item"><a class="nav-link" href="/admin/inicio">Inicio</a></li>
<li class="nav-item"><a class="nav-link" href="/admin/usuarios">Gestion Usuarios</a></li>
<li class="nav-item"><a class="nav-link" href="/admin/contrib">Gestion Contribuyentes</a></li>
<li class="nav-item"><a class="nav-link" href="/admin/alertas">Alertas</a></li>
<li class="nav-item"><a class="nav-link active" href="/admin/ciudades">Ciudades</a></li>
</ul>
</div>
<br />
<!-- Search & button upper-layer -->
<div class="container">
<div class="row">
<div class="col-sm-6">
<b>Búsqueda:</b>
<input type="text" class="input-sm" style="height:25px" id="s" value="<%= (search==null)? "": search %>"
maxlength="20" size="20" autofocus />
<input type="hidden" id="o" value="<%= (order==null)? "": order %>" />
</div>
<div class="col-sm-6 text-right">
<button data-toggle="modal" data-target="#modaladd" class="btn btn-sm btn-success">
<i class="material-icons" style="font-size:22px">person_add</i>
</button>
</div>
</div>
</div>
<div style="height:10px"></div>
<!-- Data list -->
<div class="container">
<div class="table-responsive">
<table class="table table-striped table-hover table-bordered table-condensed table-sm">
<thead>
<tr>
<th style="text-align:center">#</th>
<th style="text-align:center">Nombre usuario</th>
<th style="text-align:center">Region</th>
<th style="text-align:center">Acciones</th>
</tr>
</thead>
<tbody>
<c:forEach var="ciudad" items="${ciudades}">
<tr>
<td style="text-align:center"><c:out value="${ciudad.id}"/></td>
<td style="text-align:center"><c:out value="${ciudad.nombre}"/></td>
<td style="text-align:center"><c:out value="${ciudad.region}"/></td>
<td class="pl-5">
<a href="/admin/usuario/eliminar/${ciudad.id}/">
<button class="btn btn-sm btn-primary"><i class="material-icons"
style="font-size:16px">remove_circle</i></button>
</a>
<a href="javascript:leerDatos(${ciudad.id});">
<button class="btn btn-sm btn-warning"><i class="material-icons"
style="font-size:16px">border_color</i></button>
</a>
</td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
</div>
<a href="#" id="axls" style="display:none;" donwload>a</a>
<!-- Modal 'add user' form-->
<div class="modal" id="modaladd">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal Header -->
<div class="modal-header bg-info text-white">
<h2 class="modal-title">Agregar nuevo usuario</h2>
</div>
<!-- Modal body -->
<form method="post" action="/admin/usuario/agregar">
<div class="modal-body">
<div class="row" style="margin-bottom:10px">
<div class="col-sm-4"><label for="nom">Nombre de usuario:</label></div>
<div class="col-sm-8">
<input type="text" class="form-control input-sm" name="nomusu" id="nom" maxlength="40"
required />
</div>
</div>
<div class="row" style="margin-bottom:10px">
<div class="col-sm-4"><label for="run">RUN:</label></div>
<div class="col-sm-8">
<input type="text" class="form-control input-sm" name="runusu" id="run" maxlength="40"
required />
</div>
</div>
<div class="row" style="margin-bottom:10px">
<div class="col-sm-4"><label for="cla">Nueva clave:</label></div>
<div class="col-sm-8">
<input type="password" class="form-control input-sm" name="cla1usu" id="cla"
maxlength="20" required />
</div>
</div>
<div class="row" style="margin-bottom:10px">
<div class="col-sm-4"><label for="cla2">Repita la clave:</label></div>
<div class="col-sm-8">
<input type="password" class="form-control input-sm" name="cla2usu" id="cla2"
maxlength="20" required />
</div>
</div>
<div class="row" style="margin-bottom:10px">
<div class="col-sm-4"><label for="com">Comentarios:</label></div>
<div class="col-sm-8">
<textarea class="form-control input-sm" name="comentusu" id="com" rows="3"
cols="80"></textarea>
</div>
</div>
</div>
<!-- Modal footer -->
<div class="modal-footer">
<input type="submit" class="btn btn-success" value="Agregar nuevo usuario" />
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancelar</button>
</div>
</form>
</div>
</div>
</div>
<!-- Modal 'update user' form-->
<div class="modal" id="modalupdate">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal Header -->
<div class="modal-header bg-info text-white">
<h2 class="modal-title">Modificar usuario</h2>
</div>
<!-- Modal body -->
<form method="post" action="/admin/usuario/modificar">
<div class="modal-body">
<input type="hidden" name="uid" id="uid" value="" />
<div class="row" style="margin-bottom:10px">
<div class="col-sm-4"><label for="unom">Nombre de usuario:</label></div>
<div class="col-sm-8">
<input type="text" class="form-control input-sm" name="unomusu" id="unom" maxlength="40"
readonly />
</div>
</div>
<div class="row" style="margin-bottom:10px">
<div class="col-sm-4"><label for="urun">RUN:</label></div>
<div class="col-sm-8">
<input type="text" class="form-control input-sm" name="urunusu" id="urun" maxlength="40"
readonly />
</div>
</div>
<div class="row" style="margin-bottom:10px">
<div class="col-sm-4"><label for="ucom">Comentarios:</label></div>
<div class="col-sm-8">
<textarea class="form-control input-sm" name="ucomentusu" id="ucom" rows="3"
cols="80"></textarea>
</div>
</div>
</div>
<!-- Modal footer -->
<div class="modal-footer">
<input type="submit" class="btn btn-success" value="Modificar datos" />
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancelar</button>
</div>
</form>
</div>
</div>
</div>
</body>
<script>
function ordenarDatos(campo) {
url = 'gestionUsuarios.jsp?o=' + campo + '&s=' + $('#s').val();
document.location.href = url;
return null;
}
/*function descargarXls()
{
url1 = '${pageContext.request.contextPath}/ExtraerXlsUsuarios.do';
$.ajax( {url: url1,
success: function(result)
{
//$('#axls').attr('href', "../" + result);
location.href = "../" + result; //$('#axls').attr('href');
} });
}*/
$('#s').keypress(function (event) {
if (event.which == 13) {
document.location.href = 'gestionUsuarios.jsp?o=' + $('#o').val() + '&s=' + $('#s').val();
return null;
}
}
);
function leerDatos(id) {
$.post("/admin/usuario/ver/" + id + "/", function (obj) {
obj = JSON.parse(obj);
$('#uid').val(obj.id);
$('#unom').val(obj.nom);
$('#urun').val(obj.run);
$('#ucom').val(obj.com);
$('#modalupdate').modal('show');
obj = null;
});
}
/*$().ready( function()
{
v = $('#s').val();
$('#s').val('');
$('#s').val(v);
});*/
</script>
</html>
I'm putting the list into the model right, as you can see in the chrome developer tools:
I can't see the problem here, I need help trying to figure out why the table is not being filled.
Try including the <%#taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> athe top of your code. Also, make sure your object name ciudades is spelled as it is in your controller.
Well my problem was thwo things:
I'm using tomcat as webapp which doesn't bring JSTL embeddeb. So I had to add the dependency in the pom.xml.The version is important if you want to use EL's.
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
I had to add the taglib on top of the JSP to access the <c:> tags. Thanks to #Morteza Bandi for the heads up.
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
I made a website with Laravel. For design of web site I use Bootstrap. In on my page I needed modal component. Now I deployed my web site on server link on website and I was testing website with my iPhone. When I tested modal I get only grey background without modal. I also tested on PC and Android mobile phone and work fine. I try on Edge, Safari and Chrome on iPhone but I always get the same result.
Here is my code:
#extends('layouts.frontend')
#section('title', 'TK Pazin | Rang-liste Piramida')
#section('content')
<!-- Page Content -->
<div class="container">
<!-- Page Heading -->
<h1 class="my-4" style="text-align:center; color: #ba3631;">Rang-lista | Piramida {{ $sezona->godina }}</h1>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
#foreach($sezone as $sezona)
#if($sezona->id == session('odabrana_godina'))
<li class="breadcrumb-item active" aria-current="page">{{ $sezona->godina }}</li>
#else
<li class="breadcrumb-item">{{ $sezona->godina }}</li>
#endif
#endforeach
</ol>
</nav>
<div>
<div class="media mb-5">
<div class="mr-3"><a href="../datoteke/Pravila-Pojedinačni-turniri.pdf" target="_blank"><i
class="far fa-file-pdf fa-3x"></i></a></div>
<div class="media-body mt-3">
<a href="/datoteke/Pravila-Piramida.pdf" target="_blank">
<h5 class="mt-0">Pravila
natjecanja u piramidi
</h5>
</a>
</div>
</div>
</div>
<div class="table-responsive">
<table class="table table-hover">
<thead class="thead-dark">
<tr>
<th scope="col">#</th>
<th scope="col">Ime i prezime</th>
#foreach($kola as $kolo)
<th scope="col">{{ $kolo->naziv }}</th>
#endforeach
<th scope="col">Ukupno</th>
</tr>
</thead>
<tbody>
#foreach($igraci as $igrac)
#if($igrac->igrac_piramida()->whereIn('turnir_piramida_id', $kola_id)->sum('bodovi') != 0)
<tr>
<td scope="row" class="sno"> </td>
<td>
<button type="button" class="btn btn-outline-primary" data-toggle="modal" data-target="#view_{{ $igrac->id }}">{{ $igrac->ime . " " . $igrac->prezime }}</button>
<!-- Modal -->
<div class="modal fade" id="view_{{ $igrac->id }}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Natjecatelj: {{ $igrac->ime . " " . $igrac->prezime }}</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-6">
<img src="{{ $igrac->slika }}" alt="..." class="img-thumbnail">
</div>
<div class="col-6">
<b>Prebivalište: </b>
<p> {{ $igrac->prebivaliste }}</p>
<b>Igra: </b>
<p> {{ $igrac->igra }}</p>
<b>Član kluba od:</b>
<p> {{ $igrac->clanstvo }}. godine</p>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Zatvori</button>
</div>
</div>
</div>
</div>
</td>
#foreach($kola as $kolo)
#foreach($igrac->igrac_piramida as $ip)
#if($ip->pivot->turnir_piramida_id == $kolo->id)
<td>{{ $ip->pivot->bodovi }}</td>
#endif
#endforeach
#endforeach
<td>{{ $igrac->igrac_piramida()->whereIn('turnir_piramida_id', $kola_id)->sum('bodovi') }}</td>
</tr>
#endif
#endforeach
</tbody>
</table>
</div>
</div>
<!-- /.container -->
#endsection
#section('script')
<script>
$(document).ready(function(){
//use a special class name or id for the table
//using find I'm getting all tr elements in the table
//using not(':eq(0)') I'm ignoring the first tr element
//using each I'm iterating through the selected elements
$('table').find('tr').not(':eq(0)').each(function(i){
//using children('td:eq(0)') I'm getting the first td element inside the tr
$(this).children('td:eq(0)').addClass('sno').text(i+1);
});
});
</script>
#endsection
I want my modal to pop-up in a blade when the quantity of a stock item is below a specific number like 5. I have the modal but I don't know how to call/instantiate it. Help me please.
https://laracasts.com/discuss/channels/laravel/models-views-controllers There wasn't a solution in this dicussion, thats why I pleading for your assistance.
Here is my modal in index.blade.php:
<div class="modal fade" id="modal-danger">
<div class="modal-dialog">
<div class="modal-content bg-danger">
<div class="modal-header">
<h4 class="modal-title">Danger Modal</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer justify-content-between">
<button type="button" class="btn btn-outline-light" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-outline-light">Save changes</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
Here is my controller:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Sales Report</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/css/bootstrap.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.5.2/css/buttons.bootstrap4.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.2.3/css/responsive.bootstrap4.min.css">
</head>
<body>
<table id="example" class="table table-striped table-bordered dt-responsive nowrap" style="width:100%">
<caption><h3>Sales Report</h3></caption>
<thead>
<tr>
<th>Sales ID</th>
<th>Stock ID</th>
<th>Product Name</th>
<th>Sale Quantity</th>
<th>Unit Selling Price</th>
<th>Total Sales Cost</th>
<th>Sold On</th>
</tr>
</thead>
<tbody>
#foreach($sales as $key => $sale)
<tr>
<td>{{$sale->sales_id}}</td>
<td>{{$sale->stock_id}}</td>
<td>{{$sale->product_name}}</td>
<td>{{$sale->sale_quantity}}</td>
<td>{{$sale->unit_selling_price}}</td>
<td>{{$sale->total_sales_cost}}</td>
<td>{{$sale->updated_at}}</td>
</tr>
#endforeach
</tbody>
</table>
</body>
</html>
Here is screenshot of the stock table:
screenshot of the stock table
I believe you have a controller to return your view. So, just count the stock items and return it as a variable to your view, like this:
$items = Stock::count();
return view('your-view')->with([
'itemsCount' => $items,
]);
Then, in your view, do something like this:
<input type='hidden' value='{{ $itemsCount }}' id="items-count">
<script>
$(document).ready(function(){
if($("#items-count").val() < 5) {
$("#your-modal-id").modal("show");
}
});
</script>
Update
To count a specific stock;
$items = Stock::where('stock_name', $stockName)->first()->stock_quantity;
//If you want to count every single stock, just do it with a for or foreach loop
return view('your-view')->with([
'itemsCount' => $items,
]);
Hope this helps.
In My list view I have all the details of department. But when I click on details It will display me a Pop-up. In Pop up box it has to fetch and give me all the details of particular field but instead of that it always give me details of last inserted record
Here is my code of blade file
#extends('layouts.master')
#section('content')
<section>
<div class="page-wrapper">
<div class="container-fluid">
<div class="row page-titles">
<div class="col-md-5 align-self-center">
<h4 class="text-themecolor">{{__('Department')}}</h4>
</div>
</div>
<div class="card">
<div class="card-body">
<div>
+ Add Department
</div>
<div id="myModal" class="modal fade in" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">Add Department </h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<form id="myform" class="form-horizontal" method="POST" action="{{route('store_department')}}">
#csrf
<div class="form-group">
#if(Session::has('key'))
<?php $createdBy = Session::get('key')['username']; ?>
#endif
<div class="col-md-12">
<input type="hidden" name="createdBy" value="<?php echo $createdBy ?>">
<input type="text" class="form-control" name="nameOfDepartment" placeholder="Add New Department">
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-info waves-effect" data-dismiss="modal">Save</button>
<button type="button" class="btn btn-default waves-effect" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
<div class="table-responsive m-t-40">
<table class="table table-bordered table-striped ">
<thead>
<tr>
<th>Department Name</th>
<th>Created By</th>
<th>Created On</th>
<th>Action</th>
</tr>
</thead>
<tbody>
#if($listOfDepartment != null)
#foreach($listOfDepartment as $departmentList)
<tr>
<td>{{$departmentList->nameOfDepartment}}</td>
<td>{{$departmentList->createdBy}}</td>
<td>{{$departmentList->created_at}}</td>
<td>
<i class="fa fa-edit fa-lg" style="color:#0066ff" aria-hidden="true"></i>
<i class="fa fa-trash fa-lg" style="color:red" aria-hidden="true"></i>
</td>
</tr>
#endforeach
#endif
</tbody>
</table>
</div>
</div>
<div id="myEditModal" class="modal fade in" tabindex="-1" role="dialog" aria-labelledby="myModalLabelEdit" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabelEdit">Edit Department</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<form class="form-horizontal" method="POST" action="{{ route('update_department', $departmentList->id) }}">
#csrf
#method('PUT')
<div class="form-group">
<div class="col-md-12">
<input type="text" name="nameOfDepartment" class="form-control" placeholder="Edit Department" value="{{$departmentList->nameOfDepartment}}">
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-info waves-effect" data-dismiss="modal">Update</button>
<button type="button" class="btn btn-default waves-effect" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
#endsection
here is my code of department controller
<?php
namespace App\Http\Controllers;
use App\Department;
use Illuminate\Http\Request;
class DepartmentController extends Controller
{
public function createDepartment()
{
return view('pages.department');
}
public function storeDepartment(Request $request)
{
$department = new Department();
$department->createdBy = $request->get('createdBy');
$department->nameOfDepartment = $request->get('nameOfDepartment');
$department->save();
return redirect('list-department')->with('Success', 'Department Added Successfully!');
}
public function listDepartment()
{
$listOfDepartment = Department::all();
return view('pages.department', compact('listOfDepartment'));
}
public function editDepartment($id)
{
$departments = Department::find($id);
return view('pages.department', compact('departments', 'id'));
}
public function updateDepartment(Request $request, $id)
{
$department = Department::find($id);
$department->createdby = $request->get('createdBy');
$department->nameOfDepartment = $request->get('nameOfDepartment');
$department->save();
return redirect('list-department')->with('Success', 'Department Updated Successfully!');
}
public function deleteDepartment($id)
{
$department = Department::find($id);
$department->delete();
return redirect('list-department')->with('Success', 'Department Deleted SuccessFully!');
}
}
And Here Are My Routes
Route::get('add-department', 'DepartmentController#createDepartment')->name('create_department');
Route::post('store-department', 'DepartmentController#storeDepartment')->name('store_department');
Route::get('list-department', 'DepartmentController#listDepartment')->name('list_department');
Route::get('edit-department/{id}', 'DepartmentController#editDepartment')->name('edit_department');
Route::put('update-department/{id}', 'DepartmentController#updateDepartment')->name('update_department');
Route::get('delete-department/{id}', 'DepartmentController#deleteDepartment')->name('delete_department');
Your modal is always created with the last $departmentList
You are using this to create some kind of list
#foreach($listOfDepartment as $departmentList)
<tr>
<td>{{$departmentList->nameOfDepartment}}</td>
<td>{{$departmentList->createdBy}}</td>
<td>{{$departmentList->created_at}}</td>
<td>
<a href="{{route('edit_department', $departmentList->id)}}" data-toggle="modal" data-target="#myEditModal">
<i class="fa fa-edit fa-lg" style="color:#0066ff" aria-hidden="true"></i>
</a>
<a href="{{route('delete_department', $departmentList->id)}}">
<i class="fa fa-trash fa-lg" style="color:red" aria-hidden="true"></i>
</a>
</td>
</tr>
#endforeach
You end the loop here so $departmentList is the last one from the loop
Later you add some html again that uses $departmentList
<form class="form-horizontal" method="POST" action="{{ route('update_department', $departmentList->id) }}">
This variable still contains the last department from your loop before.
You can probably utilize some javascript that opens the modal and put the correct post url in place.