JorisKimpe
Nieuwe gebruiker
- Lid geworden
- 25 aug 2008
- Berichten
- 2
Dag allemaal,
ik heb een popup met een nested div. Ik wil de div "startOrder" gebruiken als popup, en dit lukt mij door te werken met visibility voor "outerdiv" en "startOrder" div.
De nested div (selectedBarCodes) mag enkel getoond worden als ik meerdere items wil toevoegen. Dit mag dus enkel getoond worden als ik de button startOrdersBtn gebruik. Als ik op startOrderBtn klik, zou deze div niet getoond mogen worden.
Ik slaag er niet in om dit te doen, kan iemand mij hierbij helpen?
Bedankt!
Dit is mijn code:
<html:html xhtml="true">
<head>
<title>.../title>
<script language="javascript" type="text/javascript">
//<![CDATA[
var bgColor;
var filter;
var opacity;
function setVisible(obj, value)
{
obj = document.getElementById(obj);
obj.style.visibility = (value == '1') ? 'hidden' : 'visible';
}
function setVisible(obj)
{
obj = document.getElementById(obj);
if(obj != null) {
// Get original backgroundColor
if(obj.style.visibility != 'visible') {
bgColor = document.getElementById('outerDiv').style.backgroundColor;
filter = document.getElementById('outerDiv').style.filter;
opacity = document.getElementById('outerDiv').style.opacity;
document.getElementById('outerDiv').style.backgroundColor = "#303030";
document.getElementById('outerDiv').style.filter = "alpha(opacity=60)";
document.getElementById('outerDiv').style.opacity = "0.6";
obj.style.filter = filter;
obj.style.opacity = opacity;
} else {
document.getElementById('outerDiv').style.backgroundColor = bgColor;
document.getElementById('outerDiv').style.filter = filter;
document.getElementById('outerDiv').style.opacity = opacity;
}
// Enable or Disable buttons
var vis = (obj.style.visibility != 'visible') ? 'hidden' : 'visible';
document.getElementById('startOrderBtn').style.visibility = vis;
document.getElementById('startOrdersBtn').style.visibility = vis;
document.getElementById('endBtn').style.visibility = vis;
// show or hide popup
obj.style.visibility = (obj.style.visibility == 'visible') ? 'hidden' : 'visible';
}
}
function startOrder() {
setVisible('selectedBarCodes', '0');
setVisible('startOrder');
document.getElementById('startOrderBarCode').focus();
}
function startOrders() {
setVisible('selectedBarCodes', '1');
setVisible('startOrder');
document.getElementById('startOrderBarCode').focus();
}
//]]>
</script>
</head>
<body >
<div id="outerDiv" style="position:absolute; top:0px; left:0px; width:100%; height:100%;">
<table border="0" cellpadding="2" cellspacing="1" width="100%">
<tr>
<td colspan="3" align="center">
<input class="dataButton" id="startOrderBtn" type="button" value="startOrder" onclick="startOrder();">
<input class="dataButton" id="startOrdersBtn" type="button" value="startOrders" onclick="startOrders();">
</td>
</tr>
</table>
</div>
<div id="startOrder" class="popup" >
<table width="100%">
...
<div id="selectedBarCodes">
<tr>
<td colspan="2">
...
</td>
</tr>
</div>
...
</table>
</div>
</body>
</html:html>
ik heb een popup met een nested div. Ik wil de div "startOrder" gebruiken als popup, en dit lukt mij door te werken met visibility voor "outerdiv" en "startOrder" div.
De nested div (selectedBarCodes) mag enkel getoond worden als ik meerdere items wil toevoegen. Dit mag dus enkel getoond worden als ik de button startOrdersBtn gebruik. Als ik op startOrderBtn klik, zou deze div niet getoond mogen worden.
Ik slaag er niet in om dit te doen, kan iemand mij hierbij helpen?
Bedankt!
Dit is mijn code:
<html:html xhtml="true">
<head>
<title>.../title>
<script language="javascript" type="text/javascript">
//<![CDATA[
var bgColor;
var filter;
var opacity;
function setVisible(obj, value)
{
obj = document.getElementById(obj);
obj.style.visibility = (value == '1') ? 'hidden' : 'visible';
}
function setVisible(obj)
{
obj = document.getElementById(obj);
if(obj != null) {
// Get original backgroundColor
if(obj.style.visibility != 'visible') {
bgColor = document.getElementById('outerDiv').style.backgroundColor;
filter = document.getElementById('outerDiv').style.filter;
opacity = document.getElementById('outerDiv').style.opacity;
document.getElementById('outerDiv').style.backgroundColor = "#303030";
document.getElementById('outerDiv').style.filter = "alpha(opacity=60)";
document.getElementById('outerDiv').style.opacity = "0.6";
obj.style.filter = filter;
obj.style.opacity = opacity;
} else {
document.getElementById('outerDiv').style.backgroundColor = bgColor;
document.getElementById('outerDiv').style.filter = filter;
document.getElementById('outerDiv').style.opacity = opacity;
}
// Enable or Disable buttons
var vis = (obj.style.visibility != 'visible') ? 'hidden' : 'visible';
document.getElementById('startOrderBtn').style.visibility = vis;
document.getElementById('startOrdersBtn').style.visibility = vis;
document.getElementById('endBtn').style.visibility = vis;
// show or hide popup
obj.style.visibility = (obj.style.visibility == 'visible') ? 'hidden' : 'visible';
}
}
function startOrder() {
setVisible('selectedBarCodes', '0');
setVisible('startOrder');
document.getElementById('startOrderBarCode').focus();
}
function startOrders() {
setVisible('selectedBarCodes', '1');
setVisible('startOrder');
document.getElementById('startOrderBarCode').focus();
}
//]]>
</script>
</head>
<body >
<div id="outerDiv" style="position:absolute; top:0px; left:0px; width:100%; height:100%;">
<table border="0" cellpadding="2" cellspacing="1" width="100%">
<tr>
<td colspan="3" align="center">
<input class="dataButton" id="startOrderBtn" type="button" value="startOrder" onclick="startOrder();">
<input class="dataButton" id="startOrdersBtn" type="button" value="startOrders" onclick="startOrders();">
</td>
</tr>
</table>
</div>
<div id="startOrder" class="popup" >
<table width="100%">
...
<div id="selectedBarCodes">
<tr>
<td colspan="2">
...
</td>
</tr>
</div>
...
</table>
</div>
</body>
</html:html>