Develop Reference

Retrieve input(s) from DataTable

Need some advice how should I retrieve a list of exhibits.
In my html template below, I only put one record of exhibit. If i were to put additional rows/records of exhibit, how do i go about mapping them to the controller.
HTML Template
<h3>Exhibit Details</h3>
<div class="table-responsive">
<table id="exhibitTable"
class="table table-bordered table-hover table-striped">
<thead>
<tr>
<th>Exhibit Type</th>
<th>Description</th>
<th>Marking</th>
<th>Remarks</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="form-group col-md-3">
<div class="cols-sm-10">
<select class="form-control selectpicker cols-md-3"
th:value="${exhibit.exhibitType}" id="exhibitType"
name="exhibitType" roleId="exhibitType">
<option value="">Select Type</option>
<option>Desktop</option>
<option>Laptop</option>
<option>Mobile Device</option>
<option>Portable Storage</option>
<option>Server</option>
<option>Video System</option>
<option>Save As</option>
<option>Others</option>
</select>
</div>
</div>
</td>
<td>
<div class="form-group col-md-3">
<input type="text" name="exhibitDescription"
id="exhibitDescription"
th:value="${exhibit.exhibitDescription}" />
</div>
</td>
<td>
<div class="form-group col-md-3">
<input type="text" name="exhibitMarking" id="exhibitMarking"
th:value="${exhibit.exhibitMarking}" />
</div>
</td>
<td><div class="form-group col-md-3">
<input type="text" name="exhibitRemarks" id="exhibitRemarks"
th:value="${exhibit.exhibitRemarks}" />
</div></td>
</tr>
</tbody>
</table>
</div>
Controller
#RequestMapping(value = "/register", method = RequestMethod.POST)
public String registerIncidentPost(#ModelAttribute("incident") Incident incident,
#ModelAttribute("exhibit") Exhibit exhibit, Principal principal) throws Exception {
long year = Calendar.getInstance().get(Calendar.YEAR);
incident.setIncidentYear(year + "");
Long refNo = incidentService.findMaxRefNoCurrentYear(year + "");
if (refNo == null)
refNo = (long) 1;
else
refNo += 1;
incident.setIncidentRefNo(refNo);
incident.setIncidentStatus(Incident.INCIDENT_REGISTERED);
incident.setIncidentOpeningTimestamp(new Date());
User user = userService.findByUsername(principal.getName());
incident.setIncidentCreatedBy(user);
incidentService.createIncident(incident);
exhibitService.createExhibit(exhibit);
return "redirect:/incident";
}
I've attempted to add the following to my template
<tr data-th-each="exhibit:${exhibitList}">
and the following to my controller
#ModelAttribute("exhibitList") ArrayList<Exhibit> exhibitList
but did not work.
Thanks in advance.

I can only assume this is vb.net since you didn't specify. You need to pass in the complete dataset to the page. Each item in the dataset will be one pre-loaded instance of the model. Then you can do a for each loop on the page itself and generate the html dynamically. Hope this helps.

Unable to click on dynamic generating checkbox

