Hi, I want to hide a "div" with a <h:commandButton/> object. But every time I click the button it seems like the div is hidden and shown again. I tried to do this
with _javascript_ but I couldn't. Is it possible to do this with jakarta library without _javascript_?
The codes are below. Could you check the codes and report the error?
_javascript_ Code:
function menuGizleGoster() {
var menuid = document.getElementById("solDiv")
if (menuid.style.display === "none") {
menuid.style.display = "";
} else {
menuid.style.display = "none";
}
}
Xhtml Code:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
<h:outputScript name="/js/script.js"/>
<title>Header Page</title>
</h:head>
<h:body>
<h:form>
<h:commandBacutton id="menuButton" value="Menü" _onclick_="menuGizleGoster()"/>
<div id="solDiv" style="background-color: #121e2d; color: #ffffff;
font-family: Verdana; font-size: 12px;
margin: 0px; padding: 10px;">
<h:outputText value="Sol"/>
</div>
<div id="SagDiv" style="background-color: #121e2d; color: #ffffff;
font-family: Verdana; font-size: 12px;
margin: 0px; padding: 10px;">
<h:outputText value="Sağ"/>
</div>
<div id="ortaDiv" style="background-color: #121e2d; color: #ffffff;
text-align: center; font-family: Verdana; font-size: 12px;
margin: 0px; padding: 20px 10px 0px 10px;">
<h:outputText value="BİLİŞİM UYGULAMASI"/>
</div>
</h:form>
</h:body>
</html>
Mehmet Fatih ÇİN
