Attempting to Post String to PHP dynamically - javascript

Using JavaScript only I want to POST a string to php file and redirect to it at the same time, however, my php file is not picking up the information.
JavaScript:
var data = "&id=" + obj.id;
var redirect = function(url, method) {
var form = document.createElement('form');
form.method = method;
form.action = url;
form.value = data;
document.body.appendChild(form);
form.submit();
};
redirect("summary.php","POST");
And the PHP code is simply (NO ERROR HERE, JUST FOR CONVENIENCE):
$id = $_POST['id'];
EDIT:
The problem is that the PHP file is not picking up the name "id". There is no problem in the php file or how I structure my data.


You made a small typo. ALthough it is a huge problem. In PHP you create variables using the $ sign.
var data = "id=" + obj.id;//you don't necessarilly need the & as you are only passing one item(value)
var redirect = function(url, method) {
var form = document.createElement('form');
form.method = method;
form.action = url;
//form.value = data;//this won't work. form does not have value attribute:
//create input element
var i = document.createElement("input");
i.type = "text";//set type.
i.name = "id";//set name of the input
i.id = "id";
i.value = obj.id;//set value of input
form.appendChild(i);//add this input to the form
document.body.appendChild(form);//add the form to the body
form.submit();//dynamically submit
};
redirect("summary.php","POST");
In your php script, access it like
<?php
error_reporting(E_ALL);//show all errors and notices
$id = $_POST['id'];//you forgot the $ sign
//for debugging, check the post array
print_r($_POST);
?>
EDIT:
Make sure the obj.id is not null


That's not how you pass the data. value is a property of a form's input element, not the form itself.
So remove the line form.value = data; and replace with
var input = document.createElement('input');
input.type = 'hidden';
input.name = 'id';
input.value = obj.id;
form.appendChild(input);
Now you should be able to get $_POST['id'].

Related

JS: submitting POST raw data (not KVP) into a new tab

I'm looking for a way to submit raw data, in POST, to a new tab.
Something to the extent of:
var form = document.createElement('form');
form.target = '_blank';
form.method = 'post';
form.action = 'https://example.com';
var input = document.createElement('input');
input.type = 'hidden';
input.name = 'data'; // without this part*
input.value = 'some data';
form.appendChild(input);
form.submit();
only without the KVP format.
i.e. when calling fopen('php://input', 'rb'); I want to get
'some data'
and not
'data="some data"'
Most importantly, I want to pass the data to a new tab and not get the response in AJAX

Converting a html table into a json object and sending it to a php page ,the table has a input field

i have got a html table which is dynamically created by php code taking db data.
the table's last field is a input field for entering a number.
the data from the table has to be sent to another php page for sql insert.
i am new to xml and ajax pls help me out with the above javascript code.
<script>
$(document).ready("enter").click(function(event){
event.preventDefault();
var elementTable = document.getElementById("form_table");
var jObject = [];
for (var i = 0; i < elementTable.rows.length; i++)
{
jObject[i] = [];
jObject[i][0] = elementTable.rows[i].cells[1].innerHTML;
jObject[i][1] = elementTable.rows[i].cells[2].innerHTML;//data from input field
}
console.log(jObject);
var JSONObject = encodeURIComponent(
JSON.stringify(jObject));//GETTING ERROR HERE
var url = "submit.php";
var requestData = "&dtable=" + JSONObject;
var XMLHttpRequestObj = FileResort.Utils.createRequest();
XMLHttpRequestObj.open("POST", url, true);
XMLHttpRequestObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
XMLHttpRequestObj.send(requestData);
});
</script>

as long as you are using JQuery, adapt this jsfiddle example
$("button").click(function(event){
event.preventDefault();
var tableArray = [];
$("table tbody tr:has(td)").each(function(index,element){
tableArray.push([
$(this).find("td:eq(1)").html(),
$(this).find("td:eq(2)").html()
]);
});
console.log(tableArray);
$("div").text(encodeURIComponent(
JSON.stringify(tableArray)
));
return false;
});
which is mostly what you want for the table serialization minus the ajax call ( which I think should be a POST, but that is my personal opinion )

PHP not parsing Javascript created HTML forms

