Saving form values to another PHP page - javascript

I have this piece of Javascript:
<script type="text/javascript" src="sha512.js"></script>
<script type="text/javascript" src="forms.js"></script>
<script>
function loadXMLDoc(form, password)
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
formhash(form, password);
}
}
xmlhttp.open("POST","post.php",true);
xmlhttp.send();
}
</script>
And some HTML:
<div id="myDiv">
<form action="register.php" method="post">
Email: <input type="text" name="email" /><br />
Username: <input type="text" name="username" /><br />
Password: <input type="password" name="p" id="password" /><br />
<input type="button" value="Register" onclick="loadXMLDoc(this.form, this.form.password);" />
</form>
</div>
The Javascript code above has the job to run some Ajax with PHP and after that, run a encryption function (formhash).
When the Ajax is run, it reads a page named "post.php" the post.php's job is to check if any of the fields are empty, before the password is encrypted.
My problem is that post.php can't remember that there is any values from the Register form which I posted above. post.php has to remember what the user typed in the fields, in order to see if they are empty or not. Any ideas on, how I can transfer those values to the post.php file?

You can try:
parameters= 'username='+ form.elements[0].value +'&' +'password=' +form.elements[1].value ;
xmlhttp.open("POST","post.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send(parameters);

looks like you are not submitting any data to server in the below line:
xmlhttp.open("POST","post.php",true);
You can try below code to send data:
xmlhttp.open("POST","post.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("email=e#gmail.com&username=Ford&p=pass123");

Related

Send HTTP Post request to a server with a specified CSRF token

Explanation:
I am trying to create a CSRF POC, but the problem is that a CSRF-token is required on www.example.com in order to prevent CSRF attacks.
Luckily, I managed to create a CSRF-Token that is always valid; lets say "abcdef". So now I can create a working CSRF POC if only I could send the CSRF-Token with it.
Is this possible with for instance AJAX? I searched for half an hour but couldn't find any answers on this, but that's on me I guess.
This is my POC until now:
<form action="http://www.example.com/change-mail" method="post">
<input type="submit">
<input type="hidden" name="email" value="newemail#gmail.com">
<!-- TODO: Send the CSRF-Token "abcdef" with it too! -->
</form>
Help is appreciated.
Edit #Daniël
Would something like this work?
HTML Part:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
<b>Email</b><br><br>
<form id="email">
<label for="email"> Email : </label>
<input type="text" id="email" />
<br><br>
<input type="button" id="email" value="email"/>
</form>
</body>
</html>
Javascript PART:
<script>
window.addEventListener('DOMContentLoaded', function() {
var email = document.querySelector('input#email');
email.addEventListener('click', function() {
var emailStr = email.value,
url="http://www.example.com/change-mail";
if (window.XMLHttpRequest) {
xmlHttpReq = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttpReq.open('POST', url, true);
xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlHttpReq.setRequestHeader('X-CSRF-Token', abcdef);
xmlHttpReq.send("email="+emailStr);
</script>
Thanks in advance, do I have to handle the response too?
Right now, when I hit the email button, nothing happens when I log the HTTP requests... too bad.
There are a number of issues with your current code, I have corrected it below.
window.addEventListener('DOMContentLoaded', function() {
var email = document.querySelector('input#submit');
email.addEventListener('click', function() {
var emailStr = email.value,
url="http://www.example.com/change-mail";
if (window.XMLHttpRequest) {
xmlHttpReq = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttpReq.open('POST', url, true);
xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlHttpReq.setRequestHeader('X-CSRF-Token', 'abcdef');
xmlHttpReq.send("email="+emailStr);
});
});
<!DOCTYPE html>
<html>
<body>
<b>Email</b><br><br>
<form id="emailform">
<label for="email"> Email : </label>
<input type="text" id="email" />
<br><br>
<input type="button" id="submit" value="email"/>
</form>
</body>
</html>
ORIGINAL ANSWER:
You can add a header to your XMLHttpRequest (ajax) call:
xhr.setRequestHeader('X-CSRF-Token', csrf_token);

Pass text value to another php file using ajax

I have written a code that contain a text box and submit button. When I hit the enter with text box value it should go to another page(q.php) using ajax, and it should return values from there to here(home.php)
here is my code. (home.php)
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction(str) {
if (str=="") {
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","q.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form onsubmit="return myFunction(document.getElementById('fname'))">
Enter name: <input type="text"id="fname" name="fname">
<input type="submit" value="Submit">
</form>
<br>
<div id="txtHint"><b>Person info will be listed here.</b></div>
</body>
</html>
My next page(q.php)
<?php
$q = $_GET['q'];
echo $q."Some Content from this page";
?>
My answer is using html+jquery+php:-
<html>
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script><!-- add jquery library -->
<form method="post">
Enter name: <input type="text"id="fname" name="fname">
<input type="submit" value="Submit" class= "abc">
</form>
<br>
<div id="txtHint"><b>Person info will be listed here.</b></div>
</body>
</html>
<script type = "text/javascript">
$(document).ready(function(){ //when your page is rendered completly
$('.abc').click(function(e){ //when you click on submit button this function will run
e.preventDefault();//to prevent normal submission of form
if($('#fname').val() !== ''){ //check name field have some value
$.post('q.php',{'q':$('#fname').val()},function( data ){ //send value to post request in ajax to the php page
$('#txtHint').html(data); //print the response coming from php page to the result div inside your html code
});
}
});
});
</script>
And in php file:-
<?php
$q = $_POST['q'];
echo $q."Some Content from this page";
?>

Making a popup window appear on one client when another client clicks submit

Sorry, I'm new here so please forgive any bad formatting :)
I want that when the delegate from delegate.php types something in their input field and click submit, a pop up window will appear on chair's page containing the content of delegate's input field.
I've tried using AJAX but it doesn't seem to work, any help is much appreciated. I have attached delegate.php and chair.php here
delegate.php
<html>
<head>
<script src = "jquery-1.11.3.min.js"/>
<script type="text/javascript">
function validate()
{
var xmlhttp;
if(window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readystate==4 && xmlhttp.status==200)
{
document.getElementById("textContent").innerHTML=xmlhttp.responseText;
}
};
a = document.getElementById("textContent").value;
alert(a);
xmlhttp.open("GET", "temp.php?="+a, true);
xmlhttp.send();
}
</script>
<title>Delegate Page </title>
<h1> Welcome Delegate </h1>
</head>
<form>
<input type="text" name="contents" id="textContent" name="text">
<input type="submit" onclick="validate();">
</form>
</html>
chair.php
<?php
$text = $_GET['textContent'];
print '<h1>'.$text.'<h1>';
?>

Redirecting users after they submit a form

I'm trying to make a basic form that redirects users to any given web page I choose after they submit their response. Although the action element is located on a site that I can not manipulate.
How would I go about doing this?
<form method="POST" action="https://docs.google.com/forms/d/1dAp52ALtiu8tEt8UY-Rs7WcKn36pI1vBItmGl0sV0Ik/formResponse">
<input type="text" name="entry.139518212" value="">
<input type="submit" name="submit" value="Submit">
</form>
Ajax may be helpful for you. you can submit your form through Ajax, get the response and do whatever you want.
you have to create an ajax function and call it on a click event
<input id="text" type="text" name="entry.139518212" value="">
<input type="submit" name="submit" value="Submit" onclick="sendData();">
and then create a js function:
function sendData(){
///getting text from input
text=document.getElementById('text').value;
var xmlhttp;
///browser compatibility
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
///if response was retrieved and no errors occured
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
///you can access the response
///put your redirection code here
}
}
xmlhttp.open("POST","https://docs.google.com/forms/d/1dAp52ALtiu8tEt8UY-Rs7WcKn36pI1vBItmGl0sV0Ik/formResponse",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("entry.139518212="+text);
}
Try this. You will need to have jQuery for it to work.
<script type="text/javascript">
$(function() {
$('form').submit(function(){
$.post('https://docs.google.com/forms/d/1dAp52ALtiu8tEt8UY-Rs7WcKn36pI1vBItmGl0sV0Ik/formResponse', function() {
window.location = 'http://www.whereveryouwanttogo.com';
});
return false;
});
});
</script>
From HTML Form Redirect

Disabled a method post action php

Hello, I made an autocomplete function when key enter is pressed. This part works. But I also have a dynamic add button to duplicate this input. The duplicate input uses a form post. BUT now when I press enter my page refreshes and I don't want this because my autocomplete doesn't work anymore. Any idea on how I could fix it? Here the code of my input :
<td>
<span id="numpro" >
<form method="post" action="">
<input onclick="addRow(this.form);" type="button" value="+" />
<input type="text" id="name" name="add_name"onkeypress="return handleEnter(event, this, 'task');"/>
<?php
if($result!=false && mysqli_num_rows($result)>0){
while($product = mysqli_fetch_array($result)):
?>
<p id="oldRow<?=$product['id']?>">
<input type="text" name="name<?=$product['id']?>" value="<?=$product['name']?>" />
<input type="checkbox" name="delete_ids[]" value="<?=$product['id']?>"> Mark to delete</p>
<?php
endwhile;
}
?>
</form>
</span>
</td>
Here is my code for the enter key :
//------------------COMPLETE CLIENT DESC DIMANCHE----------------------
function handleEnter(e, obj, field){
if (e.keyCode == 13 || e.which == 13){
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
tempArrayInJS = JSON.parse(xmlhttp.responseText);
$("#client1").val( tempArrayInJS[0]['cliName']);
$("#desc1").val( tempArrayInJS[0]['proDescription']);
}
}
xmlhttp.open("GET","completeclient.php?q="+obj.value,true);
xmlhttp.send();
}
//Enter was pressed, handle it here
Here the code of my autocomplete :
//------------------AUTO COMPLETE NUMÉRO DE PROJET----------------------
$(document).ready(function(){
//-------AUTO COMPLETE DIMANCHE PROJET-----
$("#name").autocomplete({
source:'getautocomplete.php',
minLength:1
});
If I forgot to show you some code just tell me. Or if I'm unclear I'll try to explain better . Thanks for help!
I would inspect browser console to see what kind of requests are going on there, but I assume that with enter browser is submitting also the form that is around your html:
<form method="post" action="">
Try to put e.preventDefault() to not trigger default enter key behaviour.

Categories

Resources