2016-01-03 5 views
0

Я создаю приложение, которое может динамически добавлять строки на мою страницу html/jsp, и при нажатии кнопки submit данные будут сохранены в базе данных. Я использую javascript для динамического добавления строк. Когда я ввожу данные и нажимаю submit, мой атрибут modelAttribute не привязывается к полям на странице формы. Чтобы исключить исключение класса Index из связанного исключения, используйте список автопопуляции. Ниже страница формы будет оцененSpring AutoPopulationList не привязывается к modelAttribute

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
    pageEncoding="ISO-8859-1"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 

<HTML> 
<HEAD> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" 
<title>Add/Remove dynamic rows</title> 
<SCRIPT lang="javascript"> 
     function addRow(tableID) 
     { 
       var table = document.getElementById(tableID); 

       var rowCount = table.rows.length; 
       var row = table.insertRow(rowCount); 
       var counts = rowCount - 1; 

       var cell1 = row.insertCell(0); 
       var ldap = document.createElement("input"); 
       ldap.type = "text"; 
       ldap.id="incident"+counts+".ldap" 
       ldap.name = "incident[" + counts + "].ldap"; 
       cell0.appendChild(ldap); 

       var cell2 = row.insertCell(1); 
       var ticket = document.createElement("input"); 
       ticket.type = "text"; 
       ticket.id = "incident"+ counts +".ticket"; 
       ticket.name = "incident[" + counts + "].ticket"; 
       cell2.appendChild(ticket); 

       var cell3 = row.insertCell(2); 
       var status = document.createElement("select"); 
       status.type = "text"; 
       status.id = "incident"+ counts +".status"; 
       status.name = "incident[" + counts + "].status"; 
       var opt=document.createElement("option"); 
       opt.text="Pending"; 
       opt.value="Pending"; 
       status.options.add(opt); 
       var opt=document.createElement("option"); 
       opt.text="Completed"; 
       opt.value="Completed"; 
       status.options.add(opt); 
       cell3.appendChild(status); 


       var cell4 = row.insertCell(3); 
       var comment = document.createElement("input"); 
       comment.type = "text"; 
       comment.id = "incident"+ counts +".comment 
       comment.name = "incident[" + counts + "].comment"; 
       cell4.appendChild(comment); 

       var cell5=row.insertCell(4); 
       var time=document.createElement("input"); 
       time.type="date"; 
       time.id="incident"+ counts +".time"; 
       time.name="incident["+ counts +"].time"; 
       cell5.appendChild(time); 

       var cell6=row.insertCell(5); 
       var time=document.createElement("input"); 
       effort.type="text"; 
       effort.name="incident["+ counts +"].effort"; 
       cell6.appendChild(effort); 


     } 
</SCRIPT> 
</HEAD> 
<BODY> 
<div align="center" style="border:1px solid black"> 
<h>AGILE</h> 
</div> 


<form action="saveIncident" modelAttribute="incidentList" method="post"> 
<div align="center"> 
<TABLE id="incidentTable"> 
     <TR> 
       <TD>Ldap</TD> 
       <TD>Ticket No</TD> 
       <TD>Status</TD> 
       <TD>Comment</TD> 
       <TD>Date</TD> 
       <TD>Effort</TD> 

     </TR> 
     <TR> 
       <TD><input type="text" id="incident0.ldap" name="incident[0].ldap"/></TD> 
       <TD><INPUT type="text" id="incident0.ticket" name="iincident[0].ticket" /></TD> 
       <TD><select name="incident[0].status" id="ncident0.status"> 
       <option value="Pending">Pending</option> 
       <option value=Completed">Completed</option> 
       </select></TD> 
       <TD><INPUT type="text" id="incident0.comment" name="incident[0].comment" /></TD> 
       <TD><input type="date" id="incident0.time" name="incident[0].time"/></TD> 
       <TD><INPUT type="text" id="incident0.effort" name="incident[0].effort" /></TD> 


     </TR> 
</TABLE> 
<INPUT type="button" value="Add Row" onclick="addRow('incidentTable')" /> 
<input type="submit" value="SUBMIT" /> 
</div> 
</form> 
</BODY> 
</HTML> 


Below is the controller: 
package com.syed.agile; 

import org.springframework.beans.factory.annotation.Autowired; 
import org.springframework.stereotype.Controller; 
import org.springframework.util.AutoPopulatingList; 
import org.springframework.web.bind.annotation.ModelAttribute; 
import org.springframework.web.bind.annotation.RequestMapping; 
import org.springframework.web.bind.annotation.RequestMethod; 
import org.springframework.web.servlet.ModelAndView; 
@Controller 
public class HomeController { 
    @Autowired 
    private EmpIncidentDao empIncidentDao; 
    @RequestMapping(value={"/"}) 
    public ModelAndView newIncident(ModelAndView model) 
    { 
     //IncidentList incidentList=new IncidentList(); 
     //model.addObject("incidentList",incidentList); 
     model.setViewName("/index"); 
     return model; 

    } 
    @RequestMapping(value="/newIncident") 
    public ModelAndView newIncident1(ModelAndView model) 
    { 
     IncidentForm incidentList=new IncidentForm(); 
     incidentList.setIncidentForm(new AutoPopulatingList(Incident.class)); 
     model.addObject("incidentList",incidentList); 
     model.setViewName("/Incident"); 
     return model; 

    } 

