Spring form autocomplete="false" is not working - spring

I am trying to use autocomplete="false" in my registration form for remove autocomplete the field (UserName and Password) but it not work.
I read the attribute autocomplete from this site https://docs.spring.io/spring/docs/4.0.x/spring-framework-reference/html/spring-form.tld.html#spring-form.tld.input
This is my code and UI snapshot.
[![<form:form method="POST" action="${contextPath}/register" modelAttribute="registerForm"
class="form-signin" >
<input autocomplete="false" name="hidden" type="text" style="display:none;">
<spring:bind path="username">
<label class="label">Username</label>
<div class="form-group ${status.error ? 'has-error' : ''}">
<form:input type="text" path="username" class="form-control"
autofocus="true" autocomplete="false" />
<form:errors path="username" cssStyle="color:#ff0000;"></form:errors>
</div>
</spring:bind>
<spring:bind path="email">
<label class="label">Email</label>
<div class="form-group ${status.error ? 'has-error' : ''}">
<form:input id="email" type="email" autocomplete="1" path="email"
class="form-control" name="email"
pattern="\[a-z0-9._%+-\]+#\[a-z0-9.-\]+\.\[a-z\]{2,3}$"/>
<form:errors path="email" cssStyle="color: #ff0000;"></form:errors>
</div>
</spring:bind>
<spring:bind path="password">
<label class="label">Password</label>
<div class="form-group ${status.error ? 'has-error' : ''}">
<form:input type="password" path="password" class="form-control" autocomplete="false" id="password"></form:input>
<form:errors path="password" cssStyle="color: #ff0000;"></form:errors>
</div>
</spring:bind>
<button class="btn btn-primary auth-btn" type="submit">Submit</button>
</form:form>][1]][1]

you can use autocomplete="off"
it's supposed to solve your problems

Related

Password reset using spring through mail

I have implemented, mailing feature through which a confirmation token is send to the user and on clicking the url provided, a page opens that fills the email id of the user to which the email is sent.
Then they can reset, however when i am trying to submit the form with the new password. It is not passing the value to the function i have provided.
#PostMapping("/resetUserPassword")
public String accountPasswordReset(#Valid #ModelAttribute("updateUserPassword") ResetPassword user, BindingResult theBindingResult, Model theModel){
//this line outputs null value
System.out.println("accountPasswordReset: email="+user.getEmail());
if(user.getEmail()!=null) {
User tokenUser = userService.findByEmailIdIgnoreCase(user.getEmail());
tokenUser.setPassword(passwordEncoder.encode(user.getPassword()));
userService.save(tokenUser);
return "successPasswordReset";
}else {
return "error";
}
}
<form:form action="${pageContext.request.contextPath}/register/resetUserPassword" modelAttribute="updateUserPassword" class="form-horizontal" method="POST">
<!-- Email -->
<div class="form-group">
<label for="emailId">Email (*)</label>
<form:input path="email" id="emailId" placeholder="email (*)"
class="form-control" disabled="true" readonly="true" />
<form:errors path="email" cssClass="error" />
</div>
<!-- Password -->
<div class="form-group">
<label for="password">Password (*)</label>
<form:password path="password" id="password"
placeholder="password (*)" class="form-control" />
<form:errors path="password" cssClass="error" />
</div>
<!-- Reset Button -->
<div style="margin-top: 10px" class="form-group">
<div class="col-sm-6 controls">
<button type="submit" class="btn btn-primary">Reset</button>
</div>
</div>
</form:form>
I was missing smallest thing, in this line i just removed disabled="true" and it works
<form:input path="email" id="emailId" placeholder="email (*)" class="form-control" disabled="true" readonly="true" />
to
<form:input path="email" id="emailId" placeholder="email (*)" class="form-control" readonly="true" />

Controller function not getting called on form submit

