We Keep Coding

How do you send more than 2 forms to PHP?

I've gotten an assignment and it is:
Make a website/page which processes forms. You shall have atleast 4 questions/forms and you need to process it in php. After that you should be able to tell the user what they got wrong and what they got right. You should also be able to write your name and it should appear on the php site somewhere.
So here I am with a site, I got 3 questions so far (I wanted to try before I went full scale). I use jQuery to hide and show the questions and I use radio inputs and a text input for the name. When I hit submit I've tried almost everything. Currently working with jQuery like this:
$(".knapp3").click(function() {
$('#fraga1, #fraga2, #name, #fraga3').submit();
});
The php only processes the value inside #name which is my text input. My forms look like this:
<div class="fraga1">
<h1>Hejsan?</h1><br>
<form id="fraga1" action="idk.php" method="POST">
<input type="radio" name="tva" value="1">hej<br>
<input type="radio" name="tva" value="12">Hejsan<br>
<input type="radio" name="tva" value="13">Tjena<br>
</form>
</div>
<div class="fraga2">
<h1>Vad heter jag?</h1><br>
<form id="fraga2" action="idk.php" method="POST">
<input type="radio" name="tva" value="2">qqq<br>
<input type="radio" name="tva" value="22">123<br>
<input type="radio" name="tva" value="23">xxx<br>
</form>
</div>
<div class="fraga3">
<h1>Vilken linje går jag?</h1>
<form id="fraga3" action="idk.php" method="POST">
<input type="radio" name="tre" value="1">Teknik<br>
<input type="radio" name="tre" value="32">Samhälle<br>
</form>
</div>
<div class="namn">
<form id="name" action="idk.php" method="POST">
Skriv in namn: <input type="text" name="name"><br>
</form>
</div>
What is wrong? the php looks like this:
<?php
$x = 0;
if (isset($_POST["fraga1"])){ //if isset is nothing, therefore it doesnt run these statements.
$fraga1 = $_POST["fraga1"];
if($fraga1 == 1){
$x+1;
}
}
if(isset($_POST["fraga2"])){
$fraga2 = $_POST["fraga2"];
if($fraga2 == 2){
$x+1;
}
}
if(isset($_POST["fraga3"])){
$fraga3 = $_POST["fraga3"];
if($fraga3 == 3){
$x+1;
}
}
else{
echo '<p>Nope</p>';
}
echo $x;
?>
<?php
echo $_POST["name"]; //Only this one is working.
echo $_POST["fraga1"]; //This one gives the error "undefined index"
?>

Problem is solved. The solution is was like someone commented, to submit just 1 form and put all the data in there. To access it from php you just needed the name of the radio input.

use the tag id="fraga1" /2/3/4 in your inputs and put them in one form, then use the following jquery-post to send it to php in onclick-event of submit button
$.ajax({
type: 'POST',
url: 'idk.php',
data: {fraga1:$('#fraga1').val(),fraga2:$('#fraga2').val(),fraga3:$('#fraga3').val(),fraga4:$('#fraga4').val()},
dataType: "json",
success: function (data) {
//do something...
},
error: function (err) {
console.log(err)
}
});
you can use javascript jquery to $('.fraga2').show() and $('.fraga1').hide() the questions and at the end execute to post above in a button event. this is very basic programming, if you didn't have a idea how to do this i recommend reading 2 or 3 tutorials on basic php an js or go to a forum for dummis and not pros.

How To use Query string in java script?

I have Created calculator project. I have only two pages. Now my question how to pass input field value to another page? trying too many ways its Not Working.
What to do to pass input fields values from one page to another page?
My input fields code Looks Like
<p class="pull-right">DPA Minimum Buyer Contribution<br /></p>
<div class="row">
<div class="col-md-3">
</div>
<div class="col-md-6" style="padding-right:1%">
<input type="text" id="txtLocationContactName5" class="txt"/>
</div>
<div class="col-md-3" style="padding-left:0%">
Another page name default_results.php I have created input fields
<div class="col-md-5 padding-rht">
Minimum Buyer Contribution
</div>
<div class="col-md-2 padding-Zero">
<input type="text" id="txtCustomerName3" class="txt" />
</div>
I have tired in jQuery script
<script>
$(function () {
$("#btnQueryString").bind("click", function () {
var url = "default_results.php?id=" + encodeURIComponent($("#txtLocationContactName5").val()) + "&technology=" + encodeURIComponent($("#txtCustomerName3").val());
window.location.href = url;
});
});
</script
but Not working so how to pass value one page to other page ?

You're making life hard for yourself! A simple form is needed to help you pass data to another page :). See here for info on html Forms - http://www.w3schools.com/html/html_forms.asp
Here is a simple example for you:
<form action="page_2_link" method="POST">
<input type="text" name="field1" value="easy">
<input type="submit" name="button1" value="Submit">
</form>
Then on the second page you can do this to retrieve the form data:
<?php
$blah = $_POST['field1']; // this now has the posted fields value
?>
I have given the second page answer in PHP as you have used this as a tag for this question, so I hope you are using this or my answer won't work.

