如何使用 js 从 java 列表中检索数据

Question

我想从列表中获取数据并检索到弹出窗口。当我使用 getElementById 时，它只会从另一个输入中获取一个 ID。不是我想要的列表。所以，我想到了使用数组的想法。但我不知道如何。我正在使用 Java Play Framework

这是我的代码..

display.html

<script>  

function openModifySchedule(staffId) {

if (!checkRequiredField()) {
alert("There Is Error(s) In The Form. Please Fix It Before Proceed.");
return;
}

var staffId = document.getElementById("staffId").value;

if (staffId == "") {
alert("Please Select Doctor Before Proceed");
return;
}

var url = "/DoctorSchedules/modifySchedulePopup?staffId=" + staffId;

mywindow = window.open(url,"mywindow","location=no,resizable=1,width=700,height=650,menubar=no,center=yes");
mywindow.moveTo(420,100);

}
</script>

 <input type="hidden" id="staffId" name="staffDetails.staffId"  value="${staffDetails?.staffId}">

<tbody>
    #{list items:staffScheduleList , as:'stffSchedule'} 
        <tr id="list" align="center">
            <td></td>
            <td id="scheduleDate">${stffSchedule.scheduleDate}</td>
            <td id="staffId"><a onClick="openModifySchedule()" href="#">${stffSchedule.staffId}</a></td>
            <td id="staffName">${stffSchedule.staffName}</td>
            <td id="deptName">${stffSchedule.deptName}</td>
            <td></td>
            <td></td>
            <td></td>
            <td id="contactNo">${stffSchedule.contactNo}</td>
        </tr>
    #{/list}
</tbody>

这里是控制器中的函数..

display.java

 public static void modifySchedulePopup(String staffId){

    StaffDetails staffDetails = StaffDetails.find("byStaffId", staffId).first();

    StaffSchedule staffSchedules = StaffSchedule.find("byStaffId", staffId).first();

    renderTemplate("DoctorSchedules/doctorScheduleModifyPopup.html", staffDetails,staffSchedules);

}

希望有人能解释一下。

Answer 1

在DOM中，任何两个元素都不能有相同的id属性。由于 table 中的所有 "td" 元素都有 id="staffId"，getElementById() 可以免费 return 其中任何一个。

自玩！带有 JQuery，你可能会很好地使用它而不是直接使用 JavaScript（它更容易）。简而言之，您将相同的 "click" 事件处理程序附加到所有链接，单击事件处理程序知道哪个元素被单击。

下面是演示这一点的简单片段：

<script>
  $(function() {
    $(".staff-id").click(function() { // attach the click event handler
      var staffId = $(this).text();
      alert(staffId); // open your new window here
    });
  });
</script>

#{list items:staffScheduleList, as:'stffSchedule'} 
    <tr id="list" align="center">
        <td></td>
        <td>${stffSchedule.scheduleDate}</td>
        <td><a class="staff-id" href="#">${stffSchedule.staffId}</a></td>
        <td>${stffSchedule.staffName}</td>
        <td>${stffSchedule.deptName}</td>
        <td></td>
        <td></td>
        <td></td>
        <td id="contactNo">${stffSchedule.contactNo}</td>
    </tr>
#{/list}

如何使用 js 从 java 列表中检索数据

how to retrieve data from java listing using js

javascript

java

playframework

playframework-1.x