I have created an form for submission and written a controller method to handle it in spring MVC. But the request is not reaching the controller method.Please let me know what mistake i'm making in writing the controller/form method.
Below is my code snippet which is self explanatory.
Controller method:
#RequestMapping(value="/users/login/projectUpdate",method=RequestMethod.POST)
public String updateProjectStatus( User user,Model model,Authentication
authentication,HttpServletRequest request,final RedirectAttributes
redirectAttributes) {
logger.debug("Update Project Status Data()");
String projectname=request.getParameter("projectName");
String projectStatus=request.getParameter("projectStatus");
String projectStatusDate=request.getParameter("projectStatusDate");
userService.updateProject(projectStatus,projectStatusDate,projectname);
return "users/updateProject";
}
JSP form:
<spring:url value="/users/login/projectUpdate" var="updateProjectUrl" />
<form:form method="post" modelAttribute="updateProjectForm"
action="${updateProjectUrl}" id="ProjectForm">
<label class="col-sm-2 control-label">Projects</label>
<div class="col-sm-9">
<form:select path="project" multiple="false" class="form-control" id="project1">
<form:option label="--Select--" value=""/>
<form:options items="${project}" />
</form:select>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Project Description</label>
<div class="col-sm-9">
<form:input path="projectDescription" type="text" class="form-control" id="projectDescription1" placeholder="Project Description" readonly="true"/>
</div>
</div>
<div class="form-group ${status.error ? 'has-error' : ''}">
<label class="col-sm-2 control-label">Project Start Date</label>
<div class="col-sm-9">
<form:input path="projectStartDate" type="text" class="form-control" id="projectStartDate1" placeholder="Project Start Date" readonly="true" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Current Status</label>
<div class="col-sm-9">
<form:input path="projectCurrentStatus" type="text" class="form-control" id="projectCurrentStatus" placeholder="Project Status" readonly="true"/>
</div>
</div>
<div class="form-group ${status.error ? 'has-error' : ''}">
<label class="col-sm-2 control-label">Current Status Date</label>
<div class="col-sm-9">
<form:input path="projectCurrentStatusDate" type="text" class="form-control " id="projectCurrentStatusDate" placeholder="Project Current Status Date" readonly="true"/>
</div>
</div>
<label class="col-sm-2 control-label">New Status</label>
<div class="col-sm-9">
<form:select path="projectStatus" multiple="false" class="form-control" id="projectStatus1" >
<form:option label="--Select--" value=""/>
<form:options items="${projectstatus}" />
</form:select>
</div>
<label class="col-sm-2 control-label">New Status Date</label>
<div class="col-sm-9">
<form:input path="projectStatusDate" type="date" class="form-control " id="projectStatusDate1" placeholder="Project Status Date" data-validation="date" data-validation-format="yyyy-mm-dd" />
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Project Team Members</label>
<div class="col-sm-9">
<form:input path="projectTeam" type="text" class="form-control " id="projectTeam1" placeholder="Project Team members" />
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-5 col-sm-7">
<button type="submit" class="btn btn-success">Update</button>
</div>
</div>
Please try using BindingResult like below :
public String updateProjectStatus( User user,BindingResult bindingResult,Model model,Authentication authentication,HttpServletRequest request,final RedirectAttributes redirectAttributes){
if (bindingResult.hasErrors()) {
//check your errors here
}
}
and make sure all the fields which you are passing from JSP should be present in your User class.

Access data-value in Spring controller