How to submit two forms at a time and store first form submit output value as 2nd form value?

Using the below form 1, i'm generating a goo.gl short url inline in #shortUrlInfo area. I want to use the generated short url in 2nd form to save it in wordpress custom field.
Form 1:
<form method="post" action="">
<input style="display:none;" type='text' id='longUrl' value='<?php echo get_post_meta( get_the_ID(), 'longurl', true ); ?>' />
<input name="shorturlinput" type="button" id="shortIt" value="Short It" /></form>
<div class="info" id="shortUrlInfo"></div>
Form 2:
<?php
global $post;
if( isset($_POST['submit_meta']) ) {
if( ! empty($_POST['change_meta']) ) {
update_post_meta($post->ID, 'shorturl', $_POST['change_meta']);
}}
?>
<form method="post" action="">
<input type="text" name="change_meta" value="" />
<input type="submit" name="submit_meta" value="Submit" />
</form>
How can i submit the first form and pass the generated short url to 2nd form and submit that short url value in custom field with one click?
Or atleast, how can we display the generated short url in 2nd form input, which if we click on submit button, it should save in database.
It's my first question here & I've tried my best to find answer before posting here with no luck.

Well its all ajax . you need to post your data with ajax function to the controller which save the shortened url in data base , how ? like this :
give your second form + the first input of your second form 2 ids
$("#shortIt").click(function(){
var longUrl = $('#longUrl').val()
$.post("ur_url.php",
{
"longUrl": longUrl // here the url will be sent to your server and server communicates
// with goo.gl url shorter by its api and respond you with a variable called data
},
function(data, status){ // your server send here the shorturl and this function calls it
//also this function will be run after the server respond is completed
$('#inputID').val(data) // data will be set inside the input value
document.getElementById("#SecondForm").submit(); // your second form submits and your
// server needs to get the data and save it in your data base
});
});
all will be done with a single click .
also you can do many things when the process is going on . but i hope i gave you some clue :P

Try this in HTML:
<form (return to script)>
<input 1>
</form>
<input 2>
Then in script:
get input 1 and input 2

Next example code shows how to achieve what I believe you want (with one click!). Explanation first: one form (file #1) sends a text to a script (file #2), this script redirects to another form (file #3), this form gets the original text and automatically resend it to another script (file #4) that inserts it in database, next image explains it better:
As you can see, the text in the first form becomes a value for the second form.
Now the code. In order to test next code, you will have to create four text files and give them the given names (if you change the filenames, you will have to change the "action" property in the forms), copy-paste my code in your files, then, open you browser and run only the first file like this) :
http://localhost/form_sequence_1.php
These are the files:
form_sequence_1.php
<html>
<body>
FORM 1
<br/>
<form method="post" action="form_sequence_2.php">
Enter a text
<input type="text" name="my_text" />
<br/>
<input type="submit" value="Send text" />
</form>
</body>
</html>
form_sequence_2.php
<?php
session_start();
$_SESSION[ "my_text" ] = $_POST[ "my_text" ];
header( "Location: form_sequence_3.php" );
?>
form_sequence_3.php
<?php
session_start();
?>
<html>
<head>
<script type="text/javascript">
function autosendform () {
setTimeout( "sendform()","3000" );
}
function sendform () {
document.getElementById( "my_form" ).submit();
}
</script>
</head>
<body onload="autosendform();">
FORM 2
<br/>
<form method="post" action="form_sequence_4.php" id="my_form">
Text entered in previous form
<input type="text" name="my_text" value="<?php echo $_SESSION[ "my_text" ]; ?>"/>
<br/>
<input type="submit" value="AUTOSENDING FORM IN 3 SECONDS" />
</form>
</body>
</html>
form_sequence_4.php
<?php
session_start();
echo $_SESSION[ "my_text" ] . " succesfully inserted into database.";
?>
More explanations:
Value in form 1 sends the text to form 2.
In the middle of form 1 and form 2 we need a script to capture the value.
Form 2 automatically resends the value thanks to a timer in JavaScript.
The last script gets the value and insert it in database (not for real).
The advantage of this approach is that the scripts allow you to do many things with the value or values, like validating or conversion.
Next is your code with my JavaScript timer code adapted :
<?php
global $post;
if ( isset($_POST['submit_meta']) )
if ( ! empty($_POST['change_meta']) )
update_post_meta( $post->ID, 'shorturl',$_POST['change_meta'] );
?>
<html>
<head>
<script type="text/javascript">
function autosendform () {
setTimeout( "sendform()","3000" );
}
function sendform () {
document.getElementById( "my_form" ).submit();
}
</script>
</head>
<body onload="autosendform();">
<form method="post" action="" id="my_form">
<input type="text" name="change_meta" value="" />
<input type="submit" name="submit_meta" value="Submit" />
</form>
</body>
</html>

Why do I get only 000000 as the add on number in a PHP Ajax file transfer with add on number?

