I want to print the label off of my radio button to a seperate page, using something similar to this using php
<div class="radio"><?php echo "-" . (!empty($_GET['radio']) ? $_GET['radio'] :'');?>
That will be on the other page, but this is the code with the radio buttons on the first page.
<div class = "radio" required="required">
<h3 style = "margin-top:-20px;">Meaningless text.</h3>
<label for="x"><input type="radio" name="x" id = "x" /> <span>ex.1</span></label><br>
<label for="y"><input type="radio" name="x" id = "x" /> <span>ex.2</span></label><br>
<label for="z"><input type="radio" name="x" id = "x" /> <span>ex.3</span></label>
</div>
I have this div in a form, and the form redirects to the page with the $_GET when the submit button is clicked. I want the ex.1, 2 or 3 to be printed when the option for it has been clicked. I have tried, and i am stumped. Help please!
Why not set the value attribute to what you're after...
<label for="x">
<input type="radio" name="x" id="x" value="ex.1">
<span>ex.1</span>
</label>
<label for="y">
<input type="radio" name="x" id="y" value="ex.2">
<span>ex.2</span>
</label>
<label for="z">
<input type="radio" name="x" id="z" value="ex.3">
<span>ex.3</span>
</label>
I also fixed your duplicate id attributes. I assumed from the <label> from attribute, they were meant to be x, y and z.
The value of $_GET['x'] (assuming <form method="GET">) will be the value of the checked radio button.
<div class="radio">-<?= !empty($_GET['x']) ? $_GET['x'] : '' ?></div>
Modify your HTML as
<input type="radio" name="x" value="ex.1" id="1" />
This way, your $_GET array will have the value ex.1 at index x. You can print it using
<?php if(isset($_GET['x'])) echo $_GET['x']; ?>
Another thing I would like to point out is that you really shouldn't be using same values for id. It is supposed to be unique per page, and other elements like CSS and JS depends on you giving unique values for id.
Good Luck!
Related
Is it possible, for example, if I choose more than 1 checkbox it will submite multiple forms with the other camps that I have but the only thing that will change is the value of the checkbox.
I will give a more detailed example.
I have 2 camps, 1 with the name and the other with the email and the other is those checkbox. And If I choose 2 checkbox it will submit the forum 2 times with the same name and the same email but one will be with 1 value and the other will be with the other value that I selected.
<div class="form-group">
<label>Test</label>
<div class="custom-control custom-radio">
<input type="checkbox" id="0" name="server" class="custom-control-input">
<label class="custom-control-label" for="0">Everywhere</label>
</div>
<div class="custom-control custom-radio">
<input value="1" type="checkbox" name="server" id="test" class="custom-control-input">
<label class="custom-control-label" for="teste" value="1">test</label>
</div>
<div class="custom-control custom-radio">
<input value="2" type="checkbox" name="server" id="test2" class="custom-control-input">
<label class="custom-control-label" for="test2" value="2">test2</label>
</div>
</div>
Thanks U all for your time, sorry if I wasn't detailed enough but just say it and I will improve it! Feel free to send me any link do study and implement in the code ;)
When using a checkbox, as long as they all share the Same name then they will be submitted as ONE value. Example:
A checkbox named Hobbies will submit an array of values checked when the form is submitted with a result that looks like [Cooking, Running, Jumping, Gaming]. All of that is 1 value, and not 4.
The input element is how many different results you want back.
The name attribute tag is identifies which response the answer belongs to.
The value attribute tag is what will be sent inside of the value, i.e. [1,2,3] or [A, B, C].
Please rephrase your question if you felt i did not meet the answer you were looking for. It was difficult to understand.
Edit after reading comment.
Your issue seem to be on your understanding of the form element, and not that on the checkbox attribute.
Please consider wrapping your inputs and form data inside a form tag. All inputs inside will be submitted as one, rather than as separate or individual. Your html structure seems to be what is causing your issue.
<form action="/action_page.php">
First name:<br>
<input type="text" value="Mickey"><br>
Last name:<br>
<input type="text" name="lastname" value="Mouse"><br><br>
<input type="checkbox" name="vehicle1" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle2" value="Car"> I have a car
<input type="submit" value="Submit">
</form>
Everything inside that form element will be submitted as one POST, and from there, you can request the values from the [vehicle1] or [vehicle2] question.
HTML
<form id="form-id">
First name:<br>
<input type="text" value="Mickey"><br>
Last name:<br>
<input type="text" name="lastname" value="Mouse"><br><br>
<input type="checkbox" name="vehicle1" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle2" value="Car"> I have a car
<input type="submit" value="Submit">
</form>
JAVASCRIPT
var ele1 = document.getElementById("form-id1"); //Your Form Element
var ele2 = document.getElementById("form-id2"); //Your Form Element
//Detects whenever this particular form is "submitted"
if(ele.addEventListener){ //Modern browsers
ele.addEventListener("submit", function(e){
ele1.action="yourUrl1";
ele1.submit();
ele2.action="yourUrl2";
ele2.submit();
//return false; //stops page from refreshing after submit
});
} else if(ele.attachEvent){ //Old IE
ele.attachEvent('onsubmit', function(e){
ele1.action="yourUrl1";
ele1.submit();
ele2.action="yourUrl2";
ele2.submit();
//return false; //stops page from refreshing after submit
});
}
I modified my response, but you might be better just connecting the two forms together. You can reference a form element from different parts of your html.
form
The form element that the input element is associated with (its form owner). The value of the attribute must be an id of a element in the same document. If this attribute isn't used, the element is associated with its nearest ancestor element, if any. This attribute lets you to place elements anywhere within a document, not just as descendants of form elements. An input can be associated with at most one form.
formaction
The URL that processes the data submitted by the input element, if it is a submit button or image. This attribute overrides the action attribute of the element's form owner.
References
Detect if form is submitted, using javascript
Submitting a form using javascript 1
Submitting a form using javascript 2
Form/Formaction Quote - Mozilla
Form - W3Schools
Formaction - W3Schools
Input Attributes - W3Schools
I have been searching for a way to add up the total sum of radio buttons and echo it that total on the same page in php. Is there a way to do this? I have included an image of what I am looking at.
Here is code that I have come up with so far:
PHP
<?php
$prod1 = "10";
$prod2 = "20";
$prod3 = "30";
?>
<form action="">
<input type="radio" name="prod1" value="<?=$prod1?>">$10 product 1<br>
<input type="radio" name="prod2" value="<?=$prod2?>">$20 product 2<br>
<input type="radio" name="prod3" value="<?=$prod3?>">$30 product 3
</form>
<!-- This is where the total shows live upon radio check -->
<?php
echo ="$total"
?>
I am new so it will not post an image, here is a link to my image:
Working example
You need an element where the total is going to be, and a way of identifying those inputs. I've used input which isn't very specific; You may want to change this if you have more going on in that form.
I bound change to the form (which I gave the id products) because the change events made on the inputs will bubble up to the form, and we need to search the whole form for all the inputs so it made sense not to have to traverse, which we'd need to do if the function was bound to the input fields.
Then simply, on change of something in the form, add up the values of the checked elements. parseFloat() is used because the values are strings and you'd end up with "102030" where you really wanted "60".
HTML
<form action="" id="products">
<label><input type="radio" name="prod1" value="10" />$10 product 1</label>
<br />
<label><input type="radio" name="prod2" value="20" />$20 product 2</label>
<br />
<label><input type="radio" name="prod3" value="30" />$30 product 3</label>
</form>
<p>Total $<span id="total">0</span></p>
jQuery
$(function(){
$('#products').on('change', function(){
var total = 0;
$(this).find('input:checked').each(function(){
total += parseFloat($(this).val());
});
$('#total').text(total);
});
});
By the way, if the user is supposed to be able to uncheck these options, you need to use <input type="checkbox" ...
I am trying to set up a form that users of my website - piciscan.co.uk - will use to order photobooks. I would like to offer them some options when ordering their photobooks, and on submission of the form, I would like the customer to be redirected to the relevant page of my separate, shop website - piciscanshop.co.uk.
For example, should the user want to order a portrait photobook, in layout 4, with printed page numbers, they should be redirected to piciscanshop.co.uk/portrait-layout4-pagenums-photobook.
So far, I have the html for a form, and believe that it is possible, with some php, to make what I am looking for, happen.
Here is the html code:
<form id="layoutSelector" method="get" action="layoutSelector.php">
<fieldset>
<input type="radio" name="aspect" id="layoutAspectPortrait" value="portrait">
<label for="layoutAspectPortrait">Portrait</label>
<br>
<input type="radio" name="aspect" id="layoutAspectPortrait" value="landscape" checked="checked">
<label for="layoutAspectPortrait">Landscape</label>
</fieldset>
<fieldset>
<input type="radio" name="layout" id="layoutNumber1" value="layout1">
<label for="layoutNumber1">Layout 1</label>
<br>
<input type="radio" name="layout" id="layoutNumber2" value="layout2">
<label for="layoutNumber2">Layout 2</label>
<br>
<input type="radio" name="layout" id="layoutNumber3" value="layout3" checked="checked">
<label for="layoutNumber3">Layout 3</label>
<br>
<input type="radio" name="layout" id="layoutNumber4" value="layout4">
<label for="layoutNumber4">Layout 4</label>
</fieldset>
<fieldset>
<input type="radio" name="pageNums" id="layoutPageNums" value="pageNums">
<label for="layoutPageNums">Page Numbers</label>
<br>
<input type="radio" name="pageNums" id="layoutNoPageNums" value="" checked="checked">
<label for="layoutNoPageNums">No page numbers</label>
<br>
</fieldset>
<div class="submitsAndHiddens">
<input type="submit" value="Submit">
</div>
</form>
So, I guess what I am looking for help with is: how to write layoutSelector.php.
Any help would be most appreciated.
In layoutSelector.php, get the form data via $_GET['field_name_here'], process it however you want (use var_dump($_GET); to see everything that was passed in). Then, redirect to the appropriate page using die(header('Location: other_page.php'));.
So for your example in your question, layoutSelector.php might look something like this:
<?php
if ($_GET['layout'] === 'layout4' && $_GET['pageNums'] === 'layoutPageNums') {
die(header('Location: /portrait-layout4-pagenums-photobook'));
}
?>
Or, if all your pages are laid out this way, you could probably just do something like this:
<?php
die(header('Location: /'. $_GET['aspect'] .'-'. $_GET['layout'] .'-'. $_GET['pageNums'] .'-photobook'));
?>
An even better solution would be to check these values via JavaScript when the form is submitted and change the form action, so no redirecting is needed (which would be faster).
in layoutSelector.php put this code
$page = $_GET['aspect'] . "-" . $_GET['layout'] . '-' . $_GET['pageNums'] . '-' .'photobook';
header('Location : '. 'http://piciscanshop.co.uk/'.$page);
This question is similar to my previous question but not the same ... please check out....I am using totaly 3 webpages; form elements are distributed among two pages, "eg1.html" and "eg2.html", but all the form elements should be submitted to "eg.php".
Here is the code for eg.php which accepts the form elements from both eg1.html and eg2.html:
$size=$_POST["fontsize"];
$label=$_POST["label"];
$age=$_POST["age"];
$sex =$_POST["sex"];
code for eg1.html
<html>
<body>
<form action="eg.php" method="post">
<input type="radio" name="fontsize" value="3"/>
click here to select other options which includes age and sex
<input type="radio" name="label" value="stacks"/>
<input type="submit" name = "down" value = "down">
</form>
</body>
Now What would be the code for eg2.html? just check out sample partial html code :but needs to be compleated....
<input type="radio" name="age" value="3"/>
<input type="radio" name="sex" value="female"/>
The code should work exactly like this:
First user will open eg1.php he selects only one option that is "fontsize" .. next he clicks on the "link to eg2.html" to select two more options "age" and "sex" after selecting... he will be redirected back to eg1.php where he has to select one more option that is "label" ... then he will submit the form to eg.php. Which will hold all form elements those are 'fontsize' 'age' 'sex' and 'label' .....
I have seen many website using this technique please check out cooltext.com where user will get an option to click on the font image which will redirect him to fonts page after selecting one of the fonts images he will be redirected back to homepage,where he can select some other form elements or form elements and finally submits the form .... i have also seen many websites using this technique , i think this can be done using JQUERY/JavaScript but not sure ...please help me to fix this problem guyz,.,,,
Using js you can have the entire form on one page and divide it in steps like this
<form action="eg.php" method="post">
<div class="step1">
<input type="radio" name="fontsize" value="3"/>
click here to select other options which includes age and sex
<input type="radio" name="label" value="stacks"/>
<input type="submit" name = "down" value = "down">
</div>
<div class="step2">
click here to go back to step1
<input type="radio" name="age" value="3"/>
<input type="radio" name="sex" value="female"/>
<input type="submit" value="Submit"/>
</div>
</form>
js:
$('#step1_submit').click(function(){
$('#step1').hide();
$('#step2').show();
});
$('#step2_back').click(function(){
$('#step1').show();
$('#step2').hide();
});
I'm trying to figure out the best way to display text based on which radio button a user has clicked. I am having trouble using sessions to do this. When I use the following code, only the information related to the radio button that was first clicked is displayed (e.g., if someone clicks on radion button "A," then changes his mind and clicks on radio button "B," the session seems to think "A" is still clicked.
Any suggestions?
Here's the HTML:
<div class="radio">
<label for="choice1">Choice 1</label>
<input class="selection" id="choice1" type="radio" name="selection" value="choice1"/>
<div class="radio">
<label for="choice2">Choice 2</label>
<input class="selection" id="choice2" type="radio" name="selection" value="choice2" />
</div>
Here's the PHP code:
if (!isset($_SESSION)) {
session_start();
$_SESSION['formStarted'] = true;
//...
if(($_SESSION['selection']) == 'choice1'){echo 'Text to be included only if choice 1 was selected.';}
$_SESSION['selection'] = isset($_POST[selection]) ? $_POST[selection] : 'choice1';
OR $_GET or $_REQUEST