如何在新的弹出窗口中访问和显示数据库中的详细信息？

时间：2018-11-27 05:53:47

标签： javascript java html ajax java-ee

在我的门户中，我需要在主页上提供搜索按钮，以便用户可以搜索组织中的任何资产。我的代码无法正常工作。传递资产主机名后，如果资产不存在，则显示“找不到资产”，但如果存在，则显示在刷新页面之前搜索的最后资产的详细信息。我在控制器中设置属性，并尝试在新窗口中使用Jstl显示详细信息。简而言之，搜索后，我必须刷新页面，然后再次搜索以查看详细信息。我了解我面临此问题，因为我正在设置属性，但不知道如何克服此问题。

Assetdetails.jsp 

<%@ 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"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet"
	href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"
	integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ"
	crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"
	integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n"
	crossorigin="anonymous"></script>
<script
	src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"
	integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb"
	crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css?family=Open+Sans"
	rel="stylesheet">
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css"
	rel="stylesheet">
<style type="text/css">
</style>


</head>

<body>
	<%-- ${DIsplayAssetObject}	 --%>


	<c:if
		test="${DIsplayAssetObject['class'] == 'class model.Asset_View_Assigned'}">
		
		<h5>This Asset has been assigned to user.</h5>
		<br>
		<ul>
			<li><span style="font-weight: bold"> AssetID: </span>${DIsplayAssetObject.assetID}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetSerial: </span>${DIsplayAssetObject.assetSerial}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetType: </span>${DIsplayAssetObject.assetType}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetModel: </span>${DIsplayAssetObject.assetModel}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetOwner: </span>${DIsplayAssetObject.assetOwner}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> Workstation: </span>${DIsplayAssetObject.workstation}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> Building: </span>${DIsplayAssetObject.building}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> ODC: </span>${DIsplayAssetObject.ODC}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> OS: </span>${DIsplayAssetObject.OS}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> DomainName: </span>${DIsplayAssetObject.domainName}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> Project: </span>${DIsplayAssetObject.project}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> Location: </span>${DIsplayAssetObject.location}</li>
		</ul>
	</c:if>

	

	<c:if
		test="${DIsplayAssetObject['class'] == 'class model.Asset_View_BuildingStock'}">
		
		<h5>This Asset has been assigned to building.</h5>
		<br>
		<ul>
			<li><span style="font-weight: bold"> AssetID: </span>${DIsplayAssetObject.assetID}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetSerial: </span>${DIsplayAssetObject.assetSerial}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetType: </span>${DIsplayAssetObject.assetType}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetModel: </span>${DIsplayAssetObject.assetModel}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> Building: </span>${DIsplayAssetObject.building}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> Location: </span>${DIsplayAssetObject.location}</li>
		</ul>
	</c:if>
	
	<c:if
		test="${DIsplayAssetObject['class'] == 'class model.Asset'}">
		
		<h5>This Asset is with Asset Team.</h5>
		<br>
		<ul>
			<li><span style="font-weight: bold"> AssetID: </span>${DIsplayAssetObject.assetID}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetSerial: </span>${DIsplayAssetObject.assetSerial}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetType: </span>${DIsplayAssetObject.assetType}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> AssetModel: </span>${DIsplayAssetObject.assetModel}</li>
		</ul>
		<ul>
			<li><span style="font-weight: bold"> Location: </span>${DIsplayAssetObject.location}</li>
		</ul>
	</c:if>

</body>
</html>

主页 

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>ASSET OWNER HOME</title>
<link rel="stylesheet"
	href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"
	integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ"
	crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"
	integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n"
	crossorigin="anonymous"></script>
<script
	src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"
	integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb"
	crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css?family=Open+Sans"
	rel="stylesheet">
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css"
	rel="stylesheet">
<style type="text/css">


.jumbotron {
	padding-left:30% !important;
    padding-right:30% !important;
    margin-left:20% !important;
/*  	background-position: center;
  	width: 30% !important;*/
	opacity: 1;
}

.card-columns {
	/* padding-left:20% !important;
    padding-right:20% !important; */
    margin-left:44% !important;
	width: 100% !important;
	height: 0% !important; 
	opacity: 1;
/* 	background-position: center;
 */	
}
/*  .layer {
    background-color: black;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
} */

.modal-body {
  height: 600px;
  overflow: auto;
}


.modal-backdrop {
background-color: #424530;
}

.modal-backdrop.fade.in
{
opacity: .8; 
}