I have a table of generating the dynamic checkboxes as below:
<div style="background: #fff;">
<div class="modal-body">
<table class="table no-margin">
<thead>
<tr>
<th>Select</th>
<th>Group Name</th>
<th>Contacts</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="checkbox checkbox-styled">
<label>
<input type="checkbox" class="datacontact" onchange="SelectContacts(this);" data-listid='1' data-grpname='Newsletter' />
</label>
</div>
</td>
<td>Newsletter</td>
<td>0</td>
</tr>
<tr>
<td>
<div class="checkbox checkbox-styled">
<label>
<input type="checkbox" class="datacontact" onchange="SelectContacts(this);" data-listid='2' data-grpname='Website Leads Buyer' />
</label>
</div>
</td>
<td>Website Leads Buyer</td>
<td>0</td>
</tr>
<tr>
<td>
<div class="checkbox checkbox-styled">
<label>
<input type="checkbox" class="datacontact" onchange="SelectContacts(this);" data-listid='3' data-grpname='Website Leads Seller' />
</label>
</div>
</td>
<td>Website Leads Seller</td>
<td>2</td>
</tr>
<tr>
<td>
<div class="checkbox checkbox-styled">
<label>
<input type="checkbox" class="datacontact" onchange="SelectContacts(this);" data-listid='4' data-grpname='Website Leads Investor' />
</label>
</div>
</td>
<td>Website Leads Investor</td>
<td>0</td>
</tr>
<tr>
<td>
<div class="checkbox checkbox-styled">
<label>
<input type="checkbox" class="datacontact" onchange="SelectContacts(this);" data-listid='5' data-grpname='Website Leads' />
</label>
</div>
</td>
<td>Website Leads</td>
<td>0</td>
</tr>
<tr>
<td>
<div class="checkbox checkbox-styled">
<label>
<input type="checkbox" class="datacontact" onchange="SelectContacts(this);" data-listid='7980' data-grpname='NewGroup1' />
</label>
</div>
</td>
<td>NewGroup1</td>
<td>0</td>
</tr>
<tr>
<td>
<div class="checkbox checkbox-styled">
<label>
<input type="checkbox" class="datacontact" onchange="SelectContacts(this);" data-listid='7996' data-grpname='My Group' />
</label>
</div>
</td>
<td>My Group</td>
<td>0</td>
</tr>
<tr>
<td>
<div class="checkbox checkbox-styled">
<label>
<input type="checkbox" class="datacontact" onchange="SelectContacts(this);" data-listid='9136' data-grpname='Email Functionality ' />
</label>
</div>
</td>
<td>Email Functionality </td>
<td>0</td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-flat btn-default-dark ink-reaction">OK</button>
<button type="button" data-dismiss="modal" class="btn btn-flat btn-default-dark ink-reaction">Cancel</button>
</div>
</div>
</div>
</div>
</div>
And through the below mentiond code, I have getting value of the checkbox called "Website Leads Seller"
package TestScripts;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.interactions.Actions;
import org.openqa.selenium.WebElement;
//import com.sun.xml.internal.bind.v2.schemagen.xmlschema.List;
public class EmailClient_VerifyEmail {
public static void main(String[] args) {
System.setProperty("webdriver.gecko.driver", "C:/geckodriver/geckodriver-v0.21.0-win64/geckodriver.exe");
WebDriver driver = new FirefoxDriver();
driver.manage().timeouts().implicitlyWait(40, TimeUnit.SECONDS);
driver.get("http://cp.iagentsolutions.com/login.aspx");
//enter email id
driver.findElement(By.cssSelector("#txtuserName")).sendKeys("abdul123");
//enter password
driver.findElement(By.cssSelector("#txtPassword")).sendKeys("admin123");
// click on login
driver.findElement(By.cssSelector("#LoginSnd")).click();
System.out.println("User Login Successfully from CP");
//hover on menu
//driver.findElement(By.xpath("html body.menubar-hoverable.header-fixed.menubar-visible form#form1 div#base div#menubar.menubar-inverse.animate div.nano.has-scrollbar div.nano-content div.menubar-scroll-panel ul#main-menu.gui-controls"))
Actions action = new Actions(driver);
//WebElement element =
action.moveToElement(driver.findElement(By.cssSelector(".menubar-foot-panel"))).perform();//("html body.menubar-hoverable.header-fixed.menubar-visible form#form1 div#base div#menubar.menubar-inverse.animate div.nano.has-scrollbar div.nano-content div.menubar-scroll-panel ul#main-menu.gui-controls")));
//click on Email Client menu for open sub-menus
driver.findElement(By.xpath("/html/body/form/div[3]/div[2]/div[2]/div[1]/div/ul/li[7]/a/span")).click();
driver.manage().timeouts().implicitlyWait(40, TimeUnit.SECONDS);
// click on Create Email
driver.findElement(By.xpath("/html/body/form/div[3]/div[2]/div[2]/div[1]/div/ul/li[7]/ul/li[1]/a/span")).click();
//Enter draft name
driver.findElement(By.name("ctl00$body$txtDraftName")).sendKeys("Try to send without verify email");
//Click on Next button
driver.findElement(By.name("ctl00$body$btnStep1Next")).click();
//Email Settings
// Enter subject
driver.findElement(By.id("body_txtSubject")).sendKeys("Try to send without verify email");
driver.manage().timeouts().implicitlyWait(50, TimeUnit.SECONDS);
//Click on Add / Edit to open Contact List
driver.findElement(By.linkText("Add / Edit")).click();
driver.manage().timeouts().implicitlyWait(50, TimeUnit.SECONDS);
driver.findElements(By.xpath("//input[#type='checkbox' and #class='datacontact']")).forEach(elelemnt -> {
elelemnt.click();
});
}
}
But this code is only working for getting the check box title instead of clicking on the checkbox.

