I'm trying to implement this method of making a nice form upload:
www.kavoir.com/2009/02/styling-file-upload-select-input-control-input-typefile.html/
which is amazing and simple, but my only issue is that every time I select a file it's showing up as "C:\fakepath\filename". I'm on a mac and I cannot for the life of me figure out where this is coming from! Here's my code:
<?php
error_reporting(E_ALL ^ E_NOTICE);
ini_set('display_errors', '1');
if ($_POST['submit'] == "Submit") {
$temp_file = $_FILES['upload']['tmp_name']."/".$_FILES['upload']['name'];
$target_file = getcwd()."/uploads/".$_FILES['upload']['name'];
// if (!move_uploaded_file($temp_file,$target_file)) {
//
// }
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>untitled</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<style>
.upload {
position:relative;
width:250px;
height:135px;
border:1px solid #666;
padding:10px;
background:#DDD;
}
.loading {
background:rgba(50,50,50,0.8);
position:absolute;
top:0;
left:0;
width:250px;
height:135px;
}
.realupload {
position:absolute;
bottom:0;
right:0;
/* start of transparency styles */
opacity:0;
-moz-opacity:0;
filter:alpha(opacity:0);
/* end of transparency styles */
z-index:2; /* bring the real upload interactivity up front */
width:200px;
}
form .fakeupload {
/* background:url(uploadify/select.png) no-repeat 100% 50%;
*/ }
form .fakeupload input {
width:238px;
font-family:Arial,sans-serif;
padding:5px;
border:1px solid #666;
background:#FFF;
outline:none;
}
label {
width:120px;
height:30px;
}
label img {
cursor:pointer;
}
.upload a.cancel {
position:absolute;
top:10px;
right:10px;
}
</style>
</head>
<body>
<div class="upload">
<form name="file" method="post" action="test.php" enctype="multipart/form-data">
<label for="realupload"><img src="uploadify/select.png" /></label>
<div class="fakeupload">
<input type="text" name="fakeupload" /> <!-- browse button is here as background -->
</div>
<input type="file" name="upload" id="realupload" class="realupload" onchange="this.form.fakeupload.value = this.value;" />
<input id="submit" type="submit" name="submit" value="Submit" />
</form>
<a class="cancel" href="test.php"><img src="uploadify/cancel.png" /></a>
<div class="loading"></div>
</div>
<script>
$(document).ready( function() {
$('div.loading').fadeOut(0);
});
$('form input.submit').click( function() {
$('div.loading').fadeIn(400);
});
</script>
</body>
</html>
That's on the browser's security level. I've encountered this on Windows (IE), but surprisingly you're on a Mac. Try other browsers or change the security options of your current browser. Make it not too conservative.
Also, try using other site's upload forms.
Related
I moved a login php script from a pretty old server to a newer server. All settings and chmods are put the same but the php script does not work on the newer server. When entering the correct login and password it does not go to main.php but stays on the index.php login page and adds this message "Invalid Username or Password!'; } } ?>".
I am a programming noob but perhaps the script uses certain coding that is better not used anymore at newer servers. Any ideas what to change to the script so it could possible work again? Thank you in advance.
Here is the code of the index.php login page:
<?
ob_start("ob_gzhandler");
session_start();
$username = "admin";
$password = "admin";
// main page
$mainpage = "main.php";
if(isset($_SESSION['logedin']))
if($_SESSION['logedin'] == 'loggedin')
{
header("Location: $mainpage");
exit();
}
if(isset($_POST['submit']))
{
if($_POST['username'] == $username && $_POST['password'] == $password)
{
$_SESSION['logedin'] = 'loggedin';
// Redirect to the page
header("Location: $mainpage");
exit();
}
else
{
$error = '<br /><br />Invalid Username or Password!';
}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-US">
<head>
<title>test</title>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
<style type="text/css">
html, body, #wrapper {
height:100%;
width: 100%;
margin: 0;
padding: 0;
border: 0;
}
#wrapper td {
vertical-align: middle;
text-align: center;
}
#headerBox {
border: 1px solid #A6E0FF;
width: 800px;
color: #00529B;
background: #EDF8FE;
height: 150px;
text-align: center;
margin: 0px auto;
}
#top {
color: #00529B;
background: #DAF3FF;
text-align: center;
border-bottom: 1px solid #BFE9FF;
padding-top: 10px;
padding-bottom: 10px;
font-weight:bold;
}
#bottom {
color: #00529B;
background: #EDF8FE;
text-align: center;
padding-top: 30px;
}
</style>
</head>
<body>
<table id="wrapper">
<tr>
<td>
<div id="headerBox">
<form method="post" id="login" action="index.php">
<div id="top">Log In</div>
<div id="bottom">
Username: <input id="username" name="username" type="text" />
Password: <input id="password" name="password" type="password" />
<input type="submit" name="submit" id="submit" value="Log in" />
<? if(isset($error)) echo $error; ?>
</div>
</form>
</div>
</td>
</tr>
</table>
<script type="text/javascript">
//<![CDATA[
<!--
document.getElementById("username").focus();
//-->
//]]>
</script>
</body>
</html>
You seemed to be missing an opening bracket after an if-statement, so this should be working:
<?php
ob_start("ob_gzhandler");
session_start();
$username = "admin";
$password = "admin";
// main page
$mainpage = "main.php";
if(isset($_SESSION['logedin']))
{
if($_SESSION['logedin'] == 'loggedin')
{
header("Location: $mainpage");
exit();
}
}
if(isset($_POST['submit']))
{
if($_POST['username'] == $username && $_POST['password'] == $password)
{
$_SESSION['logedin'] = 'loggedin';
// Redirect to the page
header("Location: $mainpage");
exit();
}
else
{
$error = '<br /><br />Invalid Username or Password!';
}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-US">
<head>
<title>test</title>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
<style type="text/css">
html, body, #wrapper {
height:100%;
width: 100%;
margin: 0;
padding: 0;
border: 0;
}
#wrapper td {
vertical-align: middle;
text-align: center;
}
#headerBox {
border: 1px solid #A6E0FF;
width: 800px;
color: #00529B;
background: #EDF8FE;
height: 150px;
text-align: center;
margin: 0px auto;
}
#top {
color: #00529B;
background: #DAF3FF;
text-align: center;
border-bottom: 1px solid #BFE9FF;
padding-top: 10px;
padding-bottom: 10px;
font-weight:bold;
}
#bottom {
color: #00529B;
background: #EDF8FE;
text-align: center;
padding-top: 30px;
}
</style>
</head>
<body>
<table id="wrapper">
<tr>
<td>
<div id="headerBox">
<form method="post" id="login" action="index.php">
<div id="top">Log In</div>
<div id="bottom">
Username: <input id="username" name="username" type="text" />
Password: <input id="password" name="password" type="password" />
<input type="submit" name="submit" id="submit" value="Log in" />
<?php if(isset($error)) { echo $error; } ?>
</div>
</form>
</div>
</td>
</tr>
</table>
<script type="text/javascript">
//<![CDATA[
<!--
document.getElementById("username").focus();
//-->
//]]>
</script>
</body>
</html>
Hey guys I have problems with contenteditable height. With code like this:
function Preview() {
var x = document.getElementById("code").value;
document.getElementById("preview").innerHTML = x;
}
.preview{
text-align: left;
color: white;
margin-left: 10px;
max-height: 300px;
overflow: auto;
}
<section id="main">
<div id="gra">
<input type="hidden" id="current-code" name="current-code" />
<textarea id="code" name="code">
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>A Simple PHP File</title>
</head>
<body>
<h1><?php echo "Hello, world!"; ?></h1>
</body>
</html>
</textarea>
<div class="flex">
Preview
Reset
</div>
</div>
<div id="gra">
<div contenteditable="true" class="preview" id="preview">
</div>
</div>
</section>
When I enter code with more I can observe effect like this:
Anyone can help me with limit contenteditable height?
try this code
and also change color: red; instead of color:white because its not see anything on white screen
function Preview() {
var x = document.getElementById("code").value;
document.getElementById("preview").innerHTML = x;
}
function Reset() {
document.getElementById("preview").innerHTML = "";
}
.preview {
text-align: left;
color: red;
margin-left: 10px;
max-height: 300px;
overflow-y: scroll;
border: solid 1px #ddd;
}
<section id="main">
<div id="gra">
<input type="hidden" id="current-code" name="current-code" />
<textarea id="code" name="code">
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>A Simple PHP File</title>
</head>
<body>
<h1><?php echo "Hello, world!"; ?>you write php code hear so it will not print on html</h1>
</body>
</html>
</textarea>
<div class="flex">
Preview
Reset
</div>
</div>
<div id="gra">
<div contenteditable="true" class="preview" id="preview">
</div>
</div>
</section>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" DIR=ltr >
<head>
<title>MPage1</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="viewport" content="width=320,user-scalable=yes,initial-scale=1, minimum-scale=1, maximum-scale=1">
<script src="/rpcl-bin/jquerymobile/js/base64.js"></script>
<script src="/rpcl-bin/jquerymobile/js/jquery-1.6.1.min.js"></script>
<script src="/rpcl-bin/jquerymobile/js/functions.js"></script>
<script>
jQuery(document).bind('mobileinit', function(){
jQuery.noConflict();
jQuery.extend(jQuery.mobile , {
loadingMessage: 'Loading',
pageLoadErrorMessage: 'Error Loading Page',
autoInitialize: true,
defaultTransition: 'slide'
});
});</script>
<script src="/rpcl-bin/jquerymobile/js/jquery.mobile-1.0b1.js"></script>
<link rel="stylesheet" href="/rpcl-bin/jquerymobile/css/jquery.general.css" />
</head>
<body style=" margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; " >
<div data-role="page" id="MPage1_page" >
<link rel="stylesheet" href="/unit1.php?header_file=css" />
<script src="/unit1.php?header_file=js"></script>
<form style="margin-bottom: 0" id="MPage1" name="MPage1" method="post" target="_self" action="/unit1.php"><input type="hidden" name="serverevent" value=""><input type="hidden" name="serverparams" value="">
<table width="320" style="height:480px" border="0" cellpadding="0" cellspacing="0" ><tr><td valign="top">
<div id="ComboBox1_outer" style="Z-INDEX: 0; LEFT: 66px; WIDTH: 185px; POSITION: absolute; TOP: 82px; HEIGHT: 18px">
<select name="ComboBox1" id="ComboBox1" size="1" style=" font-family: ; font-size: ; cursor: default;height:16px;width:185px;" tabindex="0" > <option value="0" >value0</option>
<option value="1" selected="selected" >value1</option>
</select>
</div>
</td></tr></table>
</form></div>
</body>
</html>
<!-- MPage1 end -->
I've installed RadPHP XE2 on Windows 7 machine.
I've created a new mobile application and added a combobox to the form. I added 2 items (value0, value1) to the combobox and set the item index to 0.
When I run the application this the selected value is displayed above the combobox. This happens in IE and Chrome (latest version) How do I remove this?
EDIT: I've attached the downloaded HTML. Strange. When I save it to a .html file and open it in a browser, the page displays correctly, but running it from the IDE, it doesn't
bellow is my code that is suppose to create a search box and then style it. For some reason the css properties that I try to give to the box does not apply. I tried having the css in a separate file and also in the script as shown bellow. What is the problem (I'm using netbeans and the file is a .php)
here is the code:
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<meta charset="UTF-8">
<title>cats</title>
</head>
<body>
<form>
<input type="text" placeholder="Search me..." required>
<input type="button" value="Search">
</form>
<style type="text/css" media="screen">
form {
width:500px;
margin:50px auto;
}
.Search {
padding:8px 15px;
background:rgba(50, 50, 50, 0.2);
border:0px solid #dbdbdb;
}
.button {
position:relative;
padding:6px 15px;
left:-8px;
border:2px solid #207cca;
background-color:#207cca;
color:#fafafa;
}
.button:hover {
background-color:#fafafa;
color:#207cca;
</style>
<?php
// put your code here
?>
</body>
</html>
You are using CSS class selectors. Give the elements you want to style the appropriate class attributes (as alluded to by patricksweeney):
form {
width:500px;
margin:50px auto;
}
.search {
padding:8px 15px;
background:rgba(50, 50, 50, 0.2);
border:0px solid #dbdbdb;
}
.button {
position:relative;
padding:6px 15px;
left:-8px;
border:2px solid #207cca;
background-color:#207cca;
color:#fafafa;
}
.button:hover {
background-color:#fafafa;
color:#207cca;
}
<form>
<input type="text" class="search" placeholder="Search me..." required>
<input type="button" class="button" value="Search">
</form>
Hey Stackoverflow users,
Since I was able to get some amazing help before with a problem I was stuck on for longer than I could remember I thought I would come at you with this.
Working with a login system that authenticates the user and kills the session off but currently it's not recognizing the variables assigned to the session. After clicking the logout button everything seems like it's working but when doing a direct connect to the Members Page by typing it into the address bar it loads the page instead of redirecting to the login page.
Members.php
<?PHP
session_start();
if (!isset($_SESSION['username'])) {
header('location:login.php');
}
?>
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>The Animator BETA</title>
<style>
//CSS Has been removed as it's lengthy and unrelated to the issue.
</style>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#login-trigger').click(function(){
$(this).next('#login-content').slideToggle();
$(this).toggleClass('active');
if ($(this).hasClass('active')) $(this).find('span').html('▲')
else $(this).find('span').html('▼')
})
});
</script>
</head>
<body>
<header class="cf">
<nav style="text-align:center">Logout</nav>
</header>
<h1 style="text-align:center"> The Animator - BETA</h1>
<hr />
<div id="nav" style="text-align:center">
<ul style="text-align:center">
<li><a href= "#" ><strong>Home</strong></a></li>
<strong><li><a href= "industrial.html" >Industrial</a></li>
<li><a href= "educational.html" >Education</a></li>
<li><a href= "independent.html" >Independent</a></li>
<li><a href= "emergent.html" >Emergent</a></li>
<li><a href= "team.html" >Team</a></li>
<li><a href= "project.html" >Project</a></li>
<li><a href= "budget.html" >Budget</a></li>
<li><a href= "profile.html" >Profile</a></li></strong>
</ul>
</div>
<hr />
<div style="padding-left:19%"><input type="text" value="search" />
<input type="button" value="Search!" name="search"/>
</div>
<div> </div>
<div align="center">
<div><img src="logo.png" width="407" height="345" alt="Logo" usemap="sectors" /></div>
</div>
</div>
<map name="sectors">
<area shape="rect" coords="72,40,194,165" alt="Industrial" href="industrial.html">
<area shape="rect" coords="210,38,328,162" alt="Emergent" href="emergent.html">
<area shape="rect" coords="208,178,331,296" alt="Independent" href="independent.html">
<area shape="rect" coords="71,177,194,295" alt="Educational" href="educational.html">
</map>
<div> </div>
<div style="text-align:right"></div>
<div> </div>
<div id="footer"> <hr />
<p><strong><u>About The Animator | Contact | Privacy Policy | FAQ</u></strong><u></u></p>
</div>
</body>
</html>
LOGIN PAGE
<?php
error_reporting(E_ALL);
ini_set('display_errors',"On");
include ('database_connection.php');
if (isset($_POST['formsubmitted'])) {
// Initialize a session:
session_start();
$error = array();//this aaray will store all error messages
if (empty($_POST['e-mail'])) {//if the email supplied is empty
$error[] = 'You forgot to enter your Email ';
} else {
if (preg_match("/^([a-zA-Z0-9])+([a-zA-Z0-9\._-])*#([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/", $_POST['e-mail'])) {
$Email = $_POST['e-mail'];
} else {
$error[] = 'Your Email Address is invalid ';
}
}
if (empty($_POST['Password'])) {
$error[] = 'Please Enter Your Password ';
} else {
$Password = $_POST['Password'];
}
if (empty($error))//if the array is empty , it means no error found
{
$query_check_credentials = "SELECT * FROM account WHERE (email='$Email' AND passwords='$Password')";
$result_check_credentials = mysqli_query($dbc, $query_check_credentials);
if(!$result_check_credentials){//If the QUery Failed
echo 'Query Failed ';
}
if (#mysqli_num_rows($result_check_credentials) == 1)//if Query is successfull
{ // A match was made.
$_SESSION = mysqli_fetch_array($result_check_credentials, MYSQLI_ASSOC);//Assign the result of this query to SESSION Global Variable
$_SESSION['email'] = $Email;
session_start("username");
header("Location: members.php");
}else
{
$msg_error= 'Either Your Account is inactive or Email address /Password is Incorrect';
}
} else {
echo '<div class="errormsgbox"> <ol>';
foreach ($error as $key => $values) {
echo ' <li>'.$values.'</li>';
}
echo '</ol></div>';
}
if(isset($msg_error)){
echo '<div class="warning">'.$msg_error.' </div>';
}
/// var_dump($error);
mysqli_close($dbc);
} // End of the main Submit conditional.
?><!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Login Form</title>
<style type="text/css">
body {
font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}
.registration_form {
margin:0 auto;
width:500px;
padding:14px;
}
label {
width: 10em;
float: left;
margin-right: 0.5em;
display: block
}
.submit {
float:right;
}
fieldset {
background:#EBF4FB none repeat scroll 0 0;
border:2px solid #B7DDF2;
width: 500px;
}
legend {
color: #fff;
background: #80D3E2;
border: 1px solid #781351;
padding: 2px 6px
}
.elements {
padding:10px;
}
p {
border-bottom:1px solid #B7DDF2;
color:#666666;
font-size:11px;
margin-bottom:20px;
padding-bottom:10px;
}
a{
color:#0099FF;
font-weight:bold;
}
/* Box Style */
.success, .warning, .errormsgbox, .validation {
border: 1px solid;
margin: 0 auto;
padding:10px 5px 10px 60px;
background-repeat: no-repeat;
background-position: 10px center;
font-weight:bold;
width:450px;
}
.success {
color: #4F8A10;
background-color: #DFF2BF;
background-image:url('images/success.png');
}
.warning {
color: #9F6000;
background-color: #FEEFB3;
background-image: url('images/warning.png');
}
.errormsgbox {
color: #D8000C;
background-color: #FFBABA;
background-image: url('images/error.png');
}
.validation {
color: #D63301;
background-color: #FFCCBA;
background-image: url('images/error.png');
}
</style>
</head>
<body>
<form action="login.php" method="post" class="registration_form">
<fieldset>
<legend>Login Form </legend>
<p>Enter Your username and Password Below </p>
<div class="elements">
<label for="name">Email :</label>
<input type="text" id="e-mail" name="e-mail" size="25" />
</div>
<div class="elements">
<label for="Password">Password:</label>
<input type="password" id="Password" name="Password" size="25" />
</div>
<div class="submit">
<input type="hidden" name="formsubmitted" value="TRUE" />
<input type="submit" value="Login" />
</div>
</fieldset>
</form>
<button onclick="window.location='theanimator.html';">Go Back!</button>
</body>
</html>
LOGOUT
<?php
unset($_SESSION['email']);
header('Location: login.php');
exit;
?>
your logout page has to be this:
<?php
//start the session
session_start();
//this will destroy the session that is started
session_destroy();
header('Location: login.php');
exit;
?>
The problem was, you didn't destroy the session so the session exist when you go back to page.
Also you where looking checking on $_SESSION['username'] but you unset $_SESSION['email'] that is never going to work.