This works good with out a loop but with a loop the first one works but the second one can't set a PHP session value like the first one so how can I get the loop copy to work like the first one meaning being able to set a PHP session value.
*NOTE: THIS IS NOT A HTML FORM THIS IS COSTUME CODE THAT me and my friend MADE FROM a tutorial THAT ACTS LIKE A FORM TO SET A SESSION VALUE.*
tutorial source: https://www.formget.com/submit-form-using-ajax-php-and-jquery/#
I don't want to use a form don't ask me why it's personal so how can I fix this where the loop copy can also set a session value of a session variable i'm saying this because only the first one is able to do that and the second one can't set a session value like the first one.
.gif Screenshot
code
submit_session.php
<?php
session_start();
?>
<!DOCTYPE html>
<html>
<head>
<title>Simulated Form</title>
<meta name="viewport" content="width=device-width">
<meta charset="UTF-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
//This section converts the HTML id's in the form div into form values
$(document).ready(function(){
$("#execute").click(function(){
var execute= $("#execute").val();
var name= $("#name").val();
var age= $("#age").val();
var dataString = 'execute='+ execute + '&name='+ name + '&age='+ age;
//AJAX code to submit the simulated form.
$.ajax({
type: "POST",
url: "submit_session.php",
data: dataString
});
});
});
</script>
<style>
.form {
background-color: gold;
width: 200px;
margin: auto;
border-radius: 5px;
padding-top: 5px;
}
.set-value{
background: blue;
padding: 1px 4px;
text-decoration: none;
border: 1px solid gray;
color: white;
margin: auto;
display: block;
width: 100px;
text-align: center;
border-radius: 5px;
}
.name-input {
margin: auto;
display: block;
}
.age-input {
margin: auto;
display: block;
}
</style>
</head>
<body>
<?php
//Generate more than one copy of the simulated form
for ($loop = 0; $loop <= 1; $loop++) {
?>
<br>
<!--The simulated form-->
<div class="form">
<p style='text-align: center;'>Simulated form</p>
<input type="text" id="name" class='name-input' required="required" placeholder='Name' autocomplete="off">
<br>
<input type="text" id="age" class='age-input' required="required" placeholder='Age' autocomplete="off">
<br>
<!-- Simulated form submit button -->
<a class="set-value" id="execute" href="view-session-values.php">Set value</a>
<br>
</div>
<?php
echo $loop;
}
//Set session values from a simulated form
if(isset($_POST['execute'])){
$name = $_POST['name'];
$age = $_POST['age'];
if($check=1){
$_SESSION['name']=$name;
$_SESSION['age']=$age;
echo "<script>window.open('_self')</script>";
}
}
?>
</body>
</html>
view-session-values.php
<?php
session_start();
$name = $_SESSION['name'];
$age = $_SESSION['age'];
?>
<!DOCTYPE html>
<html>
<head>
<style>
#set-new-session-value {
background-color: black;
color: white;
padding: 5px 5px;
text-decoration: none;
border-radius: 5px;
}
#destroy-session-value{
background-color: black;
color: white;
padding: 5px 5px;
text-decoration: none;
border-radius: 5px;
}
</style>
</head>
<body>
<!--This section is based on choosing session options -->
<br>
<a id='set-new-session-value' href="submit_session">Set new session value</a>
<a id='destroy-session-value' href="destroy_session.php">Destroy session value</a>
<br>
<!--This section is where the set session values are shown-->
<p><?php echo $name; ?></p
<p><?php echo $age; ?></p>
</body>
</html>
Related
I am creating a form for an NGO to share reports to their members (more than 100).
In the form, the member would need to insert their ID (nric) and their email and it will validate it with the list of existing members. Upon successful validation, a second page will be shown where the link to download the report will be made available.
I followed a guide on youtube to create a simple 2 page Google Sheet app and Apps Script.
The original guide is intended for user to login with username and password. I made some changes for the members to login with ID and Email instead. Upon testing with the right ID and emails, I am able to login.
Below are my enquiries:
Currently the form has an issue. If I leave the login form totally empty (empty email and ID) and when I click on the login button, it will login successfully. If I insert either ID or email wrongly, it successfully display the error message. What did I miss?
Someone in the youtube comment pointed out that the
"touppercase from the checkLogin function, that don't work anymore in app script"
Can anyone confirm?
Once the member login, I want to display that person name. In the original code, it display the username if only the user insert the username, while I want to retrieve it from the Google Sheet column 1.
Original code to retrieve username
document.getElementById("displayusername").innerHTML = username;
How do I retrieve the member name from column 1 of that member that login from the Google Sheet that link to the Apps Script?
Thank you very much
I have 2 files, "Code.gs" and "index.html"
Code.gs
function doGet(e) {
var x = HtmlService.createTemplateFromFile("index");
var y = x.evaluate();
var z = y.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
return z;
}
function checkLogin(nric,email) {
var url = 'https://docs.google.com/spreadsheets/d/1dKcn__IcRnDoXf72HnsVN7L2POSNu8KzKJKpS4jmNrk/edit#gid=0';
var ss= SpreadsheetApp.openByUrl(url);
var webAppSheet = ss.getSheetByName("DATA");
var getLastRow = webAppSheet.getLastRow();
var found_record = '';
for(var i = 1; i <= getLastRow; i++)
{
if(webAppSheet.getRange(i, 2).getValue().toUpperCase() == nric.toUpperCase() &&
webAppSheet.getRange(i, 3).getValue().toUpperCase() == email.toUpperCase())
{
found_record = 'TRUE';
}
}
if(found_record == '')
{
found_record = 'FALSE';
}
return found_record;
}
function AddRecord(usernamee, nricc, emaill, phone) {
var url = 'https://docs.google.com/spreadsheets/d/1dKcn__IcRnDoXf72HnsVN7L2POSNu8KzKJKpS4jmNrk/edit#gid=0';
var ss= SpreadsheetApp.openByUrl(url);
var webAppSheet = ss.getSheetByName("DATA");
webAppSheet.appendRow([usernamee,nricc,emaill,phone]);
}
Index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script>
function AddRow()
{
var usernamee = document.getElementById("usernamee").value;
var nricc = document.getElementById("nricc").value;
var emaill = document.getElementById("emaill").value;
var phone = document.getElementById("phone").value;
if (usernamee==""|| nricc==""|| emaill==""|| phone=="") {
return false;
}
else {
google.script.run.AddRecord(usernamee,nricc,emaill,phone);
document.getElementById("page2_id1").className = "page2_id1-off";
document.getElementById("page3_id1").className = "page3_id1";
}
}
function LoginUser()
{
var username = document.getElementById("username").value;
var nric = document.getElementById("nric").value;
var email = document.getElementById("email").value;
google.script.run.withSuccessHandler(function(output)
{
if(output == 'TRUE')
{
document.getElementById("displayusername").innerHTML = username;
document.getElementById("page1_id1").className = "page1_class1-off";
document.getElementById("page4_id1").className = "page4_id1";
}
else if(output == 'FALSE')
{
document.getElementById("errorMessage").innerHTML = "Please login with your email and your NRIC(with dashes). If you are unable to login, please contact ERA at era#era.org.my to update your information.";
}
}).checkLogin(nric,email);
}
function function1(){
document.getElementById("page1_id1").className = "page1_class1-off";
document.getElementById("page2_id1").className = "page2_id1";
}
function function3(){
document.getElementById("page3_id1").className = "page3_id1-off";
document.getElementById("page1_id1").className = "page1_id1";
}
</script>
<style>
/*button*/
.reportbutton {
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}
.buttongreen {background-color: #4CAF50;} /* Green */
/*page1*/
.page1_class1-off{
display: none;
}
/*page2*/
.page2_class1{
display: none;
}
.page2_id1-off{
display:none;
}
/*page3*/
.page3_class1{
display:none;
}
.page3_id1-off{
display:none;
}
/*page4*/
.page4_class1{
display:none;
}
.page4_id1-off{
display:none;
}
input[type=text]:hover{
border-bottom:2px solid black;
}
input[type=number]:hover{
border-bottom:2px solid black;
}
input[type=password]:hover{
border-bottom:2px solid black;
}
.user{
display: inline-block;
width: 75px;
height: 75px;
border: 8px solid black;
border-radius: 50%;
position: relative;
overflow: hidden;
box-sizing: border-box;
}
/*the head/*/
.user::before{
content: '';
display: inline-block;
width: 24px;
height: 24px;
background: black;
border-radius: 50%;
position: absolute;
left: calc(50% - 11px);
top: 10px;
}
/*the body*/
.user::after{
content: '';
display: inline-block;
width:50px;
height:40px;
background: black;
border-radius: 50%;
position: absolute;
left: calc(50% - 24px);
top: 39px;
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<br><br>
<!--page1-->
<center>
<div class="page1_class1" id="page1_id1" style="background:none;border:2px solid gray;border-radius: 20px;width: 250px;padding-top: 10px;padding-bottom: 20px;padding-left: 20px;padding-right: 20px;">
<h1>Login Form</h1>
<br>
<input type="text" id="username" placeholder="Full Name" style="border-top: none;border-right: none;border-left: none;outline: none; text-align: center;font-size:0.9em ;width: 50%;font-weight:bold;"/><br>
<br>
<input type="password" id="nric" placeholder="NRIC (eg : 999999-10-9999)" style="border-top: none;border-right: none;border-left: none;outline: none; text-align: center;font-size:0.9em ;width: 50%;font-weight:bold;"/><br>
<br>
<input type="text" id="email" placeholder="Email" style="border-top: none;border-right: none;border-left: none;outline: none; text-align: center;font-size:0.9em ;width: 50%;font-weight:bold;"/><br>
<br><span id="errorMessage" style="color: red" ></span><br>
<input type="submit" value="Login" onclick="LoginUser()" style="float: right;padding-top: 1px;padding-bottom: 1px;padding-left: 10px;padding-right: 10px;font-size: 0.9em;font-weight:bold;" /><br>
<br>
</div>
<!--page3-->
<div class="page3_class1" id="page3_id1" style="background:none;border:2px solid gray;border-radius: 20px;width: 250px;padding-top: 10px;padding-bottom: 20px;padding-left: 20px;padding-right: 20px;"><center>
<h2> Your account has been successfully created. Login to your account</h2>
<input type="submit" onClick="function3()" value="Login" style="font-weight:bold;"><br>
</div>
<!--page4-->
<div class="page4_class1" id="page4_id1" style="background:none;border:2px solid gray;border-radius: 20px;width: 250px;padding-top: 10px;padding-bottom: 20px;padding-left: 20px;padding-right: 20px;" ><center>
<br>
<h2>Hi <b id="displayusername" style="color:red;"></b>!</h2>
<div class="user"></div>
<h2> You have successfully logged in.</h2>
<h2> Download the report below.</h2>
<a class="reportbutton buttongreen" href="https://google.com" target="_blank">Report 1</a>
<a class="reportbutton buttongreen" href="https://google.com" target="_blank">Report 2</a>
<a class="reportbutton buttongreen" href="https://google.com" target="_blank">Report 3</a>
<h2>**************</h2>
<br>
</div>
</center>
</body>
</html>
I'm a newbie and still learning how to code. So, any help is much appreciated. This is what I have in an
image of what's done so far.
How do I save the selected radio button's image ID and the image itself to my database in PHPMyAdmin? I tried but couldn't figure it out. I would also want to repeat this process three times since the user must select three pictures(1 per submit). Users also should not be allowed to choose the same picture again. Perhaps if a picture is selected, it won't be displayed again in the second and third rounds. Below is my code.
include_once 'database.php';
// Create Level 2 password
if (isset($_POST['submit'])) {
header("LOCATION: registration_l3.php");
try {
$stmt = $conn->prepare("INSERT INTO tbl_pass_level_2(fld_user_id, fld_image_id, fld_image) VALUES(:uid, :iid, :image)");
$stmt->bindParam(':uid', $uid, PDO::PARAM_STR);
$stmt->bindParam(':iid', $iid, PDO::PARAM_STR);
$stmt->bindParam(':image', $image, PDO::PARAM_STR);
$uid = $_POST['uid'];
$iid = $_POST['iid'];
$image = $_POST['image'];
$stmt->execute();
}
catch(PDOException $e)
{
echo "Error: " . $e->getMessage();
}
}
// Auto increment for User ID
$num = $conn->query("SELECT MAX(fld_user_id) AS uid FROM tbl_pass_level_2")->fetch()['uid'];
if ($num){
$num = ltrim($num, 'U')+1;
$num = 'U'.str_pad($num,2,"0",STR_PAD_LEFT);
}
else{
$num = 'U'.str_pad(1,2,"0",STR_PAD_LEFT);
}
$pic = array('1.png','2.png','3.png','4.png','5.png','6.png','7.png','8.png','9.png','10.png','11.png','12.png','13.png','14.png','15.png','16.png','17.png','18.png','19.png','20.png');
shuffle($pic);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Register-Password Level 2</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
body {
background: linear-gradient(to bottom, #ff6699 0%, #ffcc99 100%)fixed;
font: 18px Tahoma, sans-serif;
color: black;
text-align: center;
}
p {font-size: 16px;}
.margin {margin-bottom: 35px;}
.container-fluid {
padding-top: 50px;
padding-bottom: 50px;
}
div {
margin-bottom: 20px;
}
label {
display: inline-block;
width: 100px;
text-align: center;
}
input[type=submit] {
background-color: #ff0066;
border: 2px solid #000000 ;
color: black;
text-decoration: none;
cursor: pointer;
display: inline-block;
width: 120px;
text-align:center;
}
.center {
display: flex;
flex-flow: row wrap;
position: relative;
width: auto;
margin-left: auto;
margin-right: auto;
}
li {
flex: 1 1 16%;
height: auto;
margin: 20px;
margin-right: 40px;
padding: 20px 0;
width: auto;
border: 2px solid #000000 ;
}
.buttonHolder{ text-align: center;}
#footer {
position: relative;
padding: 10px 10px 0px 10px;
bottom: 0;
width: 100%;
/* Height of the footer*/
height: 40px;
}
</style>
</head>
<body>
<div class="container-fluid text-center">
<h2 class="margin"> <b>3 LEVEL PASSWORD AUTHENTICATION <br>SECURITY SYSTEM<b></h2>
<h3 class="margin"><b>LEVEL 2 PASSWORD REGISTRATION </b></h3>
<h4 class="margin">CHOOSE 3 OUT OF 10 DISPLAYED IMAGES </h4>
<label>User ID :</label>
<input name="uid" type="text" id="userid" placeholder="User ID" value="<?php echo $num; ?>"readonly>
<?php
if (isset($_SESSION['error'])) {
echo "<p class='text-danger text-center'>{$_SESSION['error']}</p>";
unset($_SESSION['error']);
}
?>
<form method="post">
<ul>
<div class="center">
<?php
for($i=0;$i<10;$i++)
echo "<li style = \"display:inline-block;\"><input type = \"radio\" name = \"iid\"><img src = \"$pic[$i]\" name=\"image\" width=\"50%\" height=\"150\" class=\"center\" ></li>";
?>
</div>
</ul>
<h4 class="margin text-center"> 1 OUT OF 3 </h4>
<div class="buttonHolder">
<input type="hidden" name="matricnum" value="a174559">
<?php { ?>
<input type="submit" name="submit" value="Submit" align="text-center">
<?php } ?>
</div>
</form>
<!-- Footer -->
<footer class="footer text-center" id=footer>
<p>Copyright � S.SASHNEETA 2022</p>
</footer>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</body>
</html>
So I have a variable, its called $comments.
but every time I do it I want it to break a line and echo out the new one I submit. Right now it just replaces the current one.
So everytime I click submit I would like it to make a NEW comments and not just write over the old one.
this is what I currently have, But everytime i hit submit it just overwrites the previous comment. I want it to break a line and display the next one without erasing teh previous
<?php
session_start();
if(isset($_POST['add'])){
$text = $_POST['content'];
$author = $_POST['author'];
$comment = $text. ',' .$author;
$_SESSION['cm'] = $comment;
echo '<b>';
}
?>
<!DOCTYPE>
<html>
<head>
<style>
body{
text-align: center;
margin: 10px 0 0 0;
}
.listing{
text-align: left;
border-top: 2px solid #000;
padding: 15px;
}
input{
font-size: 16px;
padding: 5px;
text-align: center;
}
input[type=submit]{
display: block;
margin: auto;
margin-top: 10px;
}
#gotolink{
position: absolute;
top: 15px;
right: 15px;
}
.listing > div{
max-width: 100%;
word-break: break-all;
}
</style>
</head>
<body>
<div id="gotolink"><button onClick='document.getElementById("bottom").scrollIntoView({block: "end", behavior: "smooth"});'>Scroll to bottom</button></div>
<p>Try and stay</p>
<p>Creating new test</p>
<form action="" method="POST">
<input type="text" name="content" placeholder="Text">
<input type="text" name="author" placeholder="Name">
<input type="submit" value="Submit" name="add">
</form>
<div class="listing">
<?php echo '<div>' .$_SESSION['cm']. '</div>'; ?>
</div>
<div id="bottom"></div>
</body>
</html>
$_SESSION['cm'] = $comment;
Replace with:
$_SESSION['cm'] .= $comment."<br>";
I have an admin page (admin.php) that I am setting up right now.
When the page is accessed initially, a login box comes up correctly where the user can hit a "Sign In" button.
When they hit the "Sign In" button, the login form gets submitted to a PHP page with this code (I don't have any authenticating going on right now - just starting to get this setup):
<?php
session_start();
$_SESSION['login_success'] = true;
header('Location:http://localhost/mbc/admin');
exit();
?>
Then, I'm expecting that the admin.php page will display the admin form but the page just shows up blank after the redirect. Below is the applicable parts of the admin.php page. Can any of you see what I'm doing wrong here such that the admin form is not displaying after the authentication is done?
<html>
<head>
<title>Welcome Home!</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<link href="layout.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery.min.js"></script>
<style>
/* Mask for background, by default is not display */
#mask {
display: none;
background: #000;
position: fixed; left: 0; top: 0;
z-index: 10;
width: 100%; height: 100%;
opacity: 0.8;
z-index: 999;
}
/* You can customize to your needs */
.login-popup{
display:none;
background: #333;
padding: 10px;
border: 2px solid #ddd;
float: left;
font-size: 1.2em;
position: fixed;
top: 50%; left: 50%;
z-index: 99999;
box-shadow: 0px 0px 20px #999; /* CSS3 */
-moz-box-shadow: 0px 0px 20px #999; /* Firefox */
-webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
border-radius:3px 3px 3px 3px;
-moz-border-radius: 3px; /* Firefox */
-webkit-border-radius: 3px; /* Safari, Chrome */
}
img.btn_close { Position the close button
float: right;
margin: -28px -28px 0 0;
}
fieldset {
border:none;
}
form.signin .textbox label {
display:block;
padding-bottom:7px;
}
form.signin .textbox span {
display:block;
}
form.signin p, form.signin span {
color:#999;
font-size:11px;
line-height:18px;
}
form.signin .textbox input {
background:#666666;
border-bottom:1px solid #333;
border-left:1px solid #000;
border-right:1px solid #333;
border-top:1px solid #000;
color:#fff;
border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
font:13px Arial, Helvetica, sans-serif;
padding:6px 6px 4px;
width:200px;
}
form.signin input:-moz-placeholder { color:#bbb; text-shadow:0 0 2px #000; }
form.signin input::-webkit-input-placeholder { color:#bbb; text-shadow:0 0 2px #000; }
.button {
background: -moz-linear-gradient(center top, #f3f3f3, #dddddd);
background: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#dddddd));
background: -o-linear-gradient(top, #f3f3f3, #dddddd);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f3f3f3', EndColorStr='#dddddd');
border-color:#000;
border-width:1px;
border-radius:4px 4px 4px 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
color:#333;
cursor:pointer;
display:inline-block;
padding:6px 6px 4px;
margin-top:10px;
font:12px;
width:214px;
}
.button:hover { background:#ddd; }
</style>
</head>
<body id="page1">
<?php
session_start();
if (isset($_SESSION['login_success'])) {
?>
<!-- Some HTML content should show up here but it isn't... -->
<?php } else { ?>
<!-- Login Dialog -->
<div id="login-box" class="login-popup">
Cancel
<form method="post" class="signin" action="admin_process_login.php">
<fieldset class="textbox">
<label class="username">
<span>Username</span>
<input id="username" name="username" value="" type="text" autocomplete="on" placeholder="Username">
</label>
<label class="password">
<span>Password</span>
<input id="password" name="password" value="" type="password" placeholder="Password">
</label>
<button class="login" type="submit">Sign in</button>
</fieldset>
</form>
</div>
<script type="text/javascript">
$(document).ready(function() {
//Getting the variable's value from a link
var loginBox = document.getElementById('login-box');
//Fade in the Popup
$(loginBox).fadeIn(300);
//Set the center alignment padding + border see css style
var popMargTop = ($(loginBox).height() + 24) / 2;
var popMargLeft = ($(loginBox).width() + 24) / 2;
$(loginBox).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
// Add the mask to body
$('body').append('<div id="mask"></div>');
$('#mask').fadeIn(300);
// When clicking on the button close or the mask layer the popup closed
$('button.login').live('click', function() {
$('#mask , .login-popup').fadeOut(300 , function() {
$('#mask').remove();
});
return false;
});
});
</script>
<?php } ?>
</body>
</html>
EDIT 2012-02-25 16:54EST
For some strange reason, this (and only this as far as I've tested so far) series of events makes the admin form come up correctly...
* Go to admin.php and click on "Sign In" button
* Go to "test" php page in browser (http://localhost/mbc/test)
Code for the test page:
<html>
<head>
<title>Testing</title>
</head>
<body>
<?php
session_start();
if (isset($_SESSION['login_success'])) { ?>
<H1>Login was a success</H1>
<?php } else { ?>
<H1>Login was a failure - next time it should work</H1>
<?php
$_SESSION['login_success'] = true;
}
?>
</body>
</html>
Go to admin page (http://localhost/mbc/admin) and now the admin form comes up fine.
The problem was actually in the jQuery button click code, specifically the "return false" portion:
// When clicking on the button close or the mask layer the popup closed
$('button.login').live('click', function() {
$('#mask , .login-popup').fadeOut(300 , function() {
$('#mask').remove();
});
return false;
});
When I removed that code, the "$_SESSION['login_success'] = true;" occurred fine and the admin form portion came back successfully.
Turns out "return false" has some nasty side effects and should be used carefully. See
http://fuelyourcoding.com/jquery-events-stop-misusing-return-false/ for more information on using "return false" correctly.
I don't have access to test it right now, but I think your problem is that it should be:
header('Location: http://localhost/mbc/admin');
Reference: http://php.net/manual/en/function.header.php
Both of the references show that a space after the ":" is needed before the URI.
There is nothing wrong with your code. You are simply expecting start_session() not to work and $_SESSION['login_success'] to be unset. I suggest you either use a php-framework or read a guide about sessions.
here, change like this and the form pops up:
<?php
//session_start(); // if you uncomment print_r will give you 1
if (isset($_SESSION['login_success'])) {
echo '<pre>';
print_r($_SESSION['login_success']);
?>
<!-- Some HTML content should show up here but it isn't... -->
empty statement</pre>
When the user is hovering on a radio button/its label i want to display another radio button, that user can also select but if mouse moves the 2nd radio button hides again. i have found this last jquery snipet that shows choices while hovering on link tag
http://www.stylesfirst.com/coding/easy-show-hide-with-jquery/
<html>
<head>
<style type="text/css">
p.trigger {
padding: 0 0 0 20px;
margin: 0 0 5px 0;
background: url(plusminus.jpg) no-repeat;
height: 15px;
font-size: 14px;
font-weight: bold;
float:left;
}
p.trigger a {
color: #474747;
text-decoration: none;
display: block;
cursor:pointer;
}
p.trigger a:hover {
color: #ff4b43;
}
p.active {
background-position: left bottom;
}
.toggle_container {
margin: 0 0 5px;
padding: 0;
overflow: hidden;
clear: both;
}
.toggle_container .block {
padding: 0px 0px 0px 15px;
}
</style>
<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript'>
jQuery(document).ready(function(){
jQuery('.toggle_container').hide();
jQuery('p.trigger').hover(function(){
jQuery(this).toggleClass('active').next().toggle('slow');
});
});
</script>
</head>
<body>
<p class="trigger"><a>Click here</a></p>
<div class="toggle_container">
<div class="block">
<input id='element_1_1' name='element_1' class='element radio' type='radio' value='8'/>
<label class='choice' for='element_1_1'>Somewhere in the middle</label>
</div>
</div>
</body>
</html>
The easiest answer would be, if you could afford it, put both <input type="radio"/>s under a <div/> and control hovering behavior on that <div/>. This is commonly done with menus for the very same purpose.
Plus if you target new browsers, you can leave jQuery out of this - it can be done with any browser that understands the :hover pseudo-class on non-<a/>s.
Here's a sample page demonstrating both options.
<html>
<head>
<script src="http://code.jquery.com/jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#radios').hover(
function() { $('#radios').addClass('hover'); },
function() { $('#radios').removeClass('hover'); }
);
});
</script>
<style type="text/css">
/* option 1 - jquery + css, for older browsers */
#div-radio2 {
display: none;
}
.hover #div-radio2 {
display: block;
}
/* option 2 - no jquery, plain css, if you target only new browsers */
#radios:hover #div-radio2 {
display: block;
}
</style>
</head>
<body>
<div id="radios">
<div id="div-radio1"><input type="radio" id="radio1" /><label for="radio1">Radio 1</label></div>
<div id="div-radio2"><input type="radio" id="radio2" /><label for="radio2">Radio 2</label></div>
</div>
</body>
</html>
Are you looking for something like this
http://jsfiddle.net/HezZa/