i am creating a blog posting page for practice.
1) i want a pop up window 'javascript' on success full data submitting to phpmyadmin.
2) same on failure a popup window.
3)where exactly we should close the mysqli connection mysqli_close(); in a isset codding.
i have tried all onclick, onsubmit, two function on one onclick but all in vain
reasons: two javascripts function were not working on one button.
while onsubmit code typed the popup window appears but data does not success fully submits to phpmyadmin.
<html>
<head>
<title>
</title>
</head>
<link href="blogsup-main.css" type="text/css" rel="stylesheet"/>
<link href="blogsup.css" type="text/css" rel="stylesheet"/>
<body onload="refresh();">
<center>
<form method="post">
Name
Category
<option>Education</option>
<option>Society</option>
<option>Politics</option>
<option>Business</option>
<option>IT</option>
<option>Book</option>
<option>Other</option>
Heading
Sub heading *optional
Blog
*Send Email
</form>
</center>
<div id="popupdiv" class="popup-area">
<div class="popup-content">
<span class="close">×</span>
<center>
Blog Created Success Fully!pending approval.
Proceed
</center>
</div>
</div>
</body>
</html>
<?php
$user='root';
$password='';
$db='blogsup';
$con=mysqli_connect('localhost',$user,$password,$db);
mysqli_select_db($con,$db);
if(isset($_POST['submit'])){
$bloggername=$_POST['bloggername'];
$category=$_POST['category'];
$heading=$_POST['heading'];
$subheading=$_POST['subheading'];
$textarea=$_POST['textarea'];
$que="insert into blogposting (bloggername,category,heading,subheading,blogdate,blog) values ('$bloggername','$category','$heading ','$subheading', now(),'$textarea')";
$run=mysqli_query($con,$que);
if($run){
echo '<script type="text/javascript">
var popupdiv = document.getElementById("popupdiv");
popupdiv.style.display = "block";
return false;
</script>';
} else{
echo"Failed";
}
}
mysqli_close($con);
?>
<script type="text/javascript">
var nametextbox = document.getElementById('nametextbox');
var heading= document.getElementById('heading');
var blog = document.getElementById('blog');
var span = document.getElementsByClassName('close')[0];
function refresh(){
nametextbox.value='';
heading.value='';
subheading.value='';
blog.value='';
}
span.onclick = function() {
popupdiv.style.display = "none";
nametextbox.value='';
heading.value='';
subheading.value='';
blog.value='';
message.innerHTML = '';
}
</script>
When you submit a form there is no success or failure.You shouldn't add php and html and js code in the same page.Add the php code to php file which will be your action
e.g
<form action="anyfile.php" method="post">
In the php file add your business logic, like connect to db, execute queries and close the db connection.when the insert query is executed without errors then send a redirect back (yourMainPage?message='ok') to show a successful message like
<?php if(isset($_GET('message') == 'ok'){ ?>
<p>Data successfully inserted</p>
<?php } ?>
Also, your code should be more tidy. Hope i helped.
Related
I need to display a dialog box based on user input, and I'm implementing the Zebra dialog plug-in to help with this.
I can get a generic dialog to show up when the user clicks a button, but no matter what I do, I can't get the Javascript to see the HTML text box, let alone the data inside it.
I have created a test page for this. See below.
Here is the HTML/PHP code (index.php):
<head>
<!-- Style for Zebra Dialog boxes -->
<link rel="stylesheet" href="zebra/zebra_dialog.css" type="text/css">
</head>
<header>
<h1>Testing My Dialogs and Alerts</h1>
</header>
<body>
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$myTyping = trim($_POST["myTyping"]);
// Display what the user typed in a dialog. Is there some code that needs to go here?
}
?>
<form id="form_to_submit" action="index.php" method="POST">
<fieldset>
<label>Type anything you want:</label>
<input type="text" name="myTyping" id="myTyping">
<button type="submit" id="click">Click Here to show alert and see what you typed.</button>
</fieldset>
</form>
<!-- Link to jQuery file so any plug-ins can work
Including the production version here. Can also download one for better debugging. -->
<script type="text/javascript" src="jquery-1.12.0.min.js"></script>
<!-- Link to Zebra Dialog box code -->
<script type="text/javascript" src="zebra_dialog.js"></script>
<!-- Link to My Javascript code -->
<script type="text/javascript" src="myTestScripts.js"></script>
</body>
And here is the Javascript code (myTestScripts.js). I have tried 3 different ways to get the user's input and display it, but "getElementById" never works. Is it not rendered yet? I tried putting in prevent default code, but that makes no difference.
/* javascripts */
// FIRST TRY
$(document).ready(function() {
// show a dialog box when clicking on a button
$("#click").bind('click', function(e) {
//e.preventDefault();
$.Zebra_Dialog('The link was clicked!');
**var myInputElement = document.getElementById("myTyping"), // This doesn't get the element, always is null**
myInput = myInputElement.innerText;
console.log("myInputElement: " + myInputElement);
console.log("myInput: " + myInput);
$.Zebra_Dialog('Here is what you typed:', myInput);
});
});
// SECOND TRY
$('#form_to_submit').submit(function(e) {
console.log("inside form_to_submit");
**var myInputElement = document.getElementById("myTyping"), // also returns null**
myInput = myInputElement.innerText;
console.log("myInputElement: " + myInputElement);
console.log("myInput: " + myInput);
$.Zebra_Dialog('Here is what you typed:', myInput);
console.log("leaving form_to_submit");
});
// THIRD TRY
window.onsubmit = function (e) {
console.log("inside window.onsubmit, preventing default");
//e.preventDefault();
**var myInputElement = document.getElementById("myTyping"), // also returns null**
myInput = myInputElement.innerText;
console.log("myInputElement: " + myInputElement);
console.log("myInput: " + myInput);
$.Zebra_Dialog('Here is what you typed:', myInput);
console.log("leaving window.onsubmit");
}
You element is a input so innerText will not work.
Instead of
var myInputElement = document.getElementById("myTyping"),
myInput = myInputElement.innerText;
try
var myInputElement = document.getElementById("myTyping"),
myInput = myInputElement.value;
or simply
var myInput = document.getElementById("myTyping").value;
Take a look at input text object properties here
Use jQuery:
$(document).ready(function() {
// show a dialog box when clicking on a button
$("#click").bind('click', function(e) {
e.preventDefault();
$.Zebra_Dialog('Here is what you typed: '+$("#myTyping").val());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<head>
<!-- Style for Zebra Dialog boxes -->
<link rel="stylesheet" href="http://dynabitlab.it/extensions/demo_virtuemart/modules/mod_vavmm/admin/zebra/css/flat/zebra_dialog.css" type="text/css">
</head>
<header>
<h1>Testing My Dialogs and Alerts</h1>
</header>
<body>
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$myTyping = trim($_POST["myTyping"]);
// Display what the user typed in a dialog. Is there some code that needs to go here?
}
?>
<form id="form_to_submit" action="index.php" method="POST">
<fieldset>
<label>Type anything you want:</label>
<input type="text" name="myTyping" id="myTyping">
<button type="submit" id="click">Click Here to show alert and see what you typed.</button>
</fieldset>
</form>
<!-- Link to jQuery file so any plug-ins can work
Including the production version here. Can also download one for better debugging. -->
<script type="text/javascript" src="jquery-1.12.0.min.js"></script>
<!-- Link to Zebra Dialog box code -->
<script type="text/javascript" src="zebra_dialog.js"></script>
<!-- Link to My Javascript code -->
<script type="text/javascript" src="http://dynabitlab.it/extensions/demo_virtuemart/modules/mod_vavmm/admin/zebra/javascript/zebra_dialog.js"></script>
</body>
I would like to display a popup message when user is logged out, so I use
echo "<script>alert(\"You are logged out\");</script>";
But it doesn't work.
Below is my coding. Is there any logic problem in my coding?
<?php
session_start();
if(isset($_SESSION['Username']) == "admin")
{
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
#import "../CSS/Style.css";
#import "../CSS/Admin.css";
</style>
<title>Admin Home Page</title>
</head>
<body>
<div class="body"></div>
<?php
if(isset($_GET['id']) == "logout")
{
session_destroy();
echo "<script>alert(\"You are logged out\");</script>";
header("Location: ..\Main.php");
}
else
{
?>
<div class="menu">
Manage Staff
</div>
<div class="menu2">
Manage Account
</div>
<div class="logout">
Logout
</div>
<?php
}
}
else
{
?>
<center>
<p style="font-size:50px; font-weight:bold">Access Denied</p>
<p style="font-size:18px">Your request for this page has been denied because of access control</p>
</center>
<?php
}
?>
</body>
</html>
The session will be destroyed and will also redirect to Main.php, just the alert() will not come out.
You're doing an echo and then writing a relocate header. If you did your relocate in the javascript (after the user clicked the alert), it would probably work the way you expect it to.
echo "<script>alert('You are logged out'); window.location.href='..\Main.php';</script>";
Also, the way that you use isset will cause problems because isset returns true or false (it checks if a value is present), rather than returning the value.
So instead of
if(isset($_SESSION['Username']) == "admin")
You need to do:
if(isset($_SESSION['Username']) && $_SESSION['Username'] == "admin")
header("Location: ..\Main.php"); tells the browser to go to another page before it even shows the page... if you want the user to see the alert, try this:
session_destroy();
echo "<script>";
echo "alert('You are logged out');";
echo "window.location = '../Main.php';"; // redirect with javascript, after page loads
echo "</script>";
use this it will solve your problem!! first change your code from
if(isset($_SESSION['Username']) == "admin")
{
to
if(!empty($_SESSION['Username']) && ($_SESSION['Username']=="admin")){
and than use following code
if(!empty($_GET['id']) && ($_GET['id']=="logout"))
{
session_destroy();?>
<script>
alert("You are logged out");
window.location.href='..\Main.php';
</script>
<?php }?>
Try,
This must work,
And remove php header, replace with the following code.
echo "<script>alert('You are logged out');
location.href='..\Main.php';
</script>";
Here is my JS function:
function checkError() {
var field = 'error';
var url = window.location.href;
document.write('test');
window.alert('please work');
if(url.indexOf('?' + field + '=') != -1)
document.write('The username and password do not match. Do not use your full email.');
return true;
}
and then in my body paragraph I have:
<?php echo '<script> checkError();</script>' ?>
It doesn't have any errors calling it. But the function does nothing on my page. Any thoughts? I've tried putting the JS script in the page and in a JS file and correctly called for its inclusion.
Full script:
<html>
<head>
<meta charset="UTF-8">
<title>Secure Login</title>
<script type="text/JavaScript" src="js/functions.js"></script>
<link href="stylesheets/mainStyle.css" rel="stylesheet" type="text/css">
<link href="stylesheets/formStyle.css" rel="stylesheet" type="text/css">
</head>
<body>
<?php include('header.php'); ?>
<div id="mainContent">
<h1>Member Login</h1>
<div id="mainParaText">
<?php echo '<script> checkError();</script>' ?>
</div>
</body>
</html>
TURNS OUT JS Function is UNDEFINED. Ugh, can't figure out why (thought I fixed this problem a while back lol)
try like this:
<html>
<head>
<meta charset="UTF-8">
<title>Secure Login</title>
<script type="text/JavaScript" src="js/functions.js"></script>
<link href="stylesheets/mainStyle.css" rel="stylesheet" type="text/css">
<link href="stylesheets/formStyle.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
function checkError(){
var field = 'error';
var url = window.location.href;
document.write('test');
window.alert('please work');
if(url.indexOf('?' + field + '=') != -1)
document.write('The username and password do not match. Do not use your full email.');
return true;
}
<?php
echo "checkError();";
?>
</script>
</head>
<body>
<?php include('header.php'); ?>
<div id="mainContent">
<h1>Member Login</h1>
<div id="mainParaText">
<?php echo '<script> checkError();</script>' ?>
</div>
</body>
</html>
JS is client side and PHP is server side.
That means that everything in PHP code will be processed on server and then "echoed" to your browser where you get undefined error.
When debugging this you should always check source code in the browser first so you see exactly what your server echoed.
I'm guessing a bit but try with double quotes instead of single.
And not related to the question ...
You are checking username and password with JS? How exactly will you do this? With ajax call back to the server? If you check with JS that means password should be in the source code somewhere and that is NOT secure. Username / pass validation should always be made on serverside (either with ajax request or usual submit form).
I'm going sending data the Info page with ..$_get.. but I want when click ..a href=new.php?data=1.. to activate loading and Not all received data loading be enabled and after the completion information inside page new.php , loading deletion and .div id=result. is displayed or show information
new.php
<script type="text/javascript">
$(document).ready(function(){
$('a').click(function(){
$('#result').hide();
$('#main').html('<strong>loading...!</strong>;');
success:function(){
$('#main').html('');
$('#result').show();
}
});
});
</script>
<body>
<div id="main"></div>
test
<div id="result">
<?php
if(isset($_GET['data'])){
echo $_GET['data'];
}
?>
</div>
when click a href= Enable loading then when Information was received, remove loading and put the information in div result displayed
You made a mistake, click() isn't an ajax call so I don't understand why you put a success callback, try to remove it because it made a syntax JS error for sure.
There is the solution :
<script type="text/javascript">
$(document).ready(function(){
$('a').click(function(event){
$('#result').hide();
$('#main').html('<strong>loading...!</strong>;');
});
});
</script>
<body>
<div id="main"></div>
<div id="result">
<?php
if(isset($_GET['data'])){
echo $_GET['data'];
}
?>
</div>
</body>
In a htmlpage using jQuery or JavaScript how can the following be achieved?
User types in a question in a textarea and press on enter button, then the same question should be displayed dynamically in the page below the textarea and the user can enter as many questions.
And when the user is done the page is submitted through a submit button.
Can you give a small hint of how this can be done?
Try this to get started :
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#textareabutton').click(function(){
var q = $('#textarea').val(),
$p = $('<p>').html( q );
$('#questions').append( $p );
});
$('#submit').click(function(){
var tab;
tab = $('#questions p').serializeArray();
// now do something with $.ajax to submit the questions
$.post("myphp.php",tab,function(resp){
// what do I do with the server's reply ???
});
});
});
</script>
<style type="text/css">
</style>
</head>
<body>
<textarea id='textarea'></textarea>
<button type='button' id='textareabutton'>Add question</button>
<div id='questions'></div>
<button type='button' id='submit'>Submit questions</button>
</body>
</html>
Use the innerHTML property of a div to add the questions to.