I am using a datalist in html as below:
<input type="text" id="eventName" list="eventname" name="eventname"
placeholder="Event category">
<datalist id="eventname">
<c:forEach var="eventName2" items="${listDropDown}">
<option data-id="${eventName2.eventId}"
value="${eventName2.eventName}">
</c:forEach>
</datalist>
I call the value from spring controller using name attribute of input field. But i get the value attribute of option tag.
#RequestMapping(value = "/searchForVenues", method = RequestMethod.POST)
public ModelAndView saveProductInfo(ModelAndView model,#RequestParam("eventname")int eventid) {
System.out.println(eventid);//some code//
}
Output is an exception :
Failed to convert value of type [java.lang.String] to required type [int];
nested exception is java.lang.NumberFormatException: For input string:
"Wedding"
Some more HTML :
<div class="col-md-10">
<form:form id="signup" action="searchForVenues"
method="post" modelAttribute="searchForVenue" >
<form:hidden path="id"></form:hidden>
<div class="col-md-3">
<div class="form-group ">
<%--
<form:select id="eventName" class="form-control
select2" style="width: 100%; -webkit-appearance: none;"
path="eventName" multiple="multiple" >
<form:option value="0" selected="selected">Select a
category</form:option>
<c:forEach var="eventName2" items="${listDropDown}">
<form:option
value="${eventName2.eventName}">${eventName2.eventName}
</form:option>
</c:forEach>
</form:select>
--%>
<input type="text" id="eventName" list="eventname"
placeholder="Event category" >
<datalist id="eventname">
<c:forEach var="eventName2"
items="${listDropDown}">
<option data-id="${eventName2.eventId}"
value="${eventName2.eventName}" >
<input type="hidden" name="eventnames"
id="eventName-hidden" value="${eventName2.eventId}">
</c:forEach>
</datalist>
<input type="hidden" name="eventnames" id="eventName-hidden" value="${eventName2.eventId}">
</div>
</div>
<div class="col-md-3">
<div class="form-group ">
<%--
<form:select id="locationName" class="form-control select2" path="locationName" multiple="multiple">
<form:option value="0" selected="selected">Select a location</form:option>
<c:forEach var="locationName" items="${dropdownForLocation}">
<form:option value="${locationName.locName}">${locationName.locName}</form:option>
</c:forEach>
</form:select>
--%>
<input type="text" id="locationName" list="location" placeholder="Location" name="locationname">
<datalist id="location">
<c:forEach var="locationName" items="${dropdownForLocation}">
<option data-id="${locationName.locId}">${locationName.locName}</option>
<input type="hidden" name="locnames" id="locationName-hidden" value="${locationName.locId}">
</c:forEach>
</datalist>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<%--
<form:select id="venueTypeName" class="form-control select2" style="width: 100%;" path="venueTypeName">
<form:option value="0" selected="selected">Select type of venue</form:option>
<c:forEach var="venueTypeName" items="${dropdownForVenueType}">
<form:option value="${venueTypeName.venueTypeName}">${venueTypeName.venueTypeName}</form:option>
</c:forEach>
</form:select>
--%>
<input type="text" id="venueTypeName" list="venueType" placeholder="Venue type" name="venuetypename"/>
<datalist id="venueType" >
<c:forEach var="venueTypeName" items="${dropdownForVenueType}">
<option data-id="${venueTypeName.venueTypeId}">${venueTypeName.venueTypeName}</option>
<input type="hidden" name="venuenames" id="venueTypeName-hidden" value="${venueTypeName.venueTypeId}">
</c:forEach>
</datalist>
</div>
</div >
<div class="col-md-1">
<input type="submit" class="btn-info" value="Find" id="findbtnn"/>
</div>
</form:form>
</div>
rendered html :
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<!-- Main content -->
<section class="content">
<!-- Default box -->
<div class="box">
<div class="box-header with-border">
<!-- //<h3 class="box-title">Title</h3>-->
<div class="box-tools pull-right">
<!-- <button type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
<i class="fa fa-minus"></i></button>
<button type="button" class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
<i class="fa fa-times"></i></button>-->
</div>
</div>
<div class="box-body">
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-10">
<form id="signup" action="searchForVenues" method="post">
<input id="id" name="id" type="hidden" value="0"/>
<div class="col-md-3">
<div class="form-group ">
<input type="text" id="eventName" list="eventname" placeholder="Event category" >
<datalist id="eventname">
<option data-id="1" value="Wedding">
<input type="hidden" name="eventnames" id="eventName-hidden" value="1">
<option data-id="2" value="Birthday">
<input type="hidden" name="eventnames" id="eventName-hidden" value="2">
<option data-id="3" value="Bouvat">
<input type="hidden" name="eventnames" id="eventName-hidden" value="3">
<option data-id="4" value="Akd">
<input type="hidden" name="eventnames" id="eventName-hidden" value="4">
<option data-id="5" value="Khatna">
<input type="hidden" name="eventnames" id="eventName-hidden" value="5">
<option data-id="6" value="Normal Party">
<input type="hidden" name="eventnames" id="eventName-hidden" value="6">
</datalist>
<input type="hidden" name="eventnames" id="eventName-hidden" value="">
</div>
</div>
<div class="col-md-3">
<div class="form-group ">
<input type="text" id="locationName" list="location" placeholder="Location" name="locationname">
<datalist id="location">
<option data-id="1">Dhanmondi</option>
<input type="hidden" name="locnames" id="locationName-hidden" value="1">
<option data-id="2">Gulshan</option>
<input type="hidden" name="locnames" id="locationName-hidden" value="2">
<option data-id="3">Shantinagar</option>
<input type="hidden" name="locnames" id="locationName-hidden" value="3">
<option data-id="4">Baridhara DOHS</option>
<input type="hidden" name="locnames" id="locationName-hidden" value="4">
<option data-id="5">Bashundhara Baridhara</option>
<input type="hidden" name="locnames" id="locationName-hidden" value="5">
<option data-id="6">Banani</option>
<input type="hidden" name="locnames" id="locationName-hidden" value="6">
<option data-id="7">Paltan</option>
<input type="hidden" name="locnames" id="locationName-hidden" value="7">
</datalist>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<input type="text" id="venueTypeName" list="venueType" placeholder="Venue type" name="venuetypename"/>
<datalist id="venueType" >
<option data-id="1">Restaurant</option>
<input type="hidden" name="venuenames" id="venueTypeName-hidden" value="1">
<option data-id="2">Convention Hall</option>
<input type="hidden" name="venuenames" id="venueTypeName-hidden" value="2">
<option data-id="3">Community Center</option>
<input type="hidden" name="venuenames" id="venueTypeName-hidden" value="3">
</datalist>
</div>
</div >
<div class="col-md-1">
<input type="submit" class="btn-info" value="Find" id="findbtnn"/>
</div>
</form>
It's juste because you initialize your selection like that:
<option data-id="${eventName2.eventId}" value="${eventName2.eventName}">
In a html form the option component return to the server what you affect to the value field. You are affecting it a string and expecting an int.
<option data-id="${eventName2.eventId}" value="${eventName2.eventId}">${eventName2.eventName}<option/>
Should do what you want.