</style>
<script>
   $(document).ready(function(){
	  //alert("ready");
        $("#messageTable").hide();
         $("#viewmodal").hide();
         $("#viewmodel2").hide();

   }); 
  
  
   
   
  
       function CheckAsset(inputString) {
    	
        if (inputString.length == 0) {
            document.getElementById("message").innerHTML = "";
            return;
        }
        try {
            if (window.XMLHttpRequest)
                xmlHttp = new XMLHttpRequest();
            else if (window.ActiveXObject)
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            if (!xmlHttp || xmlHttp == null) {
                return;
            }
            var url = "Ajax?Ajax=jumbotronAssetdetails&assetID=" + inputString; 
           // var url = "Ajax?Ajax=Check_AssetId_Asset&Assetid=" + inputString;
            //alert(url);
            xmlHttp.onreadystatechange = StateChanged;
            //alert(url);
            xmlHttp.open("GET", url, true);
            xmlHttp.send(null);
        } catch (e) {
            document.getElementById("message").innerHTML = "An error occured";
        }
    }
       
       
    function StateChanged() {
    	
        if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) {
        	var response= xmlHttp.responseText;
        	response=response.trim();
        	
        	if(response == "false")
        		{
        		   document.getElementById("message").innerHTML = "Asset doesnot exist";
        		   $("#messageTable").show();

        		}
        	 else
        		{ 
        		 
        		  
      		   $("#messageTable").hide();
      		 document.getElementById("viewmodal").click();

        	    } 
        }
    } 
    
    

   
    
</script>

</head>
<body onload="NewAssettoDisplayAO()">
	<jsp:include page="NavAO.jsp" />
	
				
	
	<div class="container" style="margin: 100px 10px 10px 20px;">.
	<br>
		<h3 style="color: black;">Welcome Asset Owner.</h3>
		<br>
			<div class="card-columns">
				<div class="card bg-success">
					<div class="card-body text-center">
					<p class="card-text">
						<strong>New Assets Requests</strong>
					</p>
					<p class="card-text" id="NewAssettoDisplayAOCount"></p>
					</div>
				</div>
			</div>
			
			
			
		<div class="jumbotron jumbotron-fluid">
		
			<div class="form-inline justify-content-center">
				<div class="form-group mx-sm-3 mb-2">
					<input type="text" class="form-control" style="width: 350px;"
						id="assetID" placeholder="Hostname">
				</div>
				<button type="button" id="show" class="btn btn-success btn-sm mb-2"
					onClick="CheckAsset(assetID.value)">SEARCH</button>
					
					
			</div>
						


			 <div id="messageTable">
				<div class="form-row form-inline justify-content-center">
					<div id="message"
						style="margin-left: 0px; color: green;"></div>
				</div>
				
				
				
			</div>
			 
			
			
		</div >
		
		<div class="row" id="model">

<!-- Button trigger modal -->
<button class="btn btn-primary btn-sm mb-2" data-toggle="modal" data-target="#myModal" id="viewmodal">
View</button>

<!-- Modal -->
<div class="modal 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>
        <h4 class="modal-title" id="myModalLabel"><center>Asset Details</center></h4>
      </div>

<div class="modal-body">
        <iframe src="AssetDetails.jsp" id="info" class="iframe" name="info" seamless="" height="100%" width="100%"></iframe>
      </div>

    </div>
  </div>
</div> <!-- /#myModal -->

<br><br><br><br><br>

    

	</div>  <!-- /.row -->
		
		
	</div>
	
	<script type="text/javascript">
	 var xmlHttp;
    
	
    function NewAssettoDisplayAO() {
    
        try {
            if (window.XMLHttpRequest)
                xmlHttp = new XMLHttpRequest();
            else if (window.ActiveXObject)
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            if (!xmlHttp || xmlHttp == null) {
                return;
            }
            var url = "Ajax?Ajax=NewAssettoDisplayAOCount"; 
            xmlHttp.onreadystatechange = StateChanged1;
            xmlHttp.open("GET", url, true);
            xmlHttp.send(null);
        } catch (e) {
            document.getElementById("NewAssettoDisplayAOCount").innerHTML = "An error occured";
        }
    }
    
  
	function StateChanged1() {
    	
        if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) {
	        document.getElementById("NewAssettoDisplayAOCount").innerHTML = xmlHttp.responseText;
        }
    }
	</script>
</body>
</html>

0 个答案:

没有答案
相关问题
最新问题