动态创建表并在jsp页面中返回它们的值

时间:2015-10-07 06:18:38

标签: javascript java html5 jsp

我正在使用jsp和html进行项目,其中我在addRow按钮单击中动态添加表中的行。添加行后,我得到jsp页面中所有行的值。但是由于jsp页面无法识别参数的名称,因此它没有将值返回到jsp页面 我使用以下代码。建议我被困在哪里。

HTML code:

<!doctype html>
<html lang="en">
    <head>
        <script language="javascript">
            function addRow(tableID) {
                var table = document.getElementById(tableID);
                var rowCount = table.rows.length;
                var row = table.insertRow(rowCount); 
                var cell0 = row.insertCell(0);
                var element1 = document.createElement("input");
                element1.type = "text";

                element1.name = "line"+(rowCount+1);
                element1.value=""+(rowCount+1);
                cell0.appendChild(element1);
                document.getElementById("countofrows").value=table.rows.length;
            }
        </script>
   </head>
   <body>
       <form name="" action="myjsp.jsp">
           <table  id="receiptTable">    
               <tr>
                   <td><input tye="text" name="line1" value="0"></td>
                   <input type="hidden" name="countofrows">
               </tr>
           </table>
           <table>
               <tr>
                   <input type="button" name="addrow" onClick="addRow('receiptTable')"      value="Add Line">
               </tr>
           </table>
       </form>
   </body>
</html>

以下是JSP scriptlet代码

<%
    int count=Integer.parseInt(request.getParameter("countofrows"));
    for(int i=1 ; i<=count ; i++;) {
        String value=request.getParameter("line"+i));
        out.println(" value here is"+value);
    }
%>

它对于默认行元素工作正常,但在添加行

时变为null

2 个答案:

答案 0 :(得分:0)

替换

<input type="hidden" name="countofrows">

<input type="hidden" name="countofrows" id="countofrows">

再试一次。

答案 1 :(得分:0)

这个怎么样

   <script language="javascript">
function addRow(tableID,theForm) 
{
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount); 
            var cell0 = row.insertCell(0);
            var element1 = document.createElement("input");
            element1.type = "text";

            element1.name = "line"+(rowCount+1);
            element1.value=""+(rowCount+1);
            cell0.appendChild(element1);
            theForm.countofrows.value=table.rows.length;
}
   </script>    
   <form name="" action="myjsp.jsp">
     <table id="receiptTable">
         <tr>
             <td>
                 <input tye="text" name="line1" value="0">
             </td>
             <input type="hidden" name="countofrows" id="countofrows" >
         </tr>
     </table>
     <table>
         <tr>
             <input type="button" name="addrow" onClick="addRow('receiptTable',this.form)" value="Add Line">
         </tr>
     </table>
 </form>