java - 单击 html 表行的编辑链接以填充 EditDATA_form 字段。表数据由 servlet 对 jsp 的响应填充

Question

我想用这样填充的表格行数据填充表单字段

  <table  class="data-table" border="1">
        <tr>
        <td>Student ID</td>
        <td>First Name</td>
        <td>Last Name</td>
        <td>Year Level</td>
        </tr>

        <c:forEach items="${allStudents}" var="stud">
            <tr>
                <td>${stud.studentId}</td>
                <td>${stud.firstname}</td>
                <td>${stud.lastname}</td>
                <td>${stud.yearLevel}</td>
                <td><a href='javascript:void(0);' class='edit_doc'>Edit</a></td>
            </tr>
        </c:forEach>
            </table>

现在我想编写 Jquery(这对我来说是全新的)。我已经经历了很多例子并询问了同样的问题。但是 jquery 对我不起作用。任何人都可以告诉在脚本标签中写什么吗？如果可能的话也请分享代码。

//jsp上的表单

   <form name="frm" class="data-form" action="./StudentServlet" method="POST" onSubmit="return validateForm()">
            <tr>
                <td><strong>Student ID --></strong><input type="text" class='input1'  name="studentId" value="${student.studentId}" /> </td>
                <td><strong>First Name --></strong><input type="text" class='input2' name="firstname" value="${student.firstname}" /> </td>
                <td><strong>Last Name --></strong> <input type="text" class='input3' name="lastname" value="${student.lastname}" /> </td>
                <td><strong>Year Level --></strong><input type="text" class='input4' name="yearLevel" value="${student.yearLevel}" /> </td>
            </tr>   
      </form>

//脚本

//what goes here

Answer 1

目的所需的js代码并不复杂。

尝试在脚本中添加这些，

       $(document).ready(function () {
$("td", this).on("click", function () {
    var tds = $(this).parents("tr").find("td");
    $.each(tds, function (i, v) {
        $($(".data-form input")[i]).val($(v).text());
    });
});
});

此外，您的表单恰好位于表格标签中。将其从表格标签中取出。唯一保留在表格标签中的就是您的表格。