I am creating an html form that contains multiple checkboxes...
Here is my code
Form
<form enctype="multipart/form-data" action="processstart.php" method="post" class="wpcf7-form">
<div class="form-row">
<span class="label--input-group">Services you require</span>
<span class="wpcf7-form-control-wrap services">
<span class="wpcf7-form-control wpcf7-checkbox check-group-input">
<span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Branding" /> <span class="wpcf7-list-item-label">Branding</span>
</label>
</span>
<span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Design" /> <span class="wpcf7-list-item-label">Design</span>
</label>
</span>
<span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Other" /> <span class="wpcf7-list-item-label">Other</span>
</label>
</span>
<span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Development" /> <span class="wpcf7-list-item-label">Development</span>
</label>
</span>
<span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Illustration" /> <span class="wpcf7-list-item-label">Illustration</span>
</label>
</span>
</span>
</span>
</div>
</form>
Here is processstart.php
<?php
if(isset($_POST['services'])) {
foreach($_POST['services'] as $services) {
echo $services;
}
}
?>
Now nothing is getting echoed...I have tried var_dump(get_defined_vars()); and every other variable is defined except these checkboxes. Not even showing "null" there. What is going wrong?
You have missed to close <form> tag and add submit button
<input type="submit" name="submit" value="submit">
</form>
try i have action on same file but you can change action values will be appear after any checkbox is checked else you can't get checkbox values
On your form not any close <form> tag and not submit form action like button or submit button
<?php if(isset($_POST['services']))
{
foreach($_POST['services'] as $services)
{
echo $services;
}
}?>
<html>
<body>
<form enctype="multipart/form-data" action="" method="post" class="wpcf7-form">
<div class="form-row"><span class="label--input-group">Services you require</span><span class="wpcf7-form-control-wrap services"><span class="wpcf7-form-control wpcf7-checkbox check-group-input"><span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Branding" />
<span class="wpcf7-list-item-label">Branding</span></label>
</span><span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Design" />
<span class="wpcf7-list-item-label">Design</span></label>
</span><span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Other" />
<span class="wpcf7-list-item-label">Other</span></label>
</span><span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Development" />
<span class="wpcf7-list-item-label">Development</span></label>
</span><span class="wpcf7-list-item">
<label>
<input type="checkbox" name="services[]" value="Illustration" />
<span class="wpcf7-list-item-label">Illustration</span></label>
</span></span></span></div>
<input type="submit" name="sub">
</form>
</body>
</html>
actually you are not submitting your form. You just specified in 'action'. To achieve your code workable, add a submit button. So that, while clicking it will call processstart.php
<input type="submit">
Related
I have a form like below and I want to add vaidation for JQuery, I tried using html required attribute but it is not working, help me in this
The code is
//question 1
<label class="container">
<input class="chk check_answer1" type="checkbox" name="answers[]" value='1' required="required">
<span class="checkmark"></span>
</label>
<label class="container">
<input class="chk check_answer1" type="checkbox" name="answers[]" value='1' required="required">
<span class="checkmark"></span>
</label><label class="container">
<input class="chk check_answer1" type="checkbox" name="answers[]" value='1' required="required">
<span class="checkmark"></span>
</label>
//question 2
<label class="container">
<input class="chk check_answer2" type="checkbox" name="answers[]" value='2' required="required">
<span class="checkmark"></span>
</label>
<label class="container">
<input class="chk check_answer2" type="checkbox" name="answers[]" value='2' required="required">
<span class="checkmark"></span>
</label><label class="container">
<input class="chk check_answer2" type="checkbox" name="answers[]" value='2' required="required">
<span class="checkmark"></span>
</label>
//question 3
<label class="container">
<input class="chk check_answer3" type="checkbox" name="answers[]" value='3' required="required">
<span class="checkmark"></span>
</label>
<label class="container">
<input class="chk check_answer3" type="checkbox" name="answers[]" value='3' required="required">
<span class="checkmark"></span>
</label><label class="container">
<input class="chk check_answer3" type="checkbox" name="answers[]" value='3' required="required">
<span class="checkmark"></span>
</label>
This is the code and In this page the user has to select atleast one option for every question
First you need to name the grouped inputs that are alike the same name in your HTML.
Use .on(change function() then locate the input (element) you're using, $(this) and get its name.
Then we write a conditional to see if it is checked, if so remove any other instances of a check from that <input> names group.
EDIT: Function on each input to check the onchange and then if all instances of your inputs has one checked element we change the disabled attribute to false, unlocking the submit button.
You can add display messages if you like and css to the Jquery code by adding an empty <div id="msg"></div> where you want to display info, then call on the value of that div to place text there depending on the message you wish to convey.
//--> Remove the code below if you do want the user to only select one option per
//--> group and it is okay for them to select multiple options per group...
$(':checkbox').on('change', function() {
var th = $(this),
name = th.prop('name');
if (th.is(':checked')) {
th.attr('checked', 'checked');
$(':checkbox[name="' + name + '"]').not($(this)).prop('checked', false);
}
});
//--> This handles the locking of the submit button
function checkChecked(divId) {
var oneOfEachChecked = false;
$('#' + divId + ' input[type="checkbox"]').each(function() {
if ($(".check_answer1").is(":checked") && $(".check_answer2").is(":checked") && $(".check_answer3").is(":checked")) {
oneOfEachChecked = true;
$('#submit').prop('disabled', false);
$('#mash').show().text(' <--- Mash me now, I am unlocked!').css('background', 'lightgreen');
}
});
if (oneOfEachChecked === false) {
$('#submit').prop('disabled', true);
$('#mash').show().text(' X Sorry no go! X').css('background', '#FA3300');
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="myForm">
<div class="divs" id="check_answer1">
//question 1
<label class="container"></label>
<input class="chk check_answer1" onchange="checkChecked('check_answer1')" type="checkbox" name="check_answer1" value="1">
<span class="checkmark"></span>
<label class="container"></label>
<input class="chk check_answer1" onchange="checkChecked('check_answer1')" type="checkbox" name="check_answer1" value="1">
<span class="checkmark"></span>
<label class="container"></label>
<input class="chk check_answer1" onchange="checkChecked('check_answer1')" type="checkbox" name="check_answer1" value="1">
<span class="checkmark"></span>
</div>
<div class="divs" id="check_answer2">
//question 2
<label class="container"></label>
<input class="chk check_answer2" onchange="checkChecked('check_answer2')" type="checkbox" name="check_answer2" value="2">
<span class="checkmark"></span>
<label class="container"></label>
<input class="chk check_answer2" onchange="checkChecked('check_answer2')" type="checkbox" name="check_answer2" value="2">
<span class="checkmark"></span>
<label class="container"></label>
<input class="chk check_answer2" onchange="checkChecked('check_answer2')" type="checkbox" name="check_answer2" value="2">
<span class="checkmark"></span>
</div>
<div class="divs" id="check_answer3">
//question 3
<label class="container"></label>
<input class="chk check_answer3" onchange="checkChecked('check_answer3')" type="checkbox" name="check_answer3" value="3">
<span class="checkmark"></span>
<label class="container"></label>
<input class="chk check_answer3" onchange="checkChecked('check_answer3')" type="checkbox" name="check_answer3" value="3">
<span class="checkmark"></span>
<label class="container"></label>
<input class="chk check_answer3" onchange="checkChecked('check_answer3')" type="checkbox" name="check_answer3" value="3">
<span class="checkmark"></span>
</div>
<input id="submit" type="submit" name="submit" value="submit" disabled><span id="mash"></span>
</form>
i am working on e-commerce website and in products section i want to give a function to sort product by price range like 100 to 500 but i have no idea to connect html radio button with mysql that on click product get sort on screen.
[enter image description here][1]
This is html code for radio button
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post">
<ul class="radio">
<li><input type="radio" name="radio" id="r1" value="radio"/>
<label for="radio1">100-500</label></li>
<li><input type="radio" name="radio" id="r2" value="radio2"/>
<label for="radio2">600-1000</label></li>
<li><input type="radio" name="radio" id="r3" value="radio"/>
<label for="radio3">1100-1500</label></li>
<li><input type="radio" name="radio" id="r4" value="radio4"/>
<label for="radio4">1600-2000</label></li>
<li><input type="radio" name="radio" id="r5" value="radio5"/>
<label for="radio5">2100-2500</label></li>
</ul>
</form>
And this php and mysql code
<?php
$results1 = mysqli_query($db,"SELECT product_code, product_name, product_img_name, price FROM products where price> 500 ORDER BY id ASC");
if($results1){
$products_item = '<ul class="products">';
while($obj = $results1->fetch_object())
{
$products_item .= <<<EOT
<li class="product">
<form method="post" action="cart_update.php">
<div class="product-content"><h3>{$obj->product_name}</h3>
<div class="product-thumb"><img height="250px" src="../../img/{$obj->product_img_name}"></div>
<div class="product-info">
Price {$currency}{$obj->price}
<fieldset>
<label>
<span>size</span>
<select name="product_color">
<option value="Black">Medium</option>
<option value="Silver">Small</option>
</select>
</label>
<label>
<span>Quantity</span>
<input type="text" size="2" maxlength="2" name="product_qty" value="1" />
</label>
</fieldset>
<input type="hidden" name="product_code" value="{$obj->product_code}" />
<input type="hidden" name="type" value="add" />
<input type="hidden" name="return_url" value="{$current_url}" />
<div align="center"><button type="submit" class="add_to_cart">Add</button></div>
</div></div>
</form>
</li>
EOT;
}
}
?>
I am a beginner in PHP. So I am working on a small task in which I want to make a form in which there are MCQS and there is a countdown timer above it of 10 minutes. When the count down timer is up the form should expire and should show the result automatically.
I have made the form as coded below but I don't know what to do so that I can add timer in this code so that the form expires and shows the result of the right selected answers.
<html>
<head>
<title>PHP Quiz</title>
</head>
<body>
<div id="page-wrap">
<h1>Final Quiz for Lip building</h1>
<form action="quiz.php" method="post" id="quiz">
<ol>
<li>
<h3>CSS Stands for...</h3>
<div>
<input type="radio" name="question-1-answers" id="question-1-answers-A" value="A" />
<label for="question-1-answers-A">A) Computer Styled Sections </label>
</div>
<div>
<input type="radio" name="question-1-answers" id="question-1-answers-B" value="B" />
<label for="question-1-answers-B">B) Cascading Style Sheets</label>
</div>
<div>
<input type="radio" name="question-1-answers" id="question-1-answers-C" value="C" />
<label for="question-1-answers-C">C) Crazy Solid Shapes</label>
</div>
<div>
<input type="radio" name="question-1-answers" id="question-1-answers-D" value="D" />
<label for="question-1-answers-D">D) None of the above</label>
</div>
</li>
<li>
<h3>Internet Explorer 6 was released in...</h3>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-A" value="A" />
<label for="question-2-answers-A">A) 2001</label>
</div>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-B" value="B" />
<label for="question-2-answers-B">B) 1998</label>
</div>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-C" value="C" />
<label for="question-2-answers-C">C) 2006</label>
</div>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-D" value="D" />
<label for="question-2-answers-D">D) 2003</label>
</div>
</li>
<li>
<h3>SEO Stand for...</h3>
<div>
<input type="radio" name="question-3-answers" id="question-3-answers-A" value="A" />
<label for="question-3-answers-A">A) Secret Enterprise Organizations</label>
</div>
<div>
<input type="radio" name="question-3-answers" id="question-3-answers-B" value="B" />
<label for="question-3-answers-B">B) Special Endowment Opportunity</label>
</div>
<div>
<input type="radio" name="question-3-answers" id="question-3-answers-C" value="C" />
<label for="question-3-answers-C">C) Search Engine Optimization</label>
</div>
<div>
<input type="radio" name="question-3-answers" id="question-3-answers-D" value="D" />
<label for="question-3-answers-D">D) Seals End Olives</label>
</div>
</li>
</ol>
<input type="submit" value="Submit Quiz" />
</form>
</div>
</body>
</html>
You need JavaScript for such behavior, let's say you use the following JS:
window.setTimeout(function() {
document.forms['form_name'].submit();
}, 2000);
form_name should be the name of your form. i.e
<form name = "form_name" ... >
</form>
This will delay the post in milliseconds (2 seconds) and then it should take you to another page where you can show the correct answers.
Fiddle
I have a php form (code to follow) with a submit button that runs JSON-events.php as its action (method = POST). In the JSON-events code I am testing whether the form has been submitted using if (!empty($_POST)). My issue is that the JSON-events code doesnt seem to be recognising $_POST.
Heres the form side code section.
<div class="simple_overlay" id="searchform">
<form id="myform" class = "cols" action="json-events.php" method="post" >
<h3>Search</h3>
<p>
<label>address/postcode *</label>
<input type="address" id="searchaddress" />
</p>
<p>
<label for="amount">maximum distance:</label>
<input type="text" id="amount" value="5 miles" style=" border:0; color:#43a8c4; font-weight:bold;" />
</p>
<div id="slider-range-min" style="width:130px; margin-left:4px; margin-bottom:20px"></div>
<p id="terms">
<label>Category 1</label>
<input name="cat1" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 2</label>
<input name="cat2" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 3</label>
<input name="cat3" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 4</label>
<input name="cat4" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 5</label>
<input name="cat5" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 6</label>
<input name="cat6" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 7</label>
<input name="cat7" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 8</label>
<input name="cat8" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 9</label>
<input name="cat9" type="checkbox" value="1" checked="checked"/>
</p>
<p id="terms">
<label>Category 10</label>
<input name="cat10" type="checkbox" value="1" checked="checked"/>
</p>
<p>
<input type="hidden" name="searchlat" id="searchlat"/>
</p>
<p>
<input type="hidden" name="searchlong" id="searchlong" />
</p>
<input type="submit" name="search" id="search"/>
<input type="button" value="Check Address" onclick="codeAddressSearch()"/>
<button type="reset">Reset</button>
</form>
</div>
and here is the top part of the JSON...
if (!empty($_POST)) {
any help very much appreciated
empty() will work if $_POST does not have any values (Empty array), but in your case when you submit without any values still you get an array like below and it's not empty:
Array
(
[searchlat] =>
[searchlong] =>
[search] => Submit Query
)
empty() will return true only if $_POST returns
Array (
)
But it's not going to happen as every form will have one Sumbit button.
Just use
if($_POST) {
//php code
}
It will solve your problem.
Learn more about empty() by visiting http://php.net/manual/en/function.empty.php
Do not use
if (!empty($_POST)) {
to check if there is a post done use this:
if( $_SERVER['REQUEST_METHOD'] == 'POST') {
Conditions that you can use with $_POST
if(count($_POST)>0){
//...
}
if(isset($_POST['field_name'])){
//...
}
if( $_SERVER['REQUEST_METHOD'] == 'POST') {
//..
}
Try this
if(!empty($_POST['search']) && isset($_POST['search']))
much better to check for an actual value in the $_POST array. Eg.
if (!empty($_POST['search']))
Using empty() will fail if value 0 is posted
So it is better to use
isset($_POST['FIELD_NAME'])
I've got a simple one-page form, the kind I've written dozens of times, but this behavior is totally new to me. At first, it was submitting on page-load, thus redirecting automatically to the next page in the series. I'm still not sure how I got that to stop, but now it's not doing anything at all when you hit "submit". The page simply sits there.
I've tried stripping out the error-checking scripts, the show/hide script, even jquery itself, then taking the form down to just one input. I tried getting rid of the redirect and just having it output a simple line, then vardump, and still nothing. I hit submit, and no matter what I do, the page just sits there. I've never run into behavior like this before, and firebug et al give me no errors or leads.
If anyone has any ideas at all, no matter how crazy, I'm willing to try. I'm at a loss. Thanks in advance!
<?php
session_start();
include('functions.php');
if ($_POST['submit']) {
$company = $_POST['company'];
$taxid = $_POST['taxid'];
header("location:step2.php");
}
include('head.php'); ?>
<form method="post" name="basic" action="step1.php">
<div class="col70">
<label for="company">Organization/Business name <img src="img/req.jpg" alt="required"></label>
<input type="text" name="company" id="company" value="" />
</div>
<div class="col30">
<label for="taxid">Taxpayer ID# (IEN or SS#) <img src="img/req.jpg" alt="required"></label>
<input type="text" name="taxid" id="taxid" value="" />
</div>
<div class="newcol">
<label for="address">Mailing Address <img src="img/req.jpg" alt="required"></label>
<input type="text" name="address" id="address" value="" />
</div>
<div class="col30 newcol">
<label for="city">City <img src="img/req.jpg" alt="required"></label>
<input type="text" name="city" id="city" value="" />
</div>
<div class="col30">
<label for="state">State <img src="img/req.jpg" alt="required"></label>
<select name="state" id="state" tabindex="<?php echo $tabin; $tabin++; ?>">
<option value="0"></option>
<option value="1">Alabama</option>
</select>
</div>
<div class="col25">
<label for="zipcode">Zip Code <img src="img/req.jpg" alt="required"></label>
<input type="text" name="zipcode" id="zipcode" value="" />
</div>
<fieldset><legend>1. What kind of group/company do you have? <img src="img/req.jpg" alt="required"></legend>
<span id="nfpfp" class="InputGroup">
<label><input name="nfpfp" id="nfpfp_1" type="radio" value="1" />For-profit business.</label>
<label><input name="nfpfp" id="nfpfp_2" type="radio" value="2" />Non-profit 501(c)3 organization.</label>
</span>
</fieldset>
<fieldset><legend>2. How will you use the booth space? Select all that apply. <img src="img/req.jpg" alt="required"></legend>
<span id="type" class="InputGroup">
<label><input name="food" id="type_1" type="checkbox" value="1" />Food sales</label>
<label><input name="retail" id="type_2" type="checkbox" value="2" />Retail sales</label>
<label><input name="activity" id="type_3" type="checkbox" value="3" />Activity</label>
<label><input name="display" id="type_4" type="checkbox" value="4" />Display</label>
<label><input name="other" id="type_5" type="checkbox" value="5" />Other</label>
</span>
</fieldset>
<label for="otherdetails" class="newcol offsides">Enter a short description of your use. (Ex: "BBQ sandwiches", "kite kits", "face painting".) <img src="img/req.jpg" alt="required"></label>
<input type="text" name="otherdetails" id="otherdetails" value="" />
<fieldset><legend>3. Select any/all that apply. Additional questions may appear, if further information is required.</legend>
<span id="additional" class="InputGroup">
<label><input name="raffle" id="raffle_1" type="checkbox" class="switchcheck1" value="1" />I'll be selling raffle tickets and/or holding a raffle at the festival.</label>
<div class="newcol offstate1">
<label for="raffledetails">You'll need written permission from the Exchange Club. Please enter details about the raffle. <img src="img/req.jpg" alt="required"></label>
<textarea name="raffledetails" id="raffledetails" tabindex="<?php echo $tabin; $tabin++; ?>"></textarea>
</div>
<label><input name="trailer" type="checkbox" id="trailer_1" value="1">I'll be bringing a trailer.</label>
<label><input name="outlets" type="checkbox" id="outlets_1" class="switchcheck2" value="1" />I'll require electrical outlets.</label>
<div class="newcol offstate2">
<label for="outletsdetails">How many outlets will you require? <img src="img/req.jpg" alt="required"></label>
<input type="text" name="outletsdetails" id="outletsdetails" />
</div>
</span>
</fieldset>
<input type="button" name="submit" class="a_button" value="submit" />
</form>
The element with name="submit" is of type button and not submit, so it renders a plain button that does nothing (with the intention that you bind some JavaScript to it).
Use type="submit" instead.
Try
<input type="submit" name="submit" class="a_button" value="submit" />
for your submit button.