how to use multiple hidden fields with the same name

hi i'm trying to get the rate for a product i tried this :
<div class="pro-rate">
<span class="fa fa-star" data-rate="1" ><input type="hidden" name="evaluation" id="1" value="1"></span>
<span class="fa fa-star" data-rate="2" ><input type="hidden" name="evaluation" id="2" value="2"></span>
<span class="fa fa-star" data-rate="3" ><input type="hidden" name="evaluation" id="3" value="3"></span>
<span class="fa fa-star" data-rate="4" ><input type="hidden" name="evaluation" id="4" value="4"></span>
<span class="fa fa-star" data-rate="5" ><input type="hidden" name="evaluation" id="5" value="5"></span>
but it keeps give me only the value of 5 nothing else , how can i get each value as i want not only the last one ?
and here is the full form :
<form class="form-horizontal" action="{{action('onlyController#postIndex')}}" method="POST">
{!! csrf_field() !!}
#foreach($product as $pro)
<input type="hidden" name="product_id" value="{{$pro->id}}" />
<div class="form-group">
<label for="inputName" class="col-sm-2 control-label">الاسم </label>
<div class="col-sm-10">
<input type="text" class="form-control" name="username" id="inputName" placeholder="الاسم " required>
</div>
</div>
<div class="form-group">
<label for="inputEmail" class="col-sm-2 control-label">الاميل </label>
<div class="col-sm-10">
<input type="email" class="form-control" name="email" id="inputEmail" placeholder="الاميل" required>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">نص التعليق </label>
<div class="col-sm-10">
<textarea class="form-control" rows="5" name="comment" maxlength="1000" required></textarea>
</div>
</div>
<div class="reviews">
<ul>
<li>
<label class="col-sm-2 control-label">التقييم </label>
<span>ردئ</span>
<div class="pro-rate">
<span class="fa fa-star" data-rate="1" ><input type="hidden" name="evaluation[]" id="1" value="1"></span>
<span class="fa fa-star" data-rate="2" ><input type="hidden" name="evaluation[]" id="2" value="2"></span>
<span class="fa fa-star" data-rate="3" ><input type="hidden" name="evaluation[]" id="3" value="3"></span>
<span class="fa fa-star" data-rate="4" ><input type="hidden" name="evaluation[]" id="4" value="4"></span>
<span class="fa fa-star" data-rate="5" ><input type="hidden" name="evaluation[]" id="5" value="5"></span>
</div>
<span>ممتاز</span>
</li>
</ul>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn ">ارسال </button>
</div>
</div>
#endforeach
</form>
how can i do it ?
use 'evaluation[]'
but evaluation will be an array on server
<div class="pro-rate">
<span class="fa fa-star" data-rate="1" ><input type="hidden" name="evaluation[]" id="1" value="1"></span>
<span class="fa fa-star" data-rate="2" ><input type="hidden" name="evaluation[]" id="2" value="2"></span>
<span class="fa fa-star" data-rate="3" ><input type="hidden" name="evaluation[]" id="3" value="3"></span>
<span class="fa fa-star" data-rate="4" ><input type="hidden" name="evaluation[]" id="4" value="4"></span>
<span class="fa fa-star" data-rate="5" ><input type="hidden" name="evaluation[]" id="5" value="5"></span>
$_POST['evaluation'] is going to be an array
$evaluation = $_POST['evaluation'];
foreach($evaluation as $val){
//do something with the values here
}
ok, well all seems to be working for me
<?php
if($_POST)
print_r($_POST['email']);
?>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
Name: <input type="text" name="name"><br>
E-mail: <input type="text" name="email"><br>
hidden <input type="hidden" name="email[]" value='hjdfkhds' ><br>
hidden: <input type="hidden" name="email[]" value='iufd'><br>
hidden: <input type="hidden" name="email[]" value='78642di'><br>
hidden <input type="hidden" name="email[]" value='uidynsx' ><br>
hidden <input type="hidden" name="email[]" value='qsqaaa'><br>
<input type="submit">
</form>
after I clicked submit. This is what I got

