This is my HTML
<form class="login-form" method="POST">
<input type="password" placeholder="password" id="password" name="password"/>
<input type="button" id="login" name="login" value="login" onclick="redirect()"></input>
</form>
And my JS
<script type="text/javascript">
$(document).ready(function redirect(){
$("#login").click(function(){
var pwd="<?php echo $pwd?>";
alert("<?php echo "this is pass".$pword?>");
if(userID===user && pwd===pass)
{
window.location.href = 'http://localhost/Annapoorna/Welcome_Page.php';
}
else
{
alert("Please enter correct username and password!");
}
}
});
});
</script>
And PHP
<?php
$username="";
$pwd="";
$pword="";
function confirm(){
if(isset($_REQUEST['password']))
{
$pword = $_REQUEST['password'];
}
$sth->execute(array(':pass'=>$pword));
foreach ($sth->fetchAll() as $row) {
$username=$row['username'];
$pwd=$row['password'];
echo $pword;
}
?>
$_POST is not returning any value. Have tried $_REQUEST, but didn't work. Have also assigned both ID and name to the password field.
You are not submitting your form, just redirecting user to that page. Try this
<form id='myForm' class="login-form" method="POST" action='/Annapoorna/Welcome_Page.php'>
<input type="password" placeholder="password" id="password" name="password"/>
<input type="button" id="login" name="login" value="login" onclick="redirect()"></input>
</form>
in your javascript
<script type="text/javascript">
$(document).ready(function redirect(){
$("#login").click(function(){
var pwd="<?php echo $pwd?>";
alert("<?php echo "this is pass".$pword?>");
if(userID===user && pwd===pass)
{
$('#myForm').submit();
}
else
{
alert("Please enter correct username and password!");
}
}
});
});
Related
Recently I've been facing this problem for a couple days. The login validation works perfectly. Unfortunately, I can't redirect to another page which is index.php after I try to login, and the login form is reloading on the same page at the bottom of the form instead, which is supposed to be for the error message just in case the user inputted the wrong username or password. Here are the screenshots of the form:
Screenshot of the login form at login.php
Screenshot of the login form when the user doesn't fill all the fields
Screenshot of the login form when the user inputted the wrong username or password
Screenshot of the login form after the user inputted the correct username and password, the form is reloading on the same page. Instead, I want it to redirect to another page, which is index.php
Here's my code:
login.php
<?php
require_once 'templates/header.php';
?>
<link rel="stylesheet" type="text/css" href="styles/login-style.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#login').click(function(){
var username = $('#usernameID').val();
var password = $('#passwordID').val();
$.post("classes/validation_login.php",{
user_val : username,
password_val : password,
},function(data){
if(data == 'success'){
window.location.href='index.php';
}else{
$('.error-message').html(data);
}
});
});
});
</script>
<title>Login</title>
<form id="login-form">
<h1>Login</h1>
<input type="text" id="usernameID" name="username" placeholder="Username" autocomplete="off"> <br>
<input type="password" id="passwordID" name="password" placeholder="Password" autocomplete="off"> <br>
<input type="button" id="login" name="register-button" value="Login">
</form>
<div class="error-message">
</div>
<?php
require_once 'templates/footer.php';
?>
validation_login.php
<?php
require_once '../core/init.php';
class validation_login{
private $username,$password;
public $errorMessage;
public function validate_login(){
$db = new database();
$this->username = input::get('user_val');
$this->password = input::get('password_val');
if(empty($this->username) || empty($this->password)){
$this->errorMessage = "Please fill all the fields!";
return false;
}else if(!$db->login()){
$this->errorMessage = "Invalid username or password!";
return false;
}else{
session::set('username',$this->username);
return true;
}
}
}
$login = new validation_login;
$login->validate_login();
echo "$login->errorMessage";
?>
Any help would be appreciated. Thank you!
You redirect within the ajax call. Thats the misstake.
Remove the AJAX call and add an action tag to the form. (to validation_login.php)
<form action="validate_login.php" method="post" id="login-form">
It is because you cannot redirect on the server side when using ajax, try returning a value and redirect base in the value, you can rewrite your code as below
validation_login.php
<?php
require_once '../core/init.php';
class validation_login{
private $username,$password;
public $errorMessage;
public function validate_login(){
$db = new database();
$this->username = input::get('user_val');
$this->password = input::get('password_val');
if(empty($this->username) || empty($this->password)){
$this->errorMessage = "Please fill all the fields!";
}else if(!$db->login()){
return false;
}else{
session::set('username',$this->username);
return true;
}
}
}
?>
login.php
<?php
require_once 'templates/header.php';
?>
<link rel="stylesheet" type="text/css" href="styles/login-style.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#login').click(function(){
var username = $('#usernameID').val();
var password = $('#passwordID').val();
$.post("classes/validation_login.php",{
user_val : username,
password_val : password,
},function(data){
if(data){
//means validation went through
//redirect user
window.location.href='index.php';
}else{
//validation returned false
//display error message
$('.error-message').html('incorrect Username or password');
}
});
});
});
</script>
<title>Login</title>
<form id="login-form">
<h1>Login</h1>
<input type="text" id="usernameID" name="username" placeholder="Username" autocomplete="off"> <br>
<input type="password" id="passwordID" name="password" placeholder="Password" autocomplete="off"> <br>
<input type="button" id="login" name="register-button" value="Login">
</form>
<div class="error-message">
</div>
<?php
require_once 'templates/footer.php';
?>
i try with below code but it's not working Please help me if any one know
<script>
function update(i){
document.myform[i].submit();
}
</script>
<?php
for($i=0;$i<5;$i++){
?>
<form name="myform[]" action="act.php" method="POST">
<input type="text" name="fname" value="">
click here
</form>
<?php
}
?>
Just change the link for an input of type submit:
<form name="myform[]" action="act.php" method="POST">
<input type="text" name="fname" value="">
<input type="submit" name="aname" value="click here">
</form>
It will automatically submit the form where is contained, no need for this javascript:
<script>
function update(i){
document.myform[i].submit();
}
</script>
Edit:
in order to submit a form from javascript..
document.getElementsByName("myForm")[i].submit();
i got solution
<script>
function update(i){
console.log(i);
//alert(document.myform[i].fname.value);
var oForm = document.forms[i];
// alert(document.forms[i].fname.value);
// alert(oForm.fname.value);
oForm.submit();
//document.myform[i].submit();
}
</script>
<?php
for($i=0;$i<5;$i++){
?>
<form name="myform<?php echo $i;?>" action="act.php" method="POST">
<input type="text" name="fname_<?php echo $i;?>" id="fname_<?php echo $i;?>" value="">
click here
</form>
<?php
}
?>
<script>
function update(id){
var formName = jQuery(id).closest('form').attr('name')
alert(formName);
}
</script>
or js:
<script>
function update(id){
var el = document.getElementById(id);
var r3 = el.closest("form");
console.log(r3);
}
</script>
I have 3 separate forms each with their own submit buttons (removed all other lines of form code as not required):
<form action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>" method="post" name="postingTopicSub" id="postingTopicSub" enctype="multipart/form-data">
<input type="button" name="submittopic" id="submittopic" value="Submit" onclick="topicPostSubmit();"/>
<form action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>" method="post" name="postingTopicReply" id="postingTopicReply" enctype="multipart/form-data">
<input type="button" name="submitreply" id="submitreply" value="Submit" onclick="replyPostSubmit();"/>
<form action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>" method="post" name="postingTopicEdit" id="postingTopicEdit" enctype="multipart/form-data">
<input type="button" name="submitedit" id="submitedit" value="Submit" onclick="editPostSubmit();"/>
I am using Javascript to verify the form data is filled in before submitting however because using JavaScript the POST data from the button is not being sent.
JavaScript submit for each form:
document.getElementById("postingTopicSub").submit();
document.getElementById("postingTopicReply").submit();
document.getElementById("postingTopicEdit").submit();
On my data page I use isset to make the SQL queries run are for the correct form:
// User meets all conditions and posts a topic
if (isset($_POST['topicID'], $_POST['subject'], $_POST['post_text'], $_SESSION['username'], $_POST['submittopic']) && !isset($_POST['forumID'])) {
// User meets all conditions and posts a reply
if (isset($_POST['topicID'], $_POST['post_text'], $_SESSION['username'], $_POST['submitreply'], $_POST['forumID'], $_POST['subject'])) {
// User meets all conditions and edits a post
if (isset($_POST['topicID'], $_POST['post_text'], $_SESSION['username'], $_POST['submitedit'], $_POST['forumID'], $_POST['postID'], $_POST['subject'])) {
My questions:
Is there a way to keep my method of keeping the 3 SQL queries separate
to the specific forms
Is there a way to sent the POST of the submit even though it is being
submitted through JavaScript?
Is there another way that I just haven't seen.
Thanks in advance.
EDIT:
Full form (without bbcodes)
<form action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>" method="post" name="postingTopicSub" id="postingTopicSub" enctype="multipart/form-data">
<input type="hidden" name="topicID" id="topicID" value="<?php echo $topicID ?>"/>
<div class="post-subject">
Subject:
<input type="text" name="subject" id="subject" />
</div>
<div class="post-textarea">
<textarea name="post_text" id="post_text" cols="100" rows="30"></textarea>
</div>
<div class="post-button">
<input type="button" name="submittopic" id="submittopic" value="Submit" onclick="topicPostSubmit();"/>
</div>
</form>
Full JS for form validation:
function forumssubmit()
{
var subject = document.getElementById("subject").value;
var text = document.getElementById("post_text").value;
if(subject=="" || text=="")
{
alert('Please fill in the subject and text');
return false;
}
return true;
}
function topicPostSubmit()
{
if(forumssubmit())
{
document.getElementById("postingTopicSub").submit();
}
}
EDIT2::
New js:
function forumssubmit()
{
var subject = document.getElementById("subject").value;
var text = document.getElementById("post_text").value;
if(subject=="" || text=="")
{
alert('Please fill in the subject and text');
return false;
}
return true;
}
function topicPostSubmit()
{
if(forumssubmit())
{
//document.getElementById("postingTopicSub").submit();
return true;
}
}
New button:
<input type="button" name="submittopic" id="submittopic" value="Submit" onclick="return topicPostSubmit();"/>
If you're really just "using Javascript to verify the form data is filled" you can add a return to the onclick's of your submit buttons. You'll then be able to use those for submitting the form instead of Javascript.
<form action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>" method="post" name="postingTopicSub" id="postingTopicSub" enctype="multipart/form-data">
<input type="submit" name="submittopic" id="submittopic" value="Submit" onclick="return topicPostSubmit()"/>
<form action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>" method="post" name="postingTopicReply" id="postingTopicReply" enctype="multipart/form-data">
<input type="submit" name="submitreply" id="submitreply" value="Submit" onclick="return replyPostSubmit()"/>
<form action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>" method="post" name="postingTopicEdit" id="postingTopicEdit" enctype="multipart/form-data">
<input type="submit" name="submitedit" id="submitedit" value="Submit" onclick="return editPostSubmit()"/>
Then in the javascript if you have a bad state return false.
function editPostSubmit(){
if(data == 'bad')
return false;
return true;
}
I also want to make sure you're doing data validation on the backend. We don't want to allow SQL injection on your page.
Edit:
Updated your modified code.
<form action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>" method="post" name="postingTopicSub" id="postingTopicSub" enctype="multipart/form-data">
<input type="hidden" name="topicID" id="topicID" value="<?php echo $topicID ?>"/>
<div class="post-subject">
Subject:
<input type="text" name="subject" id="subject" />
</div>
<div class="post-textarea">
<textarea name="post_text" id="post_text" cols="100" rows="30"></textarea>
</div>
<div class="post-button">
<input type="submit" name="submittopic" id="submittopic" value="Submit" onclick="return forumssubmit();"/>
</div>
</form>
How to check sign using javascript and php , Like this ?
First, user will fill data in to input username and password
If username and password correct, It's will be alert SUCCESS
But username or password incorrect, It's will be alert FAIL
I tested my code, But not work. How can i do that ?
HTML
<form method="post" action="" ENCTYPE = "multipart/form-data" onsubmit="return checkform(this);" id="sign_in_fid">
<label>
Your Username
</label>
<input type="text" name="username" id="username">
<br>
<label>
Your Password
</label>
<input type="password" name="password" id="password">
<br>
<br>
<input name="submit" type="submit" value="Sign in"/>
</form>
JAVASCRIPT
<script language="JavaScript" type="text/javascript">
function checkform ( form )
{
var username_val = document.getElementById("username").value;
var password_val = document.getElementById("password").value;
</script>
<?PHP
include("connect.php");
$strUsername = "<script>document.writeln(username_val);</script>";
$strPassword = "<script>document.writeln(password_val);</script>";
$sql = "SELECT * FROM av8_users WHERE BINARY username = '$strUsername' and password = '$strPassword'";
$result=mysql_query($sql);
$row=mysql_fetch_array($result);
$active=$row['active'];
$count=mysql_num_rows($result);
if($count==1)
{
?>
<script>
alert("SUCCESS");
</script>
<?PHP
}
else
{
?>
<script>
alert("FAIL");
</script>
<?PHP
}
?>
<script>
return true ;
}
</script>
The reason your code is failing is you are using JavaScript inside php code.
Try changing your
$strUsername = "<script>document.writeln(username_val);</script>";
$strPassword = "<script>document.writeln(password_val);</script>";
To
$strUsername = $_POST['username'];
$strPassword = $_POST['password'];
PHP Code :
<?php
if(isset($_POST['submit']))
{
$sent = mail($to, $subject, $email_message, $headers) ;
if($sent)
{
echo '<script> cleartext(); </script>';
}
}
?>
JavaScript :
<script type="text/javascript">
function cleartext()
{
alert(document.getElementById('name').value);
document.getElementById('name').value = '';
document.getElementById('email').value = '';
document.getElementById('phone').value = '';
document.getElementById('message').value = '';
alert(document.getElementById('name').value);
}
</script>
Source Code :
<form action="#" method="post" class="margin-bottom" target="hidden" id="contact">
<div class="row">
<div class="col-lg-6 col-sm-6">
<input type="text" placeholder="Your Name*" id="name" name="name" />
</div>
<div class="col-lg-6 col-sm-6">
<input type="text" placeholder="Your Email*" id="email" name="email" />
</div>
<div class="col-lg-6 col-sm-6">
<input type="text" placeholder="Your Phone*" id="phone" maxlength="13" name="phone" />
</div>
</div>
<textarea placeholder="Message" id="message" name="message"></textarea>
<input type="submit" id="clear" name="clear" class="button" value="Clear " onClick="cleartext();">
<input name="submit" type="submit" class="button" id="submit" onClick="MM_validateForm('name','','R','email','','RisEmail','phone','','RisNum','message','','R');return document.MM_returnValue" value="Submit ">
</form>
Problem
I want to clear all input text after sending a mail on submit.on submit I am calling cleartext() from my PHP code.but on that time I am not being able to clear my input text value.And when I call cleartext() method on clear button it's works proper.if somebody have idea about it so please help me.
You missed script type. that might be the problem.
<?php
//stuff to do
echo '<script type="text/javascript">
cleartext();
</script>';
?>
see this How to call a JavaScript function from PHP?
For button to clear fields, use type "reset" instead of "submit"
<input type="reset" value="Clear" />
And to clear the fields after submit, try redirecting
if($sent) {
header('Location: ' . $_SERVER['PHP_SELF']);
exit(0);
}
you can put a setTimeout in the onClick of the js function that clear the form
<input name="submit" type="submit" class="button" id="submit" onClick="setTimeout( MM_validateForm, 1000 )" >
Try this:
PHP:
if(isset($_POST['submit']))
{
$sent = mail($to, $subject, $email_message, $headers) ;
if($sent) $b_sent = true;
}
Javascript:
function cleartext()
{
alert(document.getElementById('name').value);
document.getElementById('name').value = '';
document.getElementById('email').value = '';
document.getElementById('phone').value = '';
document.getElementById('message').value = '';
alert(document.getElementById('name').value);
}
var bClear = <?= $b_sent? 'true':'false' ?>;
if (bClear) cleartext();
you using submit button for clear, it shouldn't work because the form will be submitting its values
and the way is you should make it return false in onclick in order to prevent submitting form.
your code should be like this:
<input type="submit" id="clear" name="clear" class="button" value="Clear " onClick="cleartext(); return false;">