I have HTML forms being created by Javascript. I also have regular forms not created by Javascript. When I submit the regular HTML form, the PHP script parses it just fine, but when I submit the Javascript created forms, it's not parsed. I can't for the life of me figure out why one parses, and the other one doesn't.
Javascript:
function addWeapon(){
var weapsForm = document.createElement("form");
weapsForm.setAttribute('name',"savefile");
weapsForm.setAttribute('method',"post");
weapsForm.setAttribute('action',"");
var weapsName = document.createElement("input");
weapsName.setAttribute('type',"text");
weapsName.setAttribute('name',"textdata[]");
var weapsNameQt = document.createElement("input");
weapsNameQt.setAttribute('type',"number");
weapsNameQt.setAttribute('name',"textdata[]");
weapsNameQt.setAttribute('value',"0");
var weapsNameSubmit = document.createElement("input");
weapsNameSubmit.setAttribute('type',"submit");
weapsNameSubmit.setAttribute('name',"submitsave");
weapsNameSubmit.setAttribute('value',"Done!");
weapsForm.appendChild(weapsName);
weapsForm.appendChild(weapsNameQt);
weapsForm.appendChild(weapsNameSubmit);
document.getElementsByTagName('body')[0].appendChild(weapsForm);
}
And here's the PHP code which parses the HTML form no problem. I'd also like to add, the Javascript created HTML is exactly the same as the regular HTML.
PHP:
<?php
if (isset($_POST)){
if ($_POST['submitsave'] == "Done!" && !empty($_POST['filename'])) {
foreach($_POST["textdata"] as $text){
if(!file_exists($_POST['filename'] . ".txt")){
$file = tmpfile();
}
$file = fopen($_POST['filename'] . ".txt","a+");
while(!feof($file)){
$old = $old . fgets($file);
}
file_put_contents($_POST['filename'] . ".txt", trim($text).PHP_EOL, FILE_APPEND);
}
fclose($file);
}
}
?>
Thanks for any help guys!
EDIT: I forgot to mention the "filename" field is in the HTML document, and is not created by Javascript.
EDIT: Also, the file is created on the server, but the forms are not being parsed.
EDIT: After messing with the code for a couple of hours, I realized it was in fact not parsing the "filename" field on the HTML document, but was parsing the Javascript form. Thank you guys for the help!

The form you are making with the Javascript is missing the filename field.. You either need to add the filename field in the Javascript for like below:
function addWeapon(){
var weapsForm = document.createElement("form");
weapsForm.setAttribute('name',"savefile");
weapsForm.setAttribute('method',"post");
weapsForm.setAttribute('action',"");
var weapsName = document.createElement("input");
weapsName.setAttribute('type',"text");
weapsName.setAttribute('name',"textdata[]");
var weapsNameQt = document.createElement("input");
weapsNameQt.setAttribute('type',"number");
weapsNameQt.setAttribute('name',"textdata[]");
weapsNameQt.setAttribute('value',"0");
var weapsfilename = document.createElement("input");
weapsfilename.setAttribute('type',"text");
weapsfilename.setAttribute('name',"filename");
weapsfilename.setAttribute('value',"SomeFile.txt");
var weapsNameSubmit = document.createElement("input");
weapsNameSubmit.setAttribute('type',"submit");
weapsNameSubmit.setAttribute('name',"submitsave");
weapsNameSubmit.setAttribute('value',"Done!");
weapsForm.appendChild(weapsName);
weapsForm.appendChild(weapsNameQt);
weapsForm.appendChild(weapsNameSubmit);
document.getElementsByTagName('body')[0].appendChild(weapsForm);
}
Or you need to change your conditional in php not to be based on the filename like so:
<?php
if (isset($_POST)){
if ($_POST['submitsave'] == "Done!") {
// New code parsing the other fields since you are no longer grabbing a file
}
}
?>

Looking at your code it seems that you need to add following code in your javascript.
function addWeapon(){
var weapsForm = document.createElement("form");
weapsForm.setAttribute('name',"savefile");
weapsForm.setAttribute('method',"post");
weapsForm.setAttribute('action',"");
var weapsName = document.createElement("input");
weapsName.setAttribute('type',"text");
weapsName.setAttribute('name',"textdata[]");
var weapsNameQt = document.createElement("input");
weapsNameQt.setAttribute('type',"number");
weapsNameQt.setAttribute('name',"textdata[]");
weapsNameQt.setAttribute('value',"0");
var weapsFile = document.createElement("input");
weapsFile.setAttribute('type',"file");
weapsFile.setAttribute('name',"filename");
weapsFile.setAttribute('value',"0");
var weapsNameSubmit = document.createElement("input");
weapsNameSubmit.setAttribute('type',"submit");
weapsNameSubmit.setAttribute('name',"submitsave");
weapsNameSubmit.setAttribute('value',"Done!");
weapsForm.appendChild(weapsName);
weapsForm.appendChild(weapsNameQt);
weapsForm.appendChild(weapsFile);
weapsForm.appendChild(weapsNameSubmit);
document.getElementsByTagName('body')[0].appendChild(weapsForm);
}
And in php you need to print $_FILES instead of $_POST to get filename.

