We Keep Coding

Struggling to get multiple input fields value with the same name in Spring Boot

My input field
My question is how can i get all values from Name="phone" fields
JS
<script>
$(function(){
$(document.body).on('click', '.changeType' ,function(){
$(this).closest('.phone-input').find('.type-text').text($(this).text());
$(this).closest('.phone-input').find('.type-input').val($(this).data('type-value'));
});
$(document.body).on('click', '.btn-remove-phone' ,function(){
$(this).closest('.phone-input').remove();
});
$('.btn-add-phone').click(function(){
var index = $('.phone-input').length + 1;
$('.phone-list').append(''+
'<div class="input-group phone-input">'+
'<input type="number" name="phone" class="form-control" placeholder="(999) 999 9999" />'+
'<span class="input-group-btn">'+
'<button class="btn btn-danger btn-remove-phone" type="button"><span class="glyphicon glyphicon-remove"></span></button>'+
'</span>'+
'</div>'
);
});
});</script>
HTML
<div class="col-sm-10">
<div class="phone-list">
<div class="input-group phone-input">
<span class="input-group-btn">
</span>
<input type="number" name="phone" class="form-control" placeholder="(999) 999 9999" required=""/>
</div>
</div>
<button type="button" class="btn btn-success btn-sm btn-block btn-add-phone"><span class="glyphicon glyphicon-plus"></span> Add Phone</button>
</div>
Controller
#PostMapping("/applicant")
public String saveApplicantToDb(
#Valid #ModelAttribute Applicant applicant,
#RequestParam("phone") int[] phone
) {
if (phone!= null)
System.out.println(phone.length);
_applicantRepository.save(applicant);
return "applicant";
}

You are using multiple input number fields with the same name "phone" which is right, no problem with this and it should reflect back in the input #Param("phone"), but you have to make sure that the phone inputs must be of type integer for example your placeholder is totally incorrect (999) 999 9999. also the new added phone is not an integer. So make sure they are integers

The problem was name should match with your model attribute
However i was expecting int[] type of array from view but it was sending me String[] type of array problem solved and also make sure your JS code populating your input fields correctly [especially name='field_name'] should match to the attribute of your model. Check your it on browser -> inspect and collapse divs and see input field name

Find xpaths and extract text & status of checkbox/radio buttons in a loop

