2015-12-04 154 views
0

我有一个表的jsp页面。我在表格中有两个链接,用于编辑和删除。当我点击删除链接时,会弹出一个窗口,当我确认删除时,我需要将页面转移到其操作类。以下是代码的一部分。 jsp页面:传递值从链接弹出窗口

<%-- 
Document : newjsp1 
Created on : 4 Dec, 2015, 9:49:07 AM 
Author  : najee 
--%> 

<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>JSP Page</title> 
</head> 
<body> 

    <%-- other codes here --%> 
    <table class="table"> 
     <thead> 
      <tr> 
       <th> Employee ID </th> 
       <th> First Name </th> 
       <th> Second Name </th> 
       <th> Date of Birth </th> 
       <th> Emirates Id </th> 
       <th> Type Of Employee </th> 
       <th style="width: 3.5em;"></th> 
      </tr> 
     </thead> 
     <s:iterator value="empco"> 

      <tr> 

       <td><s:property value="e_id"/></td> 
      <td><s:property value="fname"/></td> 
      <td><s:property value="sname"/></td> 
      <td><s:property value="birthdate"/></td> 
      <td><s:property value="emiratesid"/></td> 
      <td><s:property value="typeofemployee"/></td> 
      <td> 
      <s:url var="IdValue" action="EditStaffDetails"><s:param name="IdValue"><s:property value="e_id"/></s:param></s:url><a href="${IdValue}"><i class="fa fa-pencil"></i></a> 
      <a href="#myModal" role="button" data-toggle="modal"><i class="fa fa-trash-o" ></i></a> <%-- delete link --%> 
      </td> 
      </tr> 
     </s:iterator> 
    </table> 
    <%-- other codes here --%> 

    <div class="modal small fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
        <h3 id="myModalLabel">Delete Confirmation</h3> 
       </div> 
       <div class="modal-body"> 
        <p class="error-text"><i class="fa fa-warning modal-icon"></i>Are you sure you want to delete the user?<br>This cannot be undone.</p> 
       </div> 
       <div class="modal-footer"> 
        <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Cancel</button> 
        <form action="deleteEmployee" method="post">  
         <input type="hidden" name="employeeId" value="<s:property value="e_id"/>" /> 
           <input type="submit" value="Delete" name="Submit" /> 
        </form> 
       </div> 
      </div> 
     </div> 
    </div> 

<%-- other codes here --%> 

</body> 

我想从相应的列员工标识在弹出的窗口中输入框雇员传递值当我点击连续的删除链接。

感谢您的帮助!

+0

您正在使用哪个库显示模式弹出?它是一个引导还是其他的东西? – vijayP

+0

尝试通知js确认删除。 –

+0

@vijayP - 是的,它的引导 –

回答

0

放置在与id值触发模态的链路的属性data-id,结合点击事件到该连杆和所述数据传递到所述模态隐藏的输入

<table class="table"> 
    <thead> 
     <tr> 
      <th> Employee ID </th> 
      <th> First Name </th> 
      <th> Second Name </th> 
      <th> Date of Birth </th> 
      <th> Emirates Id </th> 
      <th> Type Of Employee </th> 
      <th style="width: 3.5em;"></th> 
     </tr> 
    </thead> 
    <s:iterator value="empco"> 

     <tr> 

      <td><s:property value="e_id"/></td> 
     <td><s:property value="fname"/></td> 
     <td><s:property value="sname"/></td> 
     <td><s:property value="birthdate"/></td> 
     <td><s:property value="emiratesid"/></td> 
     <td><s:property value="typeofemployee"/></td> 
     <td> 
     <s:url var="IdValue" action="EditStaffDetails"><s:param name="IdValue"><s:property value="e_id"/></s:param></s:url><a href="${IdValue}"><i class="fa fa-pencil"></i></a> 
     <a href="#myModal" data-id="${IdValue}" role="button" data-toggle="modal"><i class="fa fa-trash-o" ></i></a> <%-- delete link --%> 
     </td> 
     </tr> 
    </s:iterator> 
</table> 
<%-- other codes here --%> 

<div class="modal small fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
       <h3 id="myModalLabel">Delete Confirmation</h3> 
      </div> 
      <div class="modal-body"> 
       <p class="error-text"><i class="fa fa-warning modal-icon"></i>Are you sure you want to delete the user?<br>This cannot be undone.</p> 
      </div> 
      <div class="modal-footer"> 
       <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Cancel</button> 
       <form action="deleteEmployee" method="post">  
        <input type="hidden" name="employeeId" value="null" /> 

          <input type="submit" value="Delete" name="Submit" /> 
       </form> 
      </div> 
     </div> 
    </div> 
</div> 

JS:

$('a[href="#myModal"]').on('click',function(){ 
    var id = $(this).attr('data-id'); 
    $('input[name="employeeId"]').val(id); 
}); 

http://jsfiddle.net/ttdswa2e/

或:

$('#myModal').on('show.bs.modal',function(e){ 
     var id = $(e.relatedTarget).attr('data-id'); 
     $('input[name="employeeId"]').val(id); 
    }); 

http://jsfiddle.net/z9eqxhey/

+1

非常感谢你,madalin ivascu!有效。 :) –

相关问题