I have tested it and it is working properly :
using below code :
driver.findElements(By.xpath("//input[#type='checkbox' and #class='datacontact']")).forEach(element -> {
if (element.getAttribute("data-grpname").trim().equals("Website Leads Seller")) {
((JavascriptExecutor) driver).executeScript("arguments[0].click();", element);
}
});

Spring Thymeleaf twice form submit Error 400

i have a thymeleaf form that can validate data from the database through spring controller, the data validation works fine, but when i want to validate with different data after validation it give me an Error 400, there's no error in the stack trace, so i don't know how how to fix this, maybe because of my bad logic, because i'm newbie at this..
here's the form
<form th:name="memberRkiForm" id="memberRkiForm" th:action="#{/}" th:object="${formResult}"
method="POST">
<div>
<table id="form">
<tr>
<td colspan="7" height="40"><img class="formlogo"
th:src="#{/resources/img/docicon.png}">
<h3 class="formHeader"><b><u>REGISTER MANUAL</u></b></h3></td>
</tr>
<tr>
<td>
<label>Provider Name </label>
</td>
<td><label>:</label></td>
<td>
<input type="text" th:value="${providerId}" name="providerId" style="width:275px;"
readonly="readonly" hidden="hidden"> </input>
<input type="text" th:value="${providerName}" name="providerName" style="width:275px;"
readonly="readonly"> </input>
</td>
<td class="sep"></td>
</tr>
<tr>
<td>
<label>Member Card Number* </label>
</td>
<td><label>:</label></td>
<td>
<input type="text" name="cardNumber" th:field="*{cardNumber}"
onkeypress="return isNumberKey(event)"
style="width:190px; display: inline;"> </input>
<input id="checkCardNum" class="default-button" type="submit" style="display: inline;"
value="Validasi">
</td>
<td width="500">
<div class="error" style="display:inline;color:red;">
<p id="cardNumError" style="margin-left:15px;" th:text="${cardNumError}"></p>
</div>
</td>
<td class="sep"></td>
</tr>
<tr>
<td>
<label>Member Name </label>
</td>
<td><label>:</label></td>
<td>
<input type="text" th:value="${memberName}" name="memberName" style="width:275px;"
readonly="readonly"> </input>
</td>
<td class="sep"></td>
</tr>
<tr>
<td>
<label>Date Of Birth </label>
</td>
<td><label>:</label></td>
<td>
<input type="text" th:value="${birthday}" name="birthday" style="width:275px;"
readonly="readonly"> </input>
</td>
<td class="sep"></td>
</tr>
<tr>
<td><label>Client Name </label></td>
<td><label>:</label></td>
<td>
<input type="text" th:value="${clientName}" name="clientName" style="width:275px;"
readonly="readonly"> </input>
</td>
<td class="sep"></td>
</tr>
<tr>
<td>
<label>Admission Date </label>
</td>
<td><label>:</label></td>
<td>
<input id="datepicker" type="text"
style="margin-top:4px;width:230px;display:inline-block;"/>
<span class="calendarbox"><img th:src="#{/resources/img/calendar.png}" height="25"
width="35"></span>
</td>
<td class="sep"></td>
</tr>
<tr>
<td><label>Claim Service* </label></td>
<td><label>:</label></td>
<td>
<input type="text" th:value="${selectServiceIsEnabled}" name="selectServiceIsEnabled"
style="width:275px;" readonly="readonly" hidden="hidden"> </input>
<select id="selectservice" th:field="*{caseCategoryList}" class="selectcss"
style="width:275px;margin-left: 5px;" disabled="disabled">
<option th:each="case : ${caseCategoryList}" th:value="${case.caseCategoryId}"
th:text="${case.caseCategoryName + ' - ' + case.caseCategoryCode}"></option>
</select>
</td>
<td width="500">
<span class="error" style="display: inline;color:red;"><p id="select_error"></p></span>
</td>
<td class="sep"></td>
</tr>
<tr colspan="7" class="jumper"></tr>
<tr>
<td>
<input id="addMember" class="remodal-confirm" type="submit" name="action"
value="Register"/>
<input class="remodal-cancel" type="reset" value="Clear"/>
</td>
</tr>
</table>
</div>
</form>
when validate button is clicked, the form action goes to a spring controller that check the card number to the database (checkCardNum), then if the data validation return true, the form will be automatically filled by the data that related to the card number, after the form's filled with the data, i want to check validation with another card number (different from the first validated card number), but it give me an error 400.
here's my controller
#PreAuthorize("hasAuthority('"+ACLConstant.MENU_REGISTRATIONMEMBERRKI+"')")
#RequestMapping(value="/member-rki-form",method={RequestMethod.GET , RequestMethod.POST} )
public String memberrkiform(Model model, HttpServletRequest request, #ModelAttribute("formResult") MemberRkiForm formResult){
Authentication auth = SecurityContextHolder.getContext().getAuthentication();
UserAuth userAuth = (UserAuth)auth.getPrincipal();
String[] cols = {"username", "deletedStatus"};
Object[] values = {userAuth.getUserName(), 0};
Users user = userService.findUserByColsAndValues(cols, values);
int userid = user.getUserId();
Users currentUser = userService.findUserByPK(userid);
Provider provider = currentUser.getProvider();
model.addAttribute("providerId", provider.getProviderId());
model.addAttribute("providerName", currentUser.getFirstName());
model.addAttribute("cardNumber", formResult.getcardNumber());
model.addAttribute("cardNumError", formResult.getErrorMsg());
model.addAttribute("memberName", formResult.getMemberName());
model.addAttribute("birthday", formResult.getBirthday());
model.addAttribute("clientName", formResult.getClientName());
model.addAttribute("caseCategoryList", formResult.getCaseCategoryList());
model.addAttribute("selectServiceIsEnabled", formResult.getSelectServiceIsEnabled());
return "memberrki/member-rki-form";
}
#RequestMapping(value="/checkCardNum",method={RequestMethod.GET , RequestMethod.POST})
public String checkCardNum(#ModelAttribute("formResult") MemberRkiForm formResult, Model model, HttpServletRequest request, RedirectAttributes redirectFormData){
String errorMsg = "";
String cardNumber = formResult.getcardNumber();
if(cardNumber==null || cardNumber==""){
errorMsg="Card Number Data Is Required";
}
else{
String[] cols = {"currentCardNumber", "deletedStatus" , "subscriptionStatus"};
Object[] values = {formResult.getcardNumber(), 0 , 1};
Member member = memberService.findMemberByColsAndValues(cols, values);
if(member==null){
errorMsg="Member Not Found";
}
else{
Member validatedMember = memberService.findMemberByPK(member.getMemberId());
Client validatedMemberClient = validatedMember.getClient();
formResult.setMemberName(validatedMember.getFirstName());
formResult.setBirthday(validatedMember.getBirthday().toString());
formResult.setClientName(validatedMemberClient.getClientName());
MemberProductSearchParams memberProductParams = new MemberProductSearchParams();
memberProductParams.setMember(validatedMember);
memberProductParams.setDeletedStatus(0);
memberProductParams.setSubscriptionStatus(1);
Page<MemberProduct> memberProductPage = memberService.findMemberProductListing(memberProductParams, null);
List<MemberProduct> memberProductLists = memberProductPage.getContent();
if(memberProductPage==null || memberProductLists==null){
/*System.out.println("NO PRODUCT FOUND");*/
errorMsg="NO PRODUCT AVAILABLE";
}
else{
List<Product> productList = new ArrayList<Product>();
List<CaseCategory> caseCategoryList = new ArrayList<CaseCategory>();
for(int i=0; i<memberProductLists.size(); i++){
String[] productCols = {"productId", "deletedStatus"};
Object[] productValues = {memberProductLists.get(i).getProduct().getProductId(), 0};
Product products = productService.findProductByColsAndValues(productCols, productValues);
productList.add(products);
String[] caseCategoryCols = {"caseCategoryId", "deletedStatus"};
Object[] caseCategoryValues = {productList.get(i).getCaseCategory().getCaseCategoryId(), 0};
CaseCategory caseCategories = caseCategoryService.findCaseCategoryByColsAndValues(caseCategoryCols, caseCategoryValues);
caseCategoryList.add(caseCategories);
}
formResult.setCaseCategoryList(caseCategoryList);
}
formResult.setSelectServiceIsEnabled("true");
}
}
formResult.setErrorMsg(errorMsg);
formResult.setcardNumber(cardNumber);
redirectFormData.addFlashAttribute("formResult", formResult);
formResult = new MemberRkiForm();
return "redirect:/memberrki/member-rki-form";
}
}
maybe someone here can help me to solve the problem,
Thx in advance.. (sorry for my bad english)

