Javascript 需要将动态数据从JSP发送到sql server

使用Javascript将单元格动态添加到JSP页面。需要从单元格中收集数据并将数据发送到数据库。使用SpringMVC、hibernate和SpringForm标记

非常感谢任何解释这一点的文章

任何建议都会有帮助

javascript:

var i=0;
function addRow()
{
i++;
var tbl = document.getElementById('div1');
var lastRow = tbl.rows.length;
var iteration = lastRow - 1;
var row = tbl.insertRow(lastRow);

var firstCell = row.insertCell(0);
var el = document.createElement('input');
el.type = 'text';
el.name = 'hostName' + i;
el.id = 'hostName' + i;
el.size = 30;
el.maxlength = 200;
firstCell.appendChild(el);

var secondCell = row.insertCell(1);
var el2 = document.createElement('input');
el2.type = 'text';
el2.name = 'directory' + i;
el2.id = 'directory' + i;
el2.size = 30;
el2.maxlength = 200;
secondCell.appendChild(el2);

var thirdCell = row.insertCell(2);
var el3 = document.createElement('input');
el3.type = 'text';
el3.name = 'userName' + i;
el3.id = 'userName' + i;
el3.size = 20;
el3.maxlength = 20;
thirdCell.appendChild(el3);

var fourthCell = row.insertCell(3);
var el4 = document.createElement('input');
el4.type = 'text';
el4.name = 'password' + i;
el4.id = 'password' + i;
el4.size = 20;
el4.maxlength = 20;
fourthCell.appendChild(el4);
}


 function removeRowFromTable()
 {
 var tbl = document.getElementById('div1');
 var lastRow = tbl.rows.length;
 if (lastRow > 2) tbl.deleteRow(lastRow - 1);
 }
</script>`

var i=0；
函数addRow（）
{
i++；
var tbl=document.getElementById（'div1'）；
var lastRow=tbl.rows.length；
var迭代=最后一行-1；
变量行=tbl.insertRow（最后一行）；
var firstCell=row.insertCell（0）；
var el=document.createElement（'input'）；
el.type='text'；
el.name='hostName'+i；
el.id='hostName'+i；
el.size=30；
el.maxlength=200；
第一个细胞。追加子细胞（el）；
var secondCell=row.insertCell（1）；
var el2=document.createElement（'input'）；
el2.type='text'；
el2.name='目录'+i；
el2.id='目录'+i；
el2.2尺寸=30；
el2.maxlength=200；
第二细胞。附属物子细胞（el2）；
var thirdCell=行插入单元格（2）；
var el3=document.createElement（'input'）；
el3.type='text'；
el3.name='userName'+i；
el3.id='userName'+i；
el3.1尺寸=20；
el3.maxlength=20；
第三个细胞。附属物（el3）；
var fourthCell=行插入单元格（3）；
var el4=document.createElement（'input'）；
el4.type='text'；
el4.name='密码'+i；
el4.id=‘密码’+i；
el4.1尺寸=20；
el4.maxlength=20；
第四细胞。附属物（el4）；
}
函数removeRowFromTable（）
{
var tbl=document.getElementById（'div1'）；
var lastRow=tbl.rows.length；
如果（lastRow>2）tbl.deleteRow（lastRow-1）；
}
`

动态创建的单元格：

<tr><td colspan="4">
        <table id="div1" style="display:none">
            <tr><td>Host Name</td><td>Directory</td><td>User Name</td><td>Password</td></tr>
            <tr><td><input type="text" value="${events.hostName}" size="30" maxlength="200"/></td>
            <td><input type="text" value="${events.directory}" size="30" maxlength="200"/></td>
            <td><input type="text" value="${events.userName}" size="20" maxlength="20"/></td>
            <td><input type="text" value="${events.password}" size="20" maxlength="20"/></td></tr>
        </table>
            </td></tr>
            <tr id="i1" style="display:none"><td><input type="button" onclick="addRow()" value="+"/>
            <input type="button" onclick="removeRowFromTable();" value="-" />
            </td></tr>

主机名目录用户名密码

由于您没有使用javascript向服务器发出ajax请求，而只是生成html内容，因此从服务器端的角度来看，它与您通常使用的Spring MVC或Spring表单没有什么不同

您可以将程序流程想象为： 当向服务器发送请求时，服务器可以响应请求的资源。在您的例子中，它是带有javascript代码的html页面。javascript代码在客户端执行。它修改html标记。对于您的情况，您只需要确保生成的html表单将以Spring控制器将要处理的任何方式向服务器创建有效的请求。换言之，您可以尝试在不使用javascript的情况下创建可行的解决方案。然后用javascript替换静态组件

如果您不熟悉Spring MVC或Hibernate，网上有很多教程：

---

希望有帮助

您能详细说明一下吗？我不知道你有什么困难哦..我不好..我从来没有使用动态数据发送到数据库..所以我需要一些输入来实现它？@KhueVu用户输入了什么值，我需要将它们发送到数据库并保存它们，如果用户单击“-”按钮，它应该从数据库中删除。。。