    @RequestMapping(value="/saveIncident", method=RequestMethod.POST) 
    public ModelAndView saveIncident(@ModelAttribute() IncidentForm incidentList) 
    { System.out.println("In Controller"); 
     empIncidentDao.saveOrUpdate(incidentList); 
     return new ModelAndView("redirect:/"); 

    } 

} 

Anyhelp на этом.

ответ

0

У вас были опечатки, попробуйте сейчас и помните, что на стороне сервера вы получаете ключи-значения для каждой ячейки таблицы, поэтому, скорее всего, потребуется соответствующая обработка.

EDIT: Это обусловленно ваш IncidentForm оставляет желать desidered, как я уже говорил вам иметь в виду, что:

на стороне сервера вы получаете ключи-значения для каждой ячейки таблицы, так скорее всего, потребуется соответствующая обработка.

Если вы получаете исключение, это означает, что вы должны исправить то, как вы обрабатываете эти значения ключей.

<HTML> 
<HEAD> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" 
<title>Add/Remove dynamic rows</title> 
<SCRIPT lang="javascript"> 
     function addRow(tableID) 
     { 
       var table = document.getElementById(tableID); 

       var rowCount = table.rows.length; 
       var row = table.insertRow(rowCount); 
       var counts = rowCount - 1; 

       var cell1 = row.insertCell(0); 
       var ldap = document.createElement("input"); 
       ldap.type = "text"; 
       ldap.id="incident"+counts+".ldap" 
       ldap.name = "incident[" + counts + "].ldap"; 
       cell1.appendChild(ldap); 

       var cell2 = row.insertCell(1); 
       var ticket = document.createElement("input"); 
       ticket.type = "text"; 
       ticket.id = "incident"+ counts +".ticket"; 
       ticket.name = "incident[" + counts + "].ticket"; 
       cell2.appendChild(ticket); 

       var cell3 = row.insertCell(2); 
       var status = document.createElement("select"); 
       status.type = "text"; 
       status.id = "incident"+ counts +".status"; 
       status.name = "incident[" + counts + "].status"; 
       var opt=document.createElement("option"); 
       opt.text="Pending"; 
       opt.value="Pending"; 
       status.options.add(opt); 
       var opt=document.createElement("option"); 
       opt.text="Completed"; 
       opt.value="Completed"; 
       status.options.add(opt); 
       cell3.appendChild(status); 

       var cell4 = row.insertCell(3); 
       var comment = document.createElement("input"); 
       comment.type = "text"; 
       comment.id = "incident"+ counts +".comment"; 
       comment.name = "incident[" + counts + "].comment"; 
       cell4.appendChild(comment); 

       var cell5=row.insertCell(4); 
       var time=document.createElement("input"); 
       time.type="date"; 
       time.id="incident"+ counts +".time"; 
       time.name="incident["+ counts +"].time"; 
       cell5.appendChild(time); 

       var cell6=row.insertCell(5); 
       var effort=document.createElement("input"); 
       effort.type="text"; 
       effort.id ="incident["+ counts +"].effort"; 
       effort.name = "incident["+ counts +"].effort"; 
       cell6.appendChild(effort); 


     } 
</SCRIPT> 
</HEAD> 
<BODY> 
<div align="center" style="border:1px solid black"> 
<h2>AGILE</h2> 
</div> 


<form action="saveIncident" modelAttribute="incidentList" method="post"> 
<div align="center"> 
<TABLE id="incidentTable"> 
     <TR> 
       <TD>Ldap</TD> 
       <TD>Ticket No</TD> 
       <TD>Status</TD> 
       <TD>Comment</TD> 
       <TD>Date</TD> 
       <TD>Effort</TD> 

     </TR> 
     <TR> 
       <TD><input type="text" id="incident0.ldap" name="incident[0].ldap"/></TD> 
       <TD><INPUT type="text" id="incident0.ticket" name="iincident[0].ticket" /></TD> 
       <TD><select name="incident[0].status" id="ncident0.status"> 
       <option value="Pending">Pending</option> 
       <option value=Completed">Completed</option> 
       </select></TD> 
       <TD><INPUT type="text" id="incident0.comment" name="incident[0].comment" /></TD> 
       <TD><input type="date" id="incident0.time" name="incident[0].time"/></TD> 
       <TD><INPUT type="text" id="incident0.effort" name="incident[0].effort" /></TD> 


     </TR> 
</TABLE> 
<INPUT type="button" value="Add Row" onclick="addRow('incidentTable')" /> 
<input type="submit" value="SUBMIT" /> 
</div> 
</form> 
</BODY> 
</HTML> 
+0

я исправил опечатки, но при выполнении приложения я получаю java.lang.NullPointerException, – user5714826

+0

см редактирования. – GionJh