I got help from stackoverflow but I do get now only 000000 as the add on numbers:
1) I want to Format ID2 to "000000" six digits, example if the ID2 is 302 then should it be "000302"
2) I want to combine the now formatted data (000302) in with .$_FILES['file']['name'] in the upload.php file and save the file with this new file name.
The $new_id have always "000000", whatever I do.
I am still lost how to do it, even the first help was very good!
The file transfer code is not from me. It is a code that is from the internet.
I would be very happy for any help!
This is the in the head section:
<script type="text/javascript" src="js/multiupload.js"></script>
<script type="text/javascript">
var config =
{
support : "image/jpg,image/png,image/bmp,image/jpeg,image/gif", // Valid file formats
form: "demoFiler", // Form ID
dragArea: "dragAndDropFiles", // Upload Area ID
uploadUrl: "upload.php" // Server side upload url
}
$(document).ready(function(){
initMultiUploader(config);
});
</script>
This in the body section:
<div id="dragAndDropFiles" class="uploadArea">
<br>
<span style="padding-left: 20px">To upload more pictures for this item click Browse</span>
<br>
<span style="padding-left: 20px">The order of the upload decide the order to show the pictures</span>
</div>
<form name="demoFiler" id="demoFiler" enctype="multipart/form-data" style="">
<input id="ID2" type="hidden" name="ID2">
<input type="file" name="multiUpload" id="multiUpload" multiple />
<input type="submit" name="submitHandler" id="submitHandler" value="Upload" class="buttonUpload" />
</form>
<div class="progressBar">
<div class="status"></div>
</div>
This the file upload.php
<?php
if($_SERVER['REQUEST_METHOD'] == "POST"){
$new_id = sprintf( "%06d", $_POST['ID2']);
if(move_uploaded_file($_FILES['file']['tmp_name'], "sobimages/" . $new_id . $_FILES['file']['name'])){
echo($_POST['index']);
}
exit;
}?>

You are sending a form field in the form that is hidden:
<input id="ID2" type="hidden" name="ID2">
But it has no value and as the user will not see it and fill in a value, it will always be empty / 0.
You should not use this approach as the user could manipulate the number. If you have the number already available, you should keep it on the server, for example in a session variable, and use that instead.

Modifying HTML form action with jQuery/Javascript

I am trying to create a post form in HTML using a RESTful express route, something akin to /game/:gameID/node/:nodeRow/:nodeCol/update to update a given node in a given game.
Here's the route code:
app.post("/game/:gameID/node/:nodeRow/:nodeCol/update", function(request, response) {
gameHandler.updateNode(request, response)
});
The reason I'm doing this in HTML is because I haven't created the functionality yet in the actual client (mobile game) so I need something to test it. However, I have not figured out how to make the HTML form so that I can enter the data in the form to replace :gameID, :nodeRow, and :nodeCol without just going to the URL manually, like /game/3/node/2/5/update.
This is a post request and I would like other data to be contained in the form to specify the property to update as well as the new value.
How can I do this, or am I thinking about it wrong?
Edit:
Changed the question title to be more useful.

Try
app.post("/game/:gameID/node/:nodeRow/:nodeCol/update", function(request, response) {
console.log({gameID: request.params.gameID, nodeRow: request.params.nodeRow,nodeCol: request.params.nodeCol, body: request.body});
response.send({gameID: request.params.gameID, nodeRow: request.params.nodeRow,nodeCol: request.params.nodeCol, body: request.body});
});
Sorry I misunderstood your question. I thought you are having difficulties in parsing node parameters in node.
Anyway, there are different ways you can achieve this. Of course you need support of javascript, either pure javascript or jQuery.
Here is an example
<form id="myform">
<input name="gameID" id="gameID" />
<input name="nodeRow" id="nodeRow" />
<input name="nodeCol" id="nodeCol" />
<button name="action" value="bar" onclick="submitForm();">Go</button>
</form>
and javascript (using jQuery) will be
<javascript>
function submitForm(){
$("#myform").attr('action',
'/game/' + $("#gameID").val() + '/node/' + $("#nodeRow").val()
+ '/' + $("nodeCol").val() + '/update');
$("#myform").submit();
}
</javascript>

The way to pass data in a POST request is to push it from the html form controls and retrieve the values from the body of the request. The HTML below defines a form with your variables which you can hand-key from a browser:
<html><body>
<form method="post" action="/game/update" role="form">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">gameID</span>
<input type="text" class="form-control" name="gameID" placeholder="<gameID>" value="123456">
</div>
</div>
<div class="input-group">
<span class="input-group-addon">nodeRow</span>
<input type="text" class="form-control" name="nodeRow" placeholder="<nodeRow>" value="1">
</div>
</div>
<div class="input-group">
<span class="input-group-addon">nodeCol</span>
<input type="text" class="form-control" name="nodeCol" placeholder="<gameID" value="1">
</div>
</div>
<hr>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</body></html>
Then you can write a handler along the lines of what's below. Clicking submit will fire the POST request off, and pulling the variables out of the request body can be done as shown below.
app.post("/game/update", function(request, response) {
updateNodeHandler(request, response)
});
function updateNodeHandler(request, response) {
var nodeID = request.body.nodeID;
var nodeRow = request.body.nodeRow;
var nodeCol = request.body.nodeCol;
// Additional logic goes here...
}