I have a page where I need to extract the text from an xpath and the status of the radio or checkbox that is associated with the text.
Each element is contained in a class called "c-form-group", so i have written a loop to iterate through to extract the "Text" the will be 4 elements found on the page. But it is failing on element 3 & 4, i must have something wrong with my xpath. I have yet to add in the check for the checkbox/radio button,
The first two elements are returning the values i require, then fails on element3.
Here are the 4 text elements i am trying to extract:
Plan B Warranty (Taxi) & Breakdown Recovery
Vehicle Asset Protection - Standard Cover
Negative Equity Cover
You confirm that you have received the VAP key facts leaflet?
Here is the code for the loop.
WebElement elem = driver.findElement(By.className("c-form-group"));
System.out.println("a");
List<WebElement> elementz = elem.findElements(By.xpath("//label[contains(#class,'c-option')]"));
for(int i = 0 ; i< elementz.size() ; i++){
System.out.println("Loop : " + i);
String vapval1 = elementz.get(i).findElement(By.xpath("//label[#class='c-option c-option--right u-px u-py-sm u-clearfix ng-scope' and not(#class='ng-pristine ng-untouched ng-valid ng-valid-required') and not (#class='c-option__radio')]")).getText();
System.out.println("0 = " + vapval1);
String vapval2 = elementz.get(i).findElement(By.xpath("//label[#class='c-option c-option--right u-px u-py-sm u-clearfix' and not(#class='ng-pristine ng-untouched ng-valid ng-valid-required') and not (#class='c-option__radio')]")).getText();
System.out.println("1 = " + vapval2);
String vapval3 = elementz.get(i).findElement(By.xpath("//label[#class,'c-option c-option--right u-px u-py-sm u-clearfix ng-scope' and not(#class='ng-pristine ng-untouched ng-valid') and not (#class='c-option__checkbox')]")).getText();
System.out.println("3 = " + vapval3);
String vapval4 = elementz.get(i).findElement(By.xpath("//label[#class,'c-option c-option--right u-px u-py-sm u-clearfix' and not(#class='ng-pristine ng-untouched ng-valid ng-valid-required') and not (#class='c-option__checkbox')]")).getText();
System.out.println("4 = " + vapval4);
}
Here is the full html, which may help.
<!DOCTYPE html>
<html class="ng-scope" ng-app="dan">
<head>
<body class="u-scroll-y ng-scope" ng-controller="CoreController as cc">
<div class="c-animate c-animate--show u-pos-f-t ng-hide" ng-show="global.alerts.length">
<div class="o-grid-fluid u-h-100 u-pl-0">
<div class="o-grid__row u-ml-0 u-h-100">
<div class="c-loader ng-hide" ng-show="loadingHome" style="">
<nav class="o-grid__col-xl-2 o-grid__col-lg-3 o-grid__col-xs-4 u-p-0 c-card__block u-h-100 u-shadowed u-pos-f-t ng-scope" ng-if="global.loggedIn">
<div class="u-p-0 u-h-100 o-grid__col-xl-10 o-grid__col-lg-9 o-grid__col-xs-8 u-pull-right" ng-class="{ 'o-grid__col-xl-10 o-grid__col-lg-9 o-grid__col-xs-8 u-pull-right' : global.loggedIn }">
<header class="o-layout-table__row u-bg-primary u-shadowed u-clearfix u-px ng-scope" ng-if="global.loggedIn">
<main class="o-view-container">
<div class="o-grid-fluid u-py-md">
<div class="o-grid__row">
<div class="c-animate c-animate--view-slide-in-right c-animate--view-slide-out-right ng-scope" ng-view="" style="">
<div class="o-grid__col-md-10 o-grid__col-xl-8 o-grid__col-xl-offset-2 o-grid__col-md-offset-1 ng-scope">
<div class="u-mb-lg u-text-center">
<h1 class="u-text-bold">Recommendations</h1>
</div>
<form class="ng-valid ng-valid-min ng-valid-max ng-valid-required ng-dirty ng-valid-parse" name="recommend" ng-submit="recommend.$valid" style="">
<div class="o-media c-card c-card__block u-shadowed u-mb-lg ng-scope" ng-if="rc.WarrantyEligible && !rc.prevWarranty()">
<label class="c-form-control-label u-px u-py-sm u-w-100">Warranty Options:</label>
<div class="c-form-group u-p-0 u-mb-sm u-clearfix">
<div class="o-grid__col-md-8">
<label class="c-form-control-label u-text-normal">Product Recommendations (Years):</label>
</div>
<div class="o-grid__col-md-4">
<input class="c-form-control ng-pristine ng-untouched ng-valid ng-valid-min ng-valid-max ng-valid-required" required="" placeholder="Years" ng-model="rc.recommend.year" min="1" max="3" type="number">
</div>
</div>
<div class="c-form-group ng-scope" ng-if="data.answer_taxi">
<label class="c-option c-option--right u-px u-py-sm u-clearfix ng-scope" ng-if="!rc.planA && !rc.prestige" ng-click="cc.utils.audit('recommendation_warranty_plan_taxi_b')">
<input class="ng-pristine ng-untouched ng-valid ng-valid-required" required="" ng-model="rc.recommend.warrantyPlan" value="taxiB" name="warrantyPlan" type="radio">
<i class="c-option__radio"></i>
Plan B Warranty (Taxi) & Breakdown Recovery
</label>
</div>
</div>
<div class="o-media c-card c-card__block u-shadowed u-mb-lg u-text-body u-bg-success" ng-if="!rc.prevVap() && rc.VapEligible ">
<div class="c-form-group">
<label class="c-form-control-label u-px u-py-sm u-w-100">Vehicle Asset Protection Options:</label>
<label class="c-option c-option--right u-px u-py-sm u-clearfix" ng-click="cc.utils.audit('recommend_vap')">
<input class="ng-pristine ng-untouched ng-valid ng-valid-required" required="" ng-model="rc.recommend.vapPlan.plan" value="standard" name="vapPlan" type="radio">
<i class="c-option__radio"></i>
Vehicle Asset Protection - Standard Cover
</label>
<label class="c-option c-option--right u-px u-py-sm u-clearfix ng-scope" ng-if="data.answer_equity == true" ng-click="cc.utils.audit('recommend_negative_equity')">
<input class="ng-untouched ng-valid ng-dirty ng-valid-parse" ng-model="rc.recommend.vapPlan.equity" name="vapPlanEquity" type="checkbox" style="">
<i class="c-option__checkbox"></i>
Negative Equity Cover
</label>
<label class="c-option c-option--right u-px u-py-sm u-clearfix" ng-click="cc.utils.audit('vap_key_facts_checked')">
<input class="ng-pristine ng-untouched ng-valid ng-valid-required" required="" ng-model="rc.recommend.vapCheck" name="vapCheck" type="checkbox">
<i class="c-option__checkbox"></i>
You confirm that you have received the VAP key facts leaflet?
</label>
</div>
</div>
</form>
<div class="c-form-group">
</div>
</div>
</div>
</div>
</main>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js">
<script src="./build/app.js?v=2.13" defer="">
<script src="/build/standalone/jspdf.js" defer="">
<script src="/build/standalone/sigWebTablet.js" defer="">
</body>
</html>

