Hello, I'm building a database using SQL and PHP and I've started on the user interface first rather than the database queries and everything - a little backwards perhaps. I have a login button that disappears for some reason when I add in a function for my search button. Here's the code:
start.php
<?php
echo "
<html><head><link rel=\"stylesheet\" type=\"text/css\" href=\"http://localhost/Catalogue/html/css/test2.css\"><script src=\"http://localhost/Catalogue/javascripts/login.js\" language=\"JavaScript\"></script></head><body><div id=\"banner\"><span class=\"menuButton\">";
ini_set('session.cache_limiter','private');
session_start();
if(isset( $_SESSION['username'])){
$username = $_SESSION['username'];
if($username != "default"){
echo "<input type='button' name='logout' value='logout' onclick= \"window.location='http://localhost/Catalogue/php/logout.php';\">";;
}
}
else{
$_SESSION['username']="default";
$_SESSION['password']="password";
$_SESSION['hostname']="localhost";
$_SESSION['db']="bookcatalogue";
@mysql_connect($_SESSION['hostname'],$_SESSION['username'],$_SESSION['password']) or die("Access to db server denied");
@mysql_select_db($_SESSION['db']) or die("Access to library denied");
echo "<input type='button' name='Login' value='login' onclick= \"javascript:toggleLayer('loginBox');\">";
}
echo "</span></div>";
include 'C:\wamp\www\Catalogue\html\test2.html';
?>the html for test2.html is started in start.php because I needed the login button to change based on the user.
test2.html
<div id="searchbackground"><img src="http://localhost/Catalogue/images/startHere.png"/></div>
<div id="center">
<div id="content">
<div id="searchlogo"></div>
<h1>book<br>catalogue</h1>
<form name="search" method="POST" action ="\Catalogue\php\search.php">
<input class="search" type = "text" name = "searchbar" size= "30">
<input class="button" type="image" src="http://localhost/Catalogue/images/searchbutton.png" HEIGHT="49" WIDTH="52" BORDER="0" ALT="Search">
</form>
<div id="loginBox" >
<form name="login" method="POST" action = "\Catalogue\php\login.php">
Username:
<input class="login" type ="text" name="username">
<br>
<br>
Password:
<input class="login" type="password" name="password">
<br>
<br>
<input class="sumbitButton" type="submit" value="submit" name="submitbutton">
</form>
</div>
</div>
</div>
<div id="footer">
</div>
</body>
</head>and here's the css - which is a bit of a cluster atm, I need to organize things much better, at the moment its sort of a 'make things work' experimentation.
body {
background:#524d4d;
padding: 0px;
margin: 0px;
height: 100%;
}
body h1{
font-weight:normal;
color: #000000;
position: absolute;
font-size: 40px;
font-family: "Sans", sans-serif;
margin-left:60px;
margin-top:90px;
}
#banner {
background: url("http://localhost/Catalogue/images/bg.png");
background-repeat: repeat-x;
height: 50px;
margin-bottom: -50px;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.3), 0 1px 0 rgba(255,255,255,0.1);
-moz-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.3), 0 1px 0 rgba(255,255,255,0.1);
-khtml-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.3), 0 1px 0 rgba(255,255,255,0.1);
box-shadow: inset 0 -1px 0 rgba(0,0,0,0.3), 0 1px 0 rgba(255,255,255,0.1);
}
#banner .menuButton {
float: right;
}
#banner .menuButton input{
color: #ffffff;
font-size: 40px;
font-family: "Sans", sans-serif;
background-color: transparent;
border: none;
}
#center {
min-height: 100% ;
}
#content{
overflow: auto;
padding-bottom: 50px;
padding-top: 50px;
}
#searchlogo
{
position: absolute;
background-image: url("http://img.photobucket.com/albums/v166/siver_fire/SearchLogo.png");
height:139px;
width:388px;
margin-top: 170px;
margin-left: 50px;
}
#searchbackground{
position: absolute;
background-image: url("http://localhost/Catalogue/images/startHere.png");
height: 50px;
width: 200px;
margin-top: 370px;
margin-left: 300px;
}
#controllogo
{
position: absolute;
background-image: url("http://img.photobucket.com/albums/v166/siver_fire/ControlPanel-1.png");
height:191px;
width:740px;
}
input.search {
position: absolute;
height: 36px;
width: 500px;
border: 3px solid #000000;
margin-top: 255px;
margin-left: 190px;
font-size: 25px;
font-family: "Sans", sans-serif;
}
input.button {
position: absolute;
margin-top: 247px;
margin-left: 690px;
}
#loginBox{
display: none;
padding-top: 50px;
padding-right: 125px;
float: right;
font-size: 20px;
font-family: "Sans", sans-serif;
}
#loginBox .menuButton input{
color: #ffffff;
font-size: 40px;
font-family: "Sans", sans-serif;
background-color: transparent;
border: none;
}
input.login{
position: absolute;
height: 36px;
width: 200px;
border: 3px solid #000000;
font-size: 25px;
font-family: "Sans", sans-serif;
}
.controlpanel{
position: absolute;
margin-top: 200px;
}
.controlpanel table{
background-color: transparent;
color: #ffffff;
font-size: 40px;
font-family: "Sans", sans-serif;
text-shadow: 0.1em 0.1em 0.2em black;
}
.controlpanel button{
background-color: #524d4d;
border: none;
}
#footer{
background: url("http://localhost/Catalogue/images/bg.png");
background-repeat: repeat-x;
height: 50px;
margin-top: -50px;
clear: both;
-moz-box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.3), 0 0 1px 1px rgba(255,255,255,0.1);
-webkit-box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.3), 0 0 1px 1px rgba(255,255,255,0.1);
box-shadow:inset 0 0 1px 1px rgba(0,0,0,0.3), 0 0 1px 1px rgba(255,255,255,0.1);
}
so basically, after all that :D my problem is with this section
<form name="search" method="POST" action ="\Catalogue\php\search.php">
<input class="search" type = "text" name = "searchbar" size= "30">
<input class="button" type="image" src="http://localhost/Catalogue/images/searchbutton.png" HEIGHT="49" WIDTH="52" BORDER="0" ALT="Search">
</form>As long as that action part is there the login button disappears and in order to get it back I have to remove the action and close and reopen the page.
