Home/ Questions/Q 9002113
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-16T00:31:35+00:00

my question is that i want to hide my delete button initially, and as

  • 0

my question is that i want to hide my delete button initially, and as when user mark on checkbox
the delete button keep going on showing up until all the checkbox are not unmarked

this is how i try to do this, the problem i faced when i unmarked the one checkbox my delete button is vanished though my rest of checkbox is marked 

    <%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@page
    import="com.nousinfo.tutorial.employee.service.model.bo.EmployeeBO"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<link rel="stylesheet" href="css/style.css" type="text/css"></link>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">


<title>Home</title>

<script type="text/javascript">
    function windowLoadByName(windowHeight, windowWidth) {
        var centerWidth = (window.screen.width - windowWidth) / 2;
        var centerHeight = (window.screen.height - windowHeight) / 2;

        newWindow = window.open(
                'PopUp.jsp',
                'mywindow',
                'resizable=0,width=' + windowWidth + ',height=' + windowHeight
                        + ',left=' + centerWidth + ',top=' + centerHeight,
                "status=1").divHiding(1);
        newWindow.focus();

    }
    function windowLoadById(windowHeight, windowWidth) {
        var centerWidth = (window.screen.width - windowWidth) / 2;
        var centerHeight = (window.screen.height - windowHeight) / 2;
        newWindow = window.open(
                'PopUp.jsp',
                'mywindow',
                'resizable=0,width=' + windowWidth + ',height=' + windowHeight
                        + ',left=' + centerWidth + ',top=' + centerHeight)
                .divHiding(2);

        newWindow.focus();
        return newWindow.name;
    }

    function loadName(name) {

        this.firstName = name;
        window.location = 'http://localhost:8080/EmployeeWeb/GetEmployee?key1='
                + encodeURIComponent(firstName);

    }
    function loadId(id) {

        this.id = id;

        window.location = 'http://localhost:8080/EmployeeWeb/GetEmployee?key2='
                + encodeURIComponent(id);

    }

    function showMe (it, box) { 
      var vis = (box.checked) ? "block" : "none"; 
      document.getElementById(it).style.display = vis;
    } 


</script>

</head>

<body background="transparent">


    <table width="951" height="116" border="0" align="center">
        <tr>
            <td width="661" height="112" bgcolor="#D1D1FF"><font size="6">EmployeeManagement</font>
            </td>
            <td width="266" height="112" align="center" bgcolor="#FFFFFF"><img
                src="image/nous.jpg" alt="1" width="266" height="84" /></td>
        </tr>
    </table>
    <p>&nbsp;</p>


    <table width="949" height="183" border="0" align="center">
        <tr>
            <td height="42" align="center" bgcolor="#3366FF"><strong>Find
                    Employee </strong></td>
        </tr>

        <tr>
            <td width="943" height="43"><input id="findid" name="button"
                type="submit" value="Find_Employee_By_ID"
                onClick="windowLoadById(250,500)" /></td>
        </tr>
        <tr>

            <td height="43"><input id="findname" name="submit2"
                type="button" value="Find_Employee_By_Name"
                onClick="windowLoadByName(250,500)" /></td>
        </tr>
        <tr>
            <td><form id="form2" action="GetEmployee">
                    <input type="submit" name="submit3" value="Get_All_Employee" />
                </form></td>
        </tr>
        <tr>
            <td><form id="form2" action="CreateEmployee.jsp">
                    <input type="submit" name="create" value="CreateEmployee" />
                </form></td>
        </tr>


    </table>

    <p>&nbsp;</p>
    <br>
    <br>
    <div id="div12">
        <form action="UpdateEmployeeServlet">
            <table width="725" border="1" align="center" cellpadding="5"
                cellspacing="5">
                <tr>
                    <th width="118">check</th>
                    <th width="118">EmployeeNumber</th>
                    <th width="118">First Name</th>
                    <th width="118">Last Name</th>
                    <th width="118">Title</th>
                    <th width="118">Address1</th>
                    <th width="118">Address2</th>
                    <th width="118">City</th>
                    <th width="118">Detail
                    <th>
                </tr>
                <c:forEach var="employeeBO" items="${listemployeeBo}">
                    <tr>
                        <td><input type="checkbox" value='${employeeBO.empNumber}'
                            name="checked" onclick="showMe('div1',this)"></td>
                        <td>${employeeBO.empNumber}</td>

                        <td>${employeeBO.firstName}</td>

                        <td>${employeeBO.lastName}</td>

                        <td>${employeeBO.title}</td>

                        <td>${employeeBO.address1}</td>

                        <td>${employeeBO.address2}</td>

                        <td>${employeeBO.city}</td>



                        <td><a href="javascript:loadId(${employeeBO.empNumber})">Details</a></td>

                    </tr>
                </c:forEach>

            </table>
            <div id="div1" style="display:none;">
                <table>

                    <tr>

                        <td><input type="hidden" name="updateStatusDelete" value="D" />
                            <input type="submit" name="delete" value="Delete" /></td>
                    </tr>
                </table>
            </div>
        </form>
    </div>
</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Replace your showMe function with this:

    // box is not needed now, it checks all checkboxes to see
// if any one of them is checked
function showMe(it, box) {
    var hasChecked = false;
    var chks = document.getElementsByName('checked');
    var vis = '';

    for ( var i = 0; i < chks.length; i++ ) {
        if ( chks[ i ].checked ) {
            hasChecked = true;
            break;
        }
    }

    if ( hasChecked == false ) {
        vis = "none";
    } else {
        vis = "block";
    }

    document.getElementById( it ).style.display = vis;
}

    Hope it helps.

    • 0