I'm a little confused as to what you are trying to do. You mention getting the text from the elements and also getting the state of the checkboxes. Your XPaths on the outer and inner loop overlap. Your elementz list is pulled from a LABEL that contains the c-option class but then you start with an element from elementz and the first part of your XPath you repeat the search for a LABEL that contains the c-option class.
There is an much easier way to do this. Each of these checkboxes/radiobuttons are INPUT tags and have a name specific to their value.
Plan B Warranty (Taxi) & Breakdown Recovery: <input ... name="warrantyPlan" type="radio">
Vehicle Asset Protection - Standard Cover: <input ... name="vapPlan" type="radio">
Negative Equity Cover: <input ... name="vapPlanEquity" type="checkbox" style="">
You confirm that you have received the VAP key facts leaflet?: <input ... name="vapCheck" type="checkbox">
So with that info, you can just get each INPUT with CSS selectors like
By.cssSelector("input[name='warrantyPlan']")
Once you have the INPUT element, you can check if it's selected using .isSelected().
If you really do need the text, you can get the label because it's the parent of the INPUT we just got. We can do this with an XPath, By.xpath(".."), which gets the parent of the current element.
We can put this all together like
// Plan B Warranty (Taxi) & Breakdown Recovery
WebElement e = driver.findElement(By.cssSelector("input[name='warrantyPlan']"));
System.out.println(e.isSelected()); // false
System.out.println(e.findElement(By.xpath("..")).getText()); // Plan B Warranty (Taxi) & Breakdown Recovery
// Vehicle Asset Protection - Standard Cover
e = driver.findElement(By.cssSelector("input[name='vapPlan']"));
System.out.println(e.isSelected()); // false
System.out.println(e.findElement(By.xpath("..")).getText()); // Vehicle Asset Protection - Standard Cover
I just did the first two. You can see the pattern and apply it for the last two.

Thymeleaf: How to retrieve elements from list or database without iterating?

I am trying to check if a field in the database is true or false using the SpEl "th:if="${certs.flag == 'TRUE'}" ". If it is set to "true" the form should not be displayed. I have searched all over but can not seem to find any article that has an example of what i need exactly. Everyone seems to be using iteration. But iteration is not applicable to what i am doing.
#RequestMapping(value = "/cert_prog", method = RequestMethod.GET)
public String examsList(Model model, CertificateProgramme certificateProgramme){
Iterable<Exams> exams = examService.findAll();
Iterable<School> schools = schoolService.findAll();
Iterable<CertificateProgramme> certificateProgrammes = certificateService.findAll();
Iterable<Picture> pictures = pictureService.findAll();
CertificateProgramme mycert = certificateService.flagger(certificateProgramme);
model.addAttribute("mycert", mycert);
model.addAttribute("exams", exams);
if(!model.containsAttribute("newExam")){
model.addAttribute("newExam", new Exams());
}
model.addAttribute("certificateProgrammes", certificateProgrammes);
if(!model.containsAttribute("certificate")){
model.addAttribute("certificate",new CertificateProgramme());
}
model.addAttribute("grades", Grade.values());
model.addAttribute("regions", Region.values());
model.addAttribute("schools",schools);
if(!model.containsAttribute("newSchool")){
model.addAttribute("newSchool",new School());
}
model.addAttribute("picture", new Picture());
return "cert_prog";
}
<form th:if="${certs.flag == 'TRUE'}" method="post" th:object="${certificate}" th:action="#{/basic}" class="form-inline inline new-item">
<div th:replace="common/layout :: flash"></div>
<fieldset>
<legend> Personal Information</legend>
<div class="row" th:classappend="${#fields.hasErrors('fullName')}? 'error' : ''" >
<input type="text" class="form-control input-sm" th:field="*{fullName}" placeholder="Full Name example Jane Doe"/>
<div class="error-message" th:if="${#fields.hasErrors('fullName')}" th:errors="*{fullName}"></div>
</div>
<div class="row" th:classappend="${#fields.hasErrors('date')}? 'error' : ''" >
<input type="date" class="form-control input-sm datepicker" th:field="*{date}"
placeholder="Date Of Birth"/>
<div class="error-message" th:if="${#fields.hasErrors('gender')}" th:errors="*{date}"></div>
</div>
<div class="row" th:classappend="${#fields.hasErrors('Nationality')}? 'error' : ''" >
<input type="text" class="form-control input-sm autocomplete" th:field="*{Nationality}"
placeholder="Nationality"/>
<div class="error-message" th:if="${#fields.hasErrors('Nationality')}" th:errors="*{Nationality}"></div>
</div>
<div class="row" th:classappend="${#fields.hasErrors('email')}? 'error' : ''" >
<input type="text" class="form-control input-sm" th:field="*{email}"
placeholder="Email example jane.doe#example.com"/>
<div class="error-message" th:if="${#fields.hasErrors('email')}" th:errors="*{email}"></div>
</div>
<div class="row" th:classappend="${#fields.hasErrors('married')}? 'error' : ''" >
<select th:field="*{married}" class="form-control input-lg">
<option value="">[Select Martial Status]</option>
<option value="Single">Single</option>
<option value="Married">Married</option>
</select>
<div class="error-message" th:if="${#fields.hasErrors('married')}" th:errors="*{married}"></div>
</div>
<div class="row">
<input type="text" class="form-control input-sm" th:field="*{guardianTelephoneNumber}"
placeholder="Guardian Telephone Number"/>
</div>
<div th:classappend="${#fields.hasErrors('courseOffered')}? 'error' : ''">
<input type="text" th:field="*{courseOffered}" placeholder="CourseOffered"/>
<div class="error-message" th:if="${#fields.hasErrors('courseOffered')}" th:errors="*{courseOffered}"></div>
</div>
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-primary">Add</button>
</div>
</fieldset>
</form>

