Spring Security Binding Result always false - spring

so.. I have a registration page and there are a lot of validations in there but my binding result is always false. After a few tries I found the problem but I don't know the solution. When I pass a parameter in the /processRegistrationForm method it doesn't work but when I delete the #RequestParam it works. Why the passed parameter is influencing the binding result and how can I resolve this?
registration-form.html
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Register New User Form</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Reference Bootstrap files -->
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.error {color:red}
</style>
</head>
<body>
<div>
<div id="loginbox" style="margin-top: 50px;"
class="mainbox col-md-3 col-md-offset-2 col-sm-6 col-sm-offset-2">
<div class="panel panel-primary">
<div class="panel-heading">
<div class="panel-title">Register New User</div>
</div>
<div style="padding-top: 30px" class="panel-body">
<!-- Registration Form -->
<form th:action="#{/processRegistrationForm(flag=${flag})}"
th:object="${crmUser}" method="POST"
class="form-horizontal">
<!-- Place for messages: error, alert etc ... -->
<div class="form-group">
<div class="col-xs-15">
<div>
<!-- Check for registration error -->
<div th:if="${registrationError}" class="alert alert-danger col-xs-offset-1 col-xs-10">
<span th:text="${registrationError}"></span>
</div>
</div>
</div>
</div>
<!-- User name -->
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input type="text" th:field="*{userName}" placeholder="username (*)" class="form-control" />
</div>
<div th:if="${#fields.hasErrors('userName')}"
style="margin-bottom: 25px" class="text-danger">
<ul>
<li th:each="err : ${#fields.errors('userName')}" th:text="'User name ' + ${err}" />
</ul>
</div>
<!-- Password -->
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
<input type="password" th:field="*{password}" placeholder="password (*)" class="form-control" th:errorclass="fieldError" />
</div>
<div th:if="${#fields.hasErrors('password')}"
style="margin-bottom: 25px" class="text-danger">
<ul>
<li th:each="err : ${#fields.errors('password')}" th:text="'Password ' + ${err}" />
</ul>
</div>
<!-- Confirm Password -->
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
<input type="password" th:field="*{matchingPassword}" placeholder="confirm password (*)" class="form-control" th:errorclass="fieldError" />
</div>
<div th:if="${#fields.hasErrors('matchingPassword')}"
style="margin-bottom: 25px" class="text-danger">
<ul>
<li th:each="err : ${#fields.errors('matchingPassword')}" th:text="'Password ' + ${err}" />
</ul>
</div>
<!-- First name -->
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input type="text" th:field="*{firstName}" placeholder="first name (*)" class="form-control" th:errorclass="fieldError" />
</div>
<div th:if="${#fields.hasErrors('firstName')}"
style="margin-bottom: 25px" class="text-danger">
<ul>
<li th:each="err : ${#fields.errors('firstName')}" th:text="'First name ' + ${err}" />
</ul>
</div>
<!-- Last name -->
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input type="text" th:field="*{lastName}" placeholder="last name (*)" class="form-control" th:errorclass="fieldError" />
</div>
<div th:if="${#fields.hasErrors('lastName')}"
style="margin-bottom: 25px" class="text-danger">
<ul>
<li th:each="err : ${#fields.errors('lastName')}" th:text="'Last name ' + ${err}" />
</ul>
</div>
<!-- Email -->
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input type="text" th:field="*{email}" placeholder="email (*)" class="form-control" th:errorclass="fieldError" />
</div>
<div th:if="${#fields.hasErrors('email')}"
style="margin-bottom: 25px" class="text-danger">
<ul>
<li th:each="err : ${#fields.errors('email')}" th:text="'Email ' + ${err}" />
</ul>
</div>
<!-- Register Button -->
<div style="margin-top: 10px" class="form-group">
<div class="col-sm-6 controls">
<button type="submit" class="btn btn-primary">Register</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</body>
</html>
controller:
#PostMapping("/processRegistrationForm")
public String processRegistrationForm(
#Valid #ModelAttribute("crmUser") CrmUser theCrmUser,#RequestParam(name="flag") Integer flag,
Model theModel,BindingResult theBindingResult) {
String userName = theCrmUser.getUserName();
// form validation
if (theBindingResult.hasErrors()){
return "registration-form";
}
// check the database if user already exists
User existing = userService.findByUserName(userName);
if (existing != null){
theModel.addAttribute("crmUser", new CrmUser());
theModel.addAttribute("registrationError", "User name already exists.");
return "registration-form";
}
// create user account
userService.save(theCrmUser);
if(flag==0)
return "redirect:/user";
else return "redirect:/list";
}
The problems are here:
/register-form:
<!-- Registration Form -->
<form th:action="#{/processRegistrationForm(flag=${flag})}"
th:object="${crmUser}" method="POST"
class="form-horizontal">
/processRegisterForm:
PostMapping("/processRegistrationForm")
public String processRegistrationForm(
#Valid #ModelAttribute("crmUser") CrmUser theCrmUser,#RequestParam(value = "flag",required = false) Integer flag,
BindingResult theBindingResult,
Model theModel) {...

Related

Method not supporting error:405 in SpringBoot application

I am new to SpringBoot thymeleaf , I simple just make a registration
page ,but when I fill the registration details and hit the register
button in my registration page it throw below error
SignUpPage.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<link rel="stylesheet" th:href="#{/../css/SignUp.css}">
<title>SIGN UP</title>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script crossorigin="anonymous" src="https://kit.fontawesome.com/16e8cf656f.js"></script>
<script type="text/javascript" th:src="#{/js/SignUp.js}"></script>
</head>
<body>
<div class="container">
<div class="row py-5 mt-4 align-items-center">
<!-- For Demo Purpose -->
<div class="col-md-5 pr-lg-5 mb-5 mb-md-0">
<img src="https://bootstrapious.com/i/snippets/sn-registeration/illustration.svg" alt="" class="img-fluid mb-3 d-none d-md-block">
<h1>Create an Account</h1>
<p class="font-italic text-muted mb-0">Create an account to enjoy some services freely.</p>
</p>
</div>
<!-- Registeration Form -->
<div class="col-md-7 col-lg-6 ml-auto">
<form action="#" th:action="#{/saveUser}" th:object="${player}">
<div class="row">
<!-- First Name -->
<div class="input-group col-lg-6 mb-4">
<div class="input-group-prepend">
<span class="input-group-text bg-white px-4 border-md border-right-0">
<i class="fa fa-user text-muted"></i>
</span>
</div>
<label for="firstName"></label><input id="firstName" type="text" th:field="*{firstName}" name="firstname" placeholder="First Name" class="form-control bg-white border-left-0 border-md">
</div>
<!-- Last Name -->
<div class="input-group col-lg-6 mb-4">
<div class="input-group-prepend">
<span class="input-group-text bg-white px-4 border-md border-right-0">
<i class="fa fa-user text-muted"></i>
</span>
</div>
<label for="lastName"></label><input id="lastName" type="text" name="lastname" th:field="*{lastName}" placeholder="Last Name" class="form-control bg-white border-left-0 border-md">
</div>
<!-- Phone Number -->
<div class="input-group col-lg-12 mb-4">
<div class="input-group-prepend">
<span class="input-group-text bg-white px-4 border-md border-right-0">
<i class="fa fa-phone-square text-muted"></i>
</span>
</div>
<label for="countryCode"></label><select id="countryCode" name="countryCode" style="max-width: 80px" class="custom-select form-control bg-white border-left-0 border-md h-100 font-weight-bold text-muted">
<option value="">+91</option>
<option value="">+972</option>
<option value="">+353</option>
<option value="">+39</option>
<option value="">+254</option>
<option value="">+852</option>
<option value="">+49</option>
</select>
<label for="phoneNumber"></label><input id="phoneNumber" type="tel" name="phone" th:field="*{phoneNumber}" placeholder="Phone Number" class="form-control bg-white border-md border-left-0 pl-3">
</div>.
<!-- Email Address -->
<div class="input-group col-lg-12 mb-4">
<div class="input-group-prepend">
<span class="input-group-text bg-white px-4 border-md border-right-0">
<i class="fa fa-envelope text-muted"></i>
</span>
</div>
<label for="email"></label><input id="email" type="email" name="email" th:field="*{email}" placeholder="Email Address" class="form-control bg-white border-left-0 border-md">
</div>
<!-- Password -->
<div class="input-group col-lg-6 mb-4">
<div class="input-group-prepend">
<span class="input-group-text bg-white px-4 border-md border-right-0">
<i class="fa fa-lock text-muted"></i>
</span>
</div>
<label for="password"></label><input id="password" type="password" name="password" th:field="*{password}" placeholder="Password" class="form-control bg-white border-left-0 border-md">
</div>
<!-- Submit Button -->
<div class="d-flex justify-content-center mx-4 mb-3 mb-lg-4">
<input class="btn btn-primary btn-lg" type="submit" value="Create Account" />
</div>
<!-- Divider Text -->
<div class="form-group col-lg-12 mx-auto d-flex align-items-center my-4">
<div class="border-bottom w-100 ml-5"></div>
<span class="px-2 small text-muted font-weight-bold text-muted">OR</span>
<div class="border-bottom w-100 mr-5"></div>
</div>
<!-- Social Login -->
<div class="form-group col-lg-12 mx-auto">
<a href="#" class="btn btn-primary btn-block py-2 btn-facebook">
<i class="fa fa-facebook-f mr-2"></i>
<span class="font-weight-bold">Continue with Facebook</span>
</a>
<a href="#" class="btn btn-primary btn-block py-2 btn-twitter">
<i class="fa fa-twitter mr-2"></i>
<span class="font-weight-bold">Continue with Twitter</span>
</a>
</div>
<!-- Already Registered -->
<div class="text-center w-100">
<p class="text-muted font-weight-bold">Already Registered? <a th:href="#{/login}" href="#" class="text-primary ml-2">Login</a></p>
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Controller class
package com.nilmani.herokudemoapplication.controller
import com.nilmani.herokudemoapplication.entity.Player
import com.nilmani.herokudemoapplication.repository.PlayerRepository
import org.springframework.beans.factory.annotation.Autowired
import org.springframework.stereotype.Controller
import org.springframework.ui.Model
import org.springframework.web.bind.annotation.*
#Controller
class PlayerController {
#Autowired
private lateinit var playerRepository: PlayerRepository
#GetMapping("/getSignUp")
fun getRegistrationPage(model: Model,player: Player):String{
model.addAttribute("player",Player())
return "SIgnUpPage"
}
/**end point to register the user*/
#PostMapping("/saveUser")
fun registerUser(#ModelAttribute("player")player: Player,model: Model):String{
model.addAttribute("player",Player())
playerRepository.save(player)
return "successPage"
}
}
what is the reason for getting this type of issue
I know error 405 means it not supporting the function,But I define
everything properly ,why my code is not working I do not understand. I
am not able to find my mistakes.
The "/saveUser" endpoint has method POST. The same needs to be reflected in the form element in SignUpPage.html.
<form action="#" th:action="#{/saveUser}" th:object="${player}" th:method="POST">
For more help refer to https://spring.io/guides/gs/handling-form-submission/
Use th:method="POST" while submitting the form to the controller

Why is blade file not show anything although code are correct in laravel 8

I installed Laravel 8 and set up a blade file.
I moved resources folders css, js, and bootstrap files to public folder and loaded from blade file.
This is master.blade.php
<!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="{{asset('css/app.css')}}" rel="stylesheet" type="text/css"/>
<script src="{{asset('js/app.js')}}"><script/>
<script src="{{asset('js/bootstrap.js')}}"><script/>
</head>
<body>
#yield('content')
</body>
</html>
This is welcome.blade.php
#extends('layouts.master')
#section('content')
<div id="loginbox" style="margin-top:50px;" class="mainbox col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
<div class="panel panel-info" >
<div class="panel-heading">
<div class="panel-title">Sign In</div>
<div style="float:right; font-size: 80%; position: relative; top:-10px">Forgot password?</div>
</div>
<div style="padding-top:30px" class="panel-body" >
<div style="display:none" id="login-alert" class="alert alert-danger col-sm-12"></div>
<form id="loginform" class="form-horizontal" role="form">
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input id="login-username" type="text" class="form-control" name="username" value="" placeholder="username or email">
</div>
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
<input id="login-password" type="password" class="form-control" name="password" placeholder="password">
</div>
<div class="input-group">
<div class="checkbox">
<label>
<input id="login-remember" type="checkbox" name="remember" value="1"> Remember me
</label>
</div>
</div>
<div style="margin-top:10px" class="form-group">
<!-- Button -->
<div class="col-sm-12 controls">
<a id="btn-login" href="#" class="btn btn-success">Login </a>
<a id="btn-fblogin" href="#" class="btn btn-primary">Login with Facebook</a>
</div>
</div>
<div class="form-group">
<div class="col-md-12 control">
<div style="border-top: 1px solid#888; padding-top:15px; font-size:85%" >
Don't have an account!
<a href="#" onClick="$('#loginbox').hide(); $('#signupbox').show()">
Sign Up Here
</a>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div id="signupbox" style="display:none; margin-top:50px" class="mainbox col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
<div class="panel panel-info">
<div class="panel-heading">
<div class="panel-title">Sign Up</div>
<div style="float:right; font-size: 85%; position: relative; top:-10px"><a id="signinlink" href="#" onclick="$('#signupbox').hide(); $('#loginbox').show()">Sign In</a></div>
</div>
<div class="panel-body" >
<form id="signupform" class="form-horizontal" role="form">
<div id="signupalert" style="display:none" class="alert alert-danger">
<p>Error:</p>
<span></span>
</div>
<div class="form-group">
<label for="email" class="col-md-3 control-label">Email</label>
<div class="col-md-9">
<input type="text" class="form-control" name="email" placeholder="Email Address">
</div>
</div>
<div class="form-group">
<label for="firstname" class="col-md-3 control-label">First Name</label>
<div class="col-md-9">
<input type="text" class="form-control" name="firstname" placeholder="First Name">
</div>
</div>
<div class="form-group">
<label for="lastname" class="col-md-3 control-label">Last Name</label>
<div class="col-md-9">
<input type="text" class="form-control" name="lastname" placeholder="Last Name">
</div>
</div>
<div class="form-group">
<label for="password" class="col-md-3 control-label">Password</label>
<div class="col-md-9">
<input type="password" class="form-control" name="passwd" placeholder="Password">
</div>
</div>
<div class="form-group">
<label for="icode" class="col-md-3 control-label">Invitation Code</label>
<div class="col-md-9">
<input type="text" class="form-control" name="icode" placeholder="">
</div>
</div>
<div class="form-group">
<!-- Button -->
<div class="col-md-offset-3 col-md-9">
<button id="btn-signup" type="button" class="btn btn-info"><i class="icon-hand-right"></i> &nbsp Sign Up</button>
<span style="margin-left:8px;">or</span>
</div>
</div>
<div style="border-top: 1px solid #999; padding-top:20px" class="form-group">
<div class="col-md-offset-3 col-md-9">
<button id="btn-fbsignup" type="button" class="btn btn-primary"><i class="icon-facebook"></i>   Sign Up with Facebook</button>
</div>
</div>
</form>
</div>
</div>
</div>
#endsection
route is default
Route::get('/', function () {
return view('welcome');
});
Console is not showing any errors and view is not showing anything.
Although the blade files are coded correctly, it is not working
when I remove asset files from , it show view .
So what wrong in asset file
Can someone explain this to me?

Displaying photo after uploaded Using Ajax - Laravel

I need a help please
My question is : How can I display image after uploaded it in the same Page
I'm trying a lot of code , but nothing is worked for me
Here is blade code
<form action="{{ route('admin.user.store') }}" method="post" class="form-horizontal"
enctype="multipart/form-data" id ="upload_form">
#csrf
<div class="row justify-content-center">
<div class="col-xl-9">
<!--begin::Wizard Step 1-->
<div class="my-5 step" data-wizard-type="step-content" data-wizard-state="current">
<h5 class="text-dark font-weight-bold mb-10">User's Profile Details:</h5>
<!--begin::Group-->
<div class="form-group row">
<label class="col-xl-3 col-lg-3 col-form-label text-left">Avatar</label>
<div class="col-lg-9 col-xl-9">
<div class="image-input image-input-outline" id="kt_user_add_avatar">
<div class="image-input-wrapper" >
<img src="{{asset('assets/media/users/100_6.jpg')}}" width="120" height="120">
</div>
<label class="btn btn-xs btn-icon btn-circle btn-white btn-hover-text-primary btn-shadow" data-action="change" data-toggle="tooltip" title="" data-original-title="Change avatar">
<i class="fa fa-pen icon-sm text-muted"></i>
<input id="avatar" type="file" name="avatar" accept=".png, .jpg, .jpeg" />
</label>
<span class="btn btn-xs btn-icon btn-circle btn-white btn-hover-text-primary btn-shadow" data-action="cancel" data-toggle="tooltip" title="Cancel avatar">
<i class="ki ki-bold-close icon-xs text-muted"></i>
</span>
</div>
</div>
</div>
<!--end::Group-->
<div class="form-actions">
<div class="row">
<div class="col-md-offset-3 col-md-9">
<button type="submit" class="btn" style="background-color:#3699FF">Submit</button>
Cancel
</div>
</div>
</div>
</div>
</div>
</form>
Try this: (For Preview)
<script type="text/javascript">
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
</script>
<input id="avatar" type="file" name="avatar" accept=".png, .jpg, .jpeg" onchange="readURL(this);" />
<img id="blah" src="#" alt="your image" />

Fill a table in JSP with list provided from spring controller

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" %>

bootstrap-vue not passing array in checkbox

I'm using bootstrap-vue in my laravel project to pass data from the view to the database with checkboxes (b-form-checkbox), i want to select from the permissions passed from the database and assign it to a role, which means a role can have more than one permission, unfortunately the data is not persisting to the database as an array because if i select more than one in the checkbox it only shows the first one clicked. Please i need help as i have spent too much time on this issue. This is my code:
edit.blade.php
#extends('layouts.master')
#section('content')
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Admin
<small>Edit</small>
</h1>
<ol class="breadcrumb">
<li><i class="fa fa-dashboard"></i> Home</li>
<li>Role</li>
<li class="active">Edit</li>
</ol>
</section>
<!-- Main content -->
<section class="content">
#include('layouts.partials.message')
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box-header with-border">
<h3 class="boxtitle">Edit Role</h3>
</div>
<!-- /.box-header -->
<div class="box-body">
<form action="{{ route('role.update', ['id' => $role->id]) }}" enctype="multipart/form-data" method="post" accept-charset="utf-8">
{{csrf_field()}}
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="display_name" value="{{ old('display_name', $role->display_name) }}" class="form-control" placeholder="Name (Human Readable)" required>
<span class="help-block text-red">
#if($errors->has('display_name'))
{{ $errors->first('display_name')}}
#endif
</span>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="name" value="{{ old('name', $role->name) }}" class="form-control" placeholder="Slug (can not be edited)" disabled>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="description" value="{{ old('description', $role->description) }}" class="form-control" placeholder="Role Description">
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<h2>Permissions:</h2>
<b-form-group>
<b-form-checkbox-group v-model="permissionsSelected">
#foreach ($permissions as $permission)
<div class="form-group">
<b-form-checkbox id="permissions" name="permissions" value="{{ $permission->id }}">
<div class="form-group">
{{ $permission->display_name }} <em> ({{ $permission->description }})</em>
</div>
</b-form-checkbox>
</div>
#endforeach
</div>
</div>
<hr>
<div class="row">
<div class="col-md-1">
<div class="form-group">
<button class="btn btn-primary" type="submit" id="submit">
<i class="fa fa-check"></i> Submit
</button>
<input type="hidden" name="_token" value="{{ csrf_token() }}">
</div>
</div>
<div class="col-md-11">
<div class="form-group">
<div class="checkbox">
<label>
<input name="redirect" type="checkbox" checked> Redirect to role list after submission
</label>
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
</form>
</div>
</div>
</div>
</div>
</section>
#endsection
#section('vue')
<script>
var app = new Vue ({
el: '#app',
data: {
permissionsSelected: {!!$role->permissions->pluck('id')!!}
}
});
</script>
#endsection

Resources