how to delete data from different <div>

i am loading two <div> on single page, both holding same userID. I want to delete user data from 2nd <div>. how is it possible. Here is my controller code for delete..
HTML
<div id="tab1">
<br/>
<font color="#3b73af" size="4">Partner Detail</font>
#if($editPartnerDetail)
<form id="editPartnerDetail" class="aui" onsubmit="return validateEditForm()">
<div id="Partner_Detail">
<table style="width:80%;border:none;" cellspacing="0" cellpadding="0">
<tr>
<td>Admin Name:</td><td><input type="text" value="$editPartnerDetail.adminName" id="editAdminName" name="editAdminName" size="55" /></td>
</tr>
<tr>
<td>Email:</td><td><input type="text" value="$editPartnerDetail.email" id="editEmail" name="editEmail" size="55" /></td>
</tr>
<tr>
<td>Phone:</td><td><input type="text" value="$editPartnerDetail.phone" id="editPhone" name="editPhone" size="55" /></td>
</tr>
<input type="hidden" value="$editPartnerDetail.partnerDetailId" id="editPartnerDetailId" name="editPartnerDetailId" size="55" />
<input type="hidden" value="$editPartnerDetail.partnerSiteId" id="editPartnerSiteId" name="editPartnerSiteId" size="55" />
<tr>
<td></td><td><input type="submit" value="Update" class="button" /> Cancel</td>
</tr>
</table>
</div> <br/><br/><br/>
</form>
#else
<form id="addPartnerDetail" class="aui" onsubmit="return validateForm()">
<div id="Partner_Detail">
<table style="width:80%;border:none;" cellspacing="0" cellpadding="0">
<tr>
<td>Admin Name:</td><td><input type="text" value="" id="adminName" name="adminName" size="55" autocomplete="off"/></td>
</tr>
<tr>
<td>Email:</td><td><input type="text" value="" id="email" name="email" size="55" autocomplete="off"/></td>
</tr>
<tr>
<td>Phone:</td><td><input type="text" value="" id="phone" name="phone" size="55" autocomplete="off"/></td>
</tr>
<input type="hidden" value="$siteId" id="addPartnerSiteId" name="addPartnerSiteId" size="55" />
<tr>
<td></td><td><input type="submit" value="Add" class="button" /></td>
</tr>
</table>
</div> <br/><br/><br/>
</form>
#end
<div id="Partner_Detail">
<table style="width:80%">
<tr>
<th bgcolor="#F2F5A9">Admin Name</th>
<th bgcolor="#F2F5A9">Email</th>
<th bgcolor="#F2F5A9">Phone</th>
<th bgcolor="#F2F5A9">Action</th>
</tr>
#foreach( $partnerDetail in $partnerDetailList )
<tr>
<td>$partnerDetail.adminName</td>
<td>$partnerDetail.email</td>
<td>$partnerDetail.phone</td>
<td align="center">Edit | Delete</td>
</tr>
#end
</table>
</div>
</div>
<div id="tab2">
#if($editPartnerSite2)
<form id="editsite2" class="aui">
<div id="edit_Partner_site2">
<input type="text" value="$editPartnerSite2.partnerSite" id="editPartnerSite" name="editPartnerSite" size="55" />
<input type="hidden" value="$editPartnerSite2.partnerId" id="editPartnerSiteId" name="editPartnerSiteId" size="55" />
<input type="hidden" value="site" id="page" name="page" size="55" />
<input type="submit" value="Update" class="button">
Cancel
#if($isSiteupdated == false)
<div style="color:red;">Cannot Edit. Same partner site already exist.</div>
#end
</div>
</br>
</form>
#else
<form id="addsite" class="aui">
<div id="add_Partner_Site">
<input type="hidden" value="site" id="page" name="page" size="55" />
<input type="text" id="partnersite" name="partnersite" size="55" autocomplete="off" value="$!existingSite"/>
<br/><br/><input type="submit" value="Add" class="button" /></td>
#if($isSiteAdded == false)
<div style="color:red;">Cannot add. Same partner site already exist.</div>
#end
</div> <br/><br/><br/>
</form>
#end
<table>
<tr>
<th bgcolor="#F2F5A9">Partner Site</th>
<th bgcolor="#F2F5A9">Action</th>
</tr>
#foreach( $partnerSite in $partnerSiteList )
<tr>
<td>$partnerSite.partnerSite</td>
<td align="center">Edit | Delete</td>
</tr>
#end
</table>
<div>
Controller
else if (pageName != null && pageName.equals("partnerDetail")) {
Map<String, Object> context = new HashMap<String, Object>();
if (request.getParameter("nameId") != null && request.getParameter("nameId") != "") {
siteId = Integer.parseInt(request.getParameter("nameId"));
String mode = request.getParameter("mode");
if (mode != null && mode.equals("delete")) {
String pdId = request.getParameter("pdId");
if (pdId != null && pdId != "") {
partnerDetailService.deletePartneDetail(Integer.parseInt(pdId));
}
}
if (mode != null && mode.equals("edit")) {
String pdId = request.getParameter("pdId");
int partnerDetailID = Integer.parseInt(pdId);
if (pdId != null && pdId != "") {
PartnerDetail editPartnerDetail = partnerDetailService.getPartneDetailById(partnerDetailID);
context.put("editPartnerDetail", editPartnerDetail);
}
}
}
if (request.getParameter("nameId") != null && request.getParameter("nameId") != "") {
siteId = Integer.parseInt(request.getParameter("nameId"));
String mode = request.getParameter("mode");
if (mode != null && mode.equals("deleteTab2")) {
String sId = request.getParameter("sId");
if (sId != null && sId != "") {
partnerSiteService.deletePartnerSite(Integer.parseInt(sId));
}
}
}
//===========================
context.put("siteId", siteId);
List<PartnerDetail> partnerDetailList = partnerDetailService.getAllDetailByPartnerSiteID(siteId);
context.put("partnerDetailList", partnerDetailList);
String partnerId = request.getParameter("nameId");
int pID = Integer.parseInt(partnerId);
List<PartnerSite> partnerSiteList = partnerDetailService.getAllPartnerSiteById(pID);
context.put("partnerSiteList", partnerSiteList);
response.setContentType("text/html;charset=utf-8");
renderer.render("templates/admin/partnerDetail.vm", context,response.getWriter());
help me out..

You should never use the same ID on two elements!
It's better to use class instead. The id-attribute is reserved for unique idintifiers

Wicket: how to implements not grouped radio buttons

I have 4 columns of radio buttons in a table. Problem: in Wicket, the radio buttons of a same group need to be grouped under one Wicket tag but it's impossible to do it in HTML because a table is declared row by row.
Code example
<table id="table1">
<thead>
<tr>
<td>Group 1</td>
<td>Group 2</td>
<td>Group 3</td>
<td>Group 4</td>
</tr>
</thead>
<tbody>
<tr>
<td>Value 1</td>
<td>Value 2</td>
<td>Value 3</td>
<td>Value 4</td>
</tr>
<tr>
<td><input type="radio" name="group1" wicket:id="g1b1"><\td>
<td><input type="radio" name="group2" wicket:id="g2b1"><\td>
<td><input type="radio" name="group3" wicket:id="g3b1"><\td>
<td><input type="radio" name="group4" wicket:id="g4b1"><\td>
</tr>
<tr>
<td><input type="radio" name="group1" wicket:id="g1b2"><\td>
<td><input type="radio" name="group2" wicket:id="g2b2"><\td>
<td><input type="radio" name="group3" wicket:id="g3b2"><\td>
<td><input type="radio" name="group4" wicket:id="g4b2"><\td>
</tr>
<tr>
<td><input type="radio" name="group1" wicket:id="g1b3"><\td>
<td><input type="radio" name="group2" wicket:id="g2b3"><\td>
<td><input type="radio" name="group3" wicket:id="g3b3"><\td>
<td><input type="radio" name="group4" wicket:id="g4b3"><\td>
</tr>
<tr>
<td><input type="radio" name="group1" wicket:id="g1b4"><\td>
<td><input type="radio" name="group2" wicket:id="g2b4"><\td>
<td><input type="radio" name="group3" wicket:id="g3b4"><\td>
<td><input type="radio" name="group4" wicket:id="g4b4"><\td>
</tr>
</tbody>
</table>
As you see, the four groups are mixed together and if I create a group that doesn't exist in HTML, an exception is thrown.
If I declare different groups with the same wicket id, only the last radio button I add is taken into account.
Can anyone help me out?

Wrap the Radios with four nested RadioGroups, and pass the correct group instance to each Radio constructor:
final RadioGroup<Integer> radioGroup1 = new RadioGroup<Integer>("radioGroup1", new Model<Integer>());
final RadioGroup<Integer> radioGroup2 = new RadioGroup<Integer>("radioGroup2", new Model<Integer>());
final RadioGroup<Integer> radioGroup3 = new RadioGroup<Integer>("radioGroup3", new Model<Integer>());
final RadioGroup<Integer> radioGroup4 = new RadioGroup<Integer>("radioGroup4", new Model<Integer>());
add(new FeedbackPanel("feedback"));
add(new Form<Void>("form")
.add(radioGroup1
.add(radioGroup2
.add(radioGroup3
.add(radioGroup4
.add(new Loop("loop", 10) {
#Override
protected void populateItem(LoopItem item) {
Model<Integer> itemModel = Model.of(item.getIndex());
item.add(new Radio<Integer>("radio1", itemModel, radioGroup1));
item.add(new Radio<Integer>("radio2", itemModel, radioGroup2));
item.add(new Radio<Integer>("radio3", itemModel, radioGroup3));
item.add(new Radio<Integer>("radio4", itemModel, radioGroup4));
item.add(new Label("label", itemModel));
}
})))))
.add(new Button("submit") {
#Override
public void onSubmit() {
info(Strings.join(", ",
radioGroup1.getModelObject().toString(),
radioGroup2.getModelObject().toString(),
radioGroup3.getModelObject().toString(),
radioGroup4.getModelObject().toString()));
}
}));
<div wicket:id="feedback"></div>
<form wicket:id="form">
<div wicket:id="radioGroup1">
<div wicket:id="radioGroup2">
<div wicket:id="radioGroup3">
<div wicket:id="radioGroup4">
<table>
<tr>
<th>A</th>
<th>B</th>
<th>C</th>
<th>D</th>
</tr>
<tr wicket:id="loop">
<td><input type="radio" wicket:id="radio1"></td>
<td><input type="radio" wicket:id="radio2"></td>
<td><input type="radio" wicket:id="radio3"></td>
<td><input type="radio" wicket:id="radio4"></td>
<td><span wicket:id="label"></span></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<button wicket:id="submit" type="submit">Submit</button>
</form>

I think you could the RadioGroup tag wrapping the table (or even the tbody tag). A wicket:container tag won't mess with the HTML structure. Like this:
<wicket:container wicket:id="group">
<table id="table1">
<!-- The rest of the table markup -->
</table>
</wicket:container>