Your question doesn't really make sense to me. If you want to check a single field from the database, then you can't pass a list of items. For example, in your html:
<div th:each="certs : ${certificateProgrammes}">
<form th:if="${certs.flag == 'TRUE'}">
.
.
.
</form>
</div>
It's going through the list of ${certificateProgrammes} and assigning it to ${certs} each time in the loop. If you don't want to loop, then instead of adding Iterable<CertificateProgramme> certificateProgrammes = certificateService.findAll(); to the model, just add a single object of type CertificateProgramme. Then you can do:
model.addAttribute("certs", /* however you get the specific one you want to check */);
and in the html
<!-- no iterating required, because you know which object you're talking about -->
<form th:if="${certs.flag == 'TRUE'}">

Receive different result from 2 empty form inputs

In a .jsp page I have a form (POST method):
<div class="form-group">
<div class="col-md-3">
<input type="text" list="materials" class="form-control" name="material"/>
<datalist id="materials"></datalist>
</div>
<div class="col-md-3 col-sm-3">
<input type="number" class="form-control" name="quantity" >
</div>
</div>
I delete the html5 element required from the input to see what happens if the user submit the form without filling these inputs. In my servlet, I get this:
String material = request.getParameter("material");
String quantity = request.getParameter("quantity");
System.out.println("material="+ material + "-quantity=" + quantity);
and I get:
material=-quantity=null
The fact that I receive an empty string and a null result is it because of the diferrent type in the input?

Scrape Html in Android

I need to scrape a url in my android app. The url returns this block of Html code below:
<div id="main">
<div id="header">
<form action="/search_db.php" id="f1" method="GET">
<div style="float:left; width:829px;">
<span style="margin:15px;"><img src="http://mp3skull.com/img/logo.jpg" border="0" alt="mp3skull.com - mp3 downloads" style="vertical-align:middle;" /></span>
<input type="text" name="q" id="sfrm" autocomplete="off" value="feel good inc gorillaz" style="font-size:18px; vertical-align:middle; width:470px;">
<input type="hidden" name="fckh" value="c1935e9a779034dec31fe7117c456eb8">
<input type="submit" id="search_button" value="Search" style="font-size:18px; vertical-align:middle;">
</div>
<div style="float:left; text-align:right;">
</div>
<div style="clear:both;"></div>
</form><script type="text/javascript">document.getElementById('sfrm').focus();InstallAC(document.getElementById('f1'), document.getElementById('sfrm'), document.getElementById('search_button'), '', 'en');</script>
</div>
Kindly show me an example of how to extract the values of the returned html code in java

Using jsoup.
Document doc = Jsoup.connect("http://your/url/here").get(); // or Jsoup.parse(htmlString);
Elements header = doc.select("#header"); //access to <div id="header">...</div>
Elements inputs = header.select("input");
for(Element input : inputs){
System.out.println(input); //print <input>....</input>
System.out.println(input.attr("id")); //printing attribute id
}