I gues your $_POST['filename'] is empty.
empty() function in php check is variable has some value. So if you do not choose your file it will return true ( empty ). Try to use isset() if you need to check is your input was sent.

JavaScript/PHP: Get referral key URL

I'm working on an ajax (native JavaScript) form. I'm having trouble getting the referral key and sending it to the PHP back-end.
The idea is that the ajax request sends the entire URL (with the form data) as string to the PHP engine. I can then break down the URL in the PHP and extract the key.
Here is what I have so far:
Page url:
http://example.com?ref=gr84r34ijg98g
JS:
// Send the form data with the URL
function getquerystring() {
var email = document.getElementById('email').value;
var URL = document.URL;
qstr = 'email=' + email + '& URL=' + URL;
return qstr;
}
Then, in my PHP, I can retrieve the form data and url:
$email = $_POST['email'];
$url = $_POST['URL'];
How can I then break-down the URL, so as I only have the code at end as string? I was thinking I could break-down the URL in JavaScript before sending it, although I thought it might be easier to do that part with PHP.
Something like a preg_match() that removes "http://example.com?ref=" would probably do. Although not really sure how to do that.

Yes, you can get the value of ref in Javascript
function getquerystring() {
var email = document.getElementById('email').value;
var URL = document.URL;
var URL_arr = URL.split('ref='); //<-- URL_arr[1] will give ref string
qstr = 'email=' + email + '&URL=' + URL;
return qstr;
}

function getquerystring() {
var email = document.getElementById('email').value;
var URL = document.URL;
qstr = '?email=' + email + '& URL=' + URL;
return qstr;
}
try this.
$email = $_GET['email'];
$url = $_GET['URL'];

There is an extra space before URL .. and you should encode it with encodeURIComponent. Update this line
qstr = 'email=' + encodeURIComponent(email) + '&URL=' + encodeURIComponent(URL);
And on php side
$url = url_decode($_POST['URL']);
$email = url_decode($_POST['email']);

Try this:
var query = window.location.search.substring(1).split('&');
var ref = '';
$.each(query, function(i, v) {
v = v.split('=');
if (v[0] === 'ref') {
ref = v[1];
return false;
}
});
console.log(ref);

Why don't you just do the following in PHP (place it in either a header (if you want it to work on all pages) or at the top of index.php after all your includes :
<?php
$ref = (isset($_GET['ref']) && strlen($_GET['ref']) > 0) ? trim($_GET['ref']) : null;
//Process what ever you wanted to process from the beginning if you had a referral code
if(!is_null($ref)) {
// do your action
}
?>
Using the above you don't really need any kind of javascript.

How to use iframe to (cross-domain) post request ?

I want to do a post cross-domain request , I use a form which targeted a iframe to submit the request.
var iframe = document.createElement("iframe");
var uniqueString = "CHANGE_THIS_TO_SOME_UNIQUE_STRING";
document.body.appendChild(iframe);
iframe.style.display = "none";
iframe.contentWindow.name = uniqueString;
var form = document.createElement("form");
form.target = uniqueString;
form.action = myUrl;
form.method = "POST";
// repeat for each parameter
var input = document.createElement("input");
input.type = "hidden";
input.name = "setting";
input.value = params;
form.appendChild(input);
document.body.appendChild(form);
form.submit();
iframe.onload = iframe.onreadystatechange = function(){
if(this.readyState && this.readyState!="complete") return ;
else{
alert("haha");
}
};
The Chrome shows iframe has receive the returned data from remote url, but i cannot get the iframe content using Javascript ? Do you guys have any advices or solutions ?

You should add a parameter to the form with a GUID. There server should save in the session the GUID with the specific answers.
After that you send the form you call the server via JSONP with the GUID that you used in the server and the server should return the asnwers that it saved in the session.

Categories