Angular form validation in IE

I'm trying to get Angular form validation working in ie8. Here is my code:
<form id="contact-form" name="cform" target="_blank" >
<div class="left">
<div>
<div class="group">
<label for="firstname">First Name <span class="asterisk">*</span></label><br />
<input type="text" name="firstname" id="firstname" data-ng-model="firstname" required />
<span class="error" data-ng-show="cform.input.$error.required">Required!</span>
</div>
<div class="group">
<label for="lastname">Last Name <span class="asterisk">*</span></label><br />
<input type="text" name="lastname" id="lastname" data-ng-model="lastname" required />
<span class="error" data-ng-show="cform.input.$error.required">Required!</span>
</div>
</div>
<div>
<div class="group">
<label for="email">Email Address <span class="asterisk">*</span></label><br />
<input type="email" id="email" name="email" data-ng-model="email" required />
<span class="error" data-ng-show="cform.email.$error.email">Required!</span>
</div>
</div>
<div>
<div class="group">
<label for="phone">Primary Phone Number <span class="asterisk">*</span></label><br />
<input type="text" name="phone" id="phone" data-ng-model="phone" required />
<span class="error" data-ng-show="cform.input.$error.required">Required!</span>
</div>
<div class="group">
<label for="-secondary-phone">Secondary Phone Number</label><br />
<input type="text" name="secondary-phone" id="secondary-phone" />
</div>
</div>
</div>
<div class="right">
<div class="group">
<label for="message">Your Message</label><br />
<textarea id="message"></textarea>
</div><br />
<input type="submit" value="SEND MESSAGE" class="button">
</div>
</form>
This works in Firefox and Chrome, but in IE8 no validation errors are triggered. Anyone know what the issue might be?
Thanks.
UPDATE: This seems to be a problem in all versions of IE. {{cform.input.$error}} and {{cform.input}} don't show output in any browser.
<div class="group">
<label for="firstname">First Name <span class="asterisk">*</span></label><br />
<input type="text" name="firstname" id="firstname" data-ng-model="firstname" ng-required="true" />
<span class="error" data-ng-show="cform.firstname.$error.required && cform.firstname.$dirty">Required!</span>
</div>
Ie 8 does not support html 5 ,Angular is using html 5 , Do the work around to get angular working on IE and then use the pattern because you cant use the html 5 element

Resources