I have developed a website in CodeIgniter 4 framework. One particular page has a form that doesn't submit but validates HTML input controls that have required attributes. I have tried everything but could not find the exact bug. Following is the live URL of that page:
https://spcollegedumka.ac.in/index.php/feedback/send
<form method="post" id="feedbackForm">
<div class="mb-2">
<label class="form-label">Who you are?</label>
<select name="category" class="form-control form-control-sm" required="">
<option value="" selected="" disabled="">---- Select ----</option>
<option value="Student">Student</option>
<option value="Parent">Parent</option>
<option value="Guest">Guest</option>
</select>
</div>
<div class="mb-2">
<label class="form-label">Your Name</label>
<input type="text" name="name" class="form-control form-control-sm" required="">
</div>
<div class="mb-2">
<label class="form-label">Roll No. (students only)</label>
<input type="text" name="roll" class="form-control form-control-sm">
</div>
<div class="mb-2">
<label class="form-label">Select Faculty</label>
<select name="faculty" class="form-control form-control-sm" required="">
<option value="" selected="" disabled="">---- Select ----</option>
<option value="1">Faculty of Humanities</option>
<option value="2">Faculty of Social Science</option>
<option value="3">Faculty of Commerce</option>
<option value="4">Faculty of Science</option>
<option value="100">Not Applicable (For Parent/Guest)</option>
</select>
</div>
<div class="row">
<div class="col-md-6">
<div class="mb-2">
<label class="form-label">Mobile No.</label>
<input type="text" name="mobile" class="form-control form-control-sm" required="">
</div>
</div>
<div class="col-md-6">
<div class="mb-4">
<label class="form-label">Email Address</label>
<input type="email" name="email" class="form-control form-control-sm" required="">
</div>
</div>
</div>
<button type="submit" value="submit" class="btn btn-sm">SUBMIT & GO NEXT</button>
</form>
i dont know wht u mean, but try to read attribut required
required="true"
or
required
https://www.w3schools.com/tags/att_input_required.asp
Related
I am trying to post a form from a HTML file to a live database using laravel api.php route. But it's yielding the following error :
my api.php looks like :
<?PHP
use Illuminate\Http\Request;
use App\Http\Controllers\User\PageController;
Route::middleware('auth:api')->get('/user', function (Request $request) {
return $request->user();
});
Route::post('summitRegistration',[PageController::class,'summitRegistration']);
My HTML code :
<form action="https://www.aspireelearning.com/summitRegistration" method="POST">
<div class="col-12 col-md-6">
<div class="form-group">
<input type="text" class="form-control" name="full_name" id="full_name"
placeholder="Your Full Name">
<input type="text" class="form-control" name="phone" id="phone"
placeholder="Phone Number">
<input type="text" class="form-control" name="profession" id="profession"
placeholder="Profession">
</div>
</div>
<div class="col-12 col-md-6">
<div class="form-group">
<input type="email" class="form-control" name="email" id="email"
placeholder="Email Address" required>
<input type="text" class="form-control" name="organization" id="organization"
placeholder="Organization/Institute">
<select class="form-control country-search" name="country" id="country">
<option value="">Your Country</option>
<option value="">USA</option>
<option value="">UK</option>
</select>
</div>
</div>
<div class="col-12 text-center">
<button type="submit" class="btn btn-danger">
CONFIRM
</button>
</div>
</form>
i have update action and also added #csrf token now i hope you will get your out put .
<form action="https://www.aspireelearning.com/api/summitRegistration" method="POST">
//#csrf
<div class="col-12 col-md-6">
<div class="form-group">
<input type="text" class="form-control" name="full_name" id="full_name"
placeholder="Your Full Name">
<input type="text" class="form-control" name="phone" id="phone"
placeholder="Phone Number">
<input type="text" class="form-control" name="profession" id="profession"
placeholder="Profession">
</div>
</div>
<div class="col-12 col-md-6">
<div class="form-group">
<input type="email" class="form-control" name="email" id="email"
placeholder="Email Address" required>
<input type="text" class="form-control" name="organization" id="organization"
placeholder="Organization/Institute">
<select class="form-control country-search" name="country" id="country">
<option value="">Your Country</option>
<option value="">USA</option>
<option value="">UK</option>
</select>
</div>
</div>
<div class="col-12 text-center">
<button type="submit" class="btn btn-danger">
CONFIRM
</button>
</div>
</form>
You have to add api as prefix https://www.aspireelearning.com/api/summitRegistration
For a university assessment I have been tasked with creating a very simple website with the concept of a 'Facebook Lite' that uses basic PHP and SQL functionality.
I am very new to bootstrap and have been attempting to correctly align a form within my register page. I can't quite figure out the correct way to place a form within a 3-6-3 bootstrap grid, the webpage just keeps presenting the form incorrectly to how I would like it.
The page I am working with is a php file (register.php) and so far I have worked out how to successfully create a working bootstrap horizontal form that will collapse to vertical when the window is sized down etc.
However I can't quite get it centered, the form keeps presenting to the right of the viewport, and the input boxes look horrible on a mobile device.
As explained I am extremely new to bootstrap so please forgive me if I am going about this the completely wrong way.
For your convenience I have prepared 2 pages;
Page 1 (register.php) -
What I believe to be the correct way to make a simple bootstrap form, however it is not centered and the input boxes go TINY on a mobile device (I just followed the bootstrap website instructions)
http://titan.csit.rmit.edu.au/~s3605062/register.php
Page 2 (register2.php)
My attempt to place my newly created form INSIDE a bootstrap grid of 3-6-3 (to supposedly center the form). I used the example demo from W3Schools so I could try and understand how it works, but as you can see its not working properly...
http://titan.csit.rmit.edu.au/~s3605062/register2.php
Code of register.php:
<div class="container">
<form class="form-horizontal" method="post" action="/register_new.php">
<div class="form-group">
<label class="control-label col-sm-2" for="email">Email:</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" placeholder="e.g. jsmith#example.com" name="email">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="pwd">Password:</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="pwd" placeholder="Create a password" name="pwd">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="fullname">Full Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="fullname" placeholder="e.g. John Smith" name="fullname">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="screenname">Screen Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="screenname" placeholder="e.g. John S" name="screenname">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="dateofbirth">Date of Birth:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="dateofbirth" placeholder="MM/DD/YYYY" name="dateofbirth"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="gender">Gender:</label>
<div class="col-sm-10">
<select class="form-control" id="gender" name="gender">
<option value="" selected disabled>Please select...</option>
<option value="male">Male</option>
<option value="female">Female</option>
<option value="nonbinary">Non-Binary</option>
<option value="notsharing">Prefer not to answer</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="gender">Status:</label>
<div class="col-sm-10">
<select class="form-control" id="status" name="status">
<option value="" selected disabled>Please select...</option>
<option value="single">Single</option>
<option value="relationship">In a relationship</option>
<option value="complicated">Its complicated</option>
<option value="partnership">In a domestic partnership</option>
<option value="married">Married</option>
<option value="widowed">Widowed</option>
<option value="notsharing">Prefer not to answer</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="location">Location:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="location" placeholder="e.g. Melbourne, Australia" name="location">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="registerbtn" class="btn btn-default">Sign Up</button>
</div>
</div>
</form>
</div>
Code of register2.php:
<div class="container">
<div class="row">
<div class="col-sm-3" style="background-color:lavender;">.col-sm-3</div>
<div class="col-sm-6" style="background-color:lavenderblush;">
<form class="form-horizontal" method="post" action="/register_new.php">
<div class="form-group">
<label class="control-label col-sm-3" for="email">Email:</label>
<div class="col-sm-3">
<input type="email" class="form-control" id="email" placeholder="e.g. jsmith#example.com" name="email">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-6" for="pwd">Password:</label>
<div class="col-sm-6">
<input type="password" class="form-control" id="pwd" placeholder="Create a password" name="pwd">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-6" for="fullname">Full Name:</label>
<div class="col-sm-6">
<input type="text" class="form-control" id="fullname" placeholder="e.g. John Smith" name="fullname">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-6" for="screenname">Screen Name:</label>
<div class="col-sm-6">
<input type="text" class="form-control" id="screenname" placeholder="e.g. John S" name="screenname">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-6" for="dateofbirth">Date of Birth:</label>
<div class="col-sm-6">
<input type="text" class="form-control" id="dateofbirth" placeholder="MM/DD/YYYY" name="dateofbirth"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-6" for="gender">Gender:</label>
<div class="col-sm-6">
<select class="form-control" id="gender" name="gender">
<option value="" selected disabled>Please select...</option>
<option value="male">Male</option>
<option value="female">Female</option>
<option value="nonbinary">Non-Binary</option>
<option value="notsharing">Prefer not to answer</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-6" for="gender">Status:</label>
<div class="col-sm-6">
<select class="form-control" id="status" name="status">
<option value="" selected disabled>Please select...</option>
<option value="single">Single</option>
<option value="relationship">In a relationship</option>
<option value="complicated">Its complicated</option>
<option value="partnership">In a domestic partnership</option>
<option value="married">Married</option>
<option value="widowed">Widowed</option>
<option value="notsharing">Prefer not to answer</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-6" for="location">Location:</label>
<div class="col-sm-6">
<input type="text" class="form-control" id="location" placeholder="e.g. Melbourne, Australia" name="location">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-6 col-sm-6">
<button type="registerbtn" class="btn btn-default">Sign Up</button>
</div>
</div>
</form>
</div>
<div class="col-sm-3" style="background-color:lavender;">.col-sm-3</div>
</div>
</div>
As an end result I would like it to have the form centered like on register2.php, but with the form labels and inputs presenting properly (similar to how they are on register.php). I am not even sure if a bootstrap grid is the correct way to do this!
Any help is extremely appreciated thank you and I do apologise for the lengthy post I just wanted to explain myself clearly.
Thank you.
Ricky
This will be the first code:
Try to always declare row with column inside container. d-flex and justify-content-center will help to centralized the form. It's bootstrap default class.
<div class="container">
<div class="row d-flex justify-content-center">
<div class="col-md-9">
<form class="form-horizontal" method="post" action="/register_new.php">
<div class="form-group">
<label class="control-label col-sm-2" for="email">Email:</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" placeholder="e.g. jsmith#example.com" name="email">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="pwd">Password:</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="pwd" placeholder="Create a password" name="pwd">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="fullname">Full Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="fullname" placeholder="e.g. John Smith" name="fullname">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="screenname">Screen Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="screenname" placeholder="e.g. John S" name="screenname">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="dateofbirth">Date of Birth:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="dateofbirth" placeholder="MM/DD/YYYY" name="dateofbirth"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="gender">Gender:</label>
<div class="col-sm-10">
<select class="form-control" id="gender" name="gender">
<option value="" selected disabled>Please select...</option>
<option value="male">Male</option>
<option value="female">Female</option>
<option value="nonbinary">Non-Binary</option>
<option value="notsharing">Prefer not to answer</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="gender">Status:</label>
<div class="col-sm-10">
<select class="form-control" id="status" name="status">
<option value="" selected disabled>Please select...</option>
<option value="single">Single</option>
<option value="relationship">In a relationship</option>
<option value="complicated">Its complicated</option>
<option value="partnership">In a domestic partnership</option>
<option value="married">Married</option>
<option value="widowed">Widowed</option>
<option value="notsharing">Prefer not to answer</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="location">Location:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="location" placeholder="e.g. Melbourne, Australia" name="location">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="registerbtn" class="btn btn-default">Sign Up</button>
</div>
</div>
</form>
</div>
</div>
</div>
For the second form default.css, you are using padding for form, that's why you got a blank space in left side.
form {
margin-top: 10px;
padding-left: 370px;
}
Thanks.
The form
<form action="adminhandler.php" method="post" enctype="multipart/form-data">
<div class="form-group">
<label for="product name">Enter product name</label>
<input type="text" class="form-control" id="productName" aria-describedby="emailHelp" placeholder="" name="productname">
</div>
<div class="form-group">
<label for="product name">Select product category</label>
<select name="select" class=" custom-select">
<option selected>Open this select menu</option>
<option value="1">Formal Shoes</option>
<option value="2">Sneakers</option>
<option value="3">Tracksuits</option>
<option value="3">Clothing</option>
<option value="3">Accessories</option>
</select>
</div>
<div class="form-group">
<label for="product price">Enter product price(Naira)</label>
<input type="text" class="form-control" id="productPrice" aria-describedby="emailHelp" placeholder=""
name="price">
</div>
<div class="form-group">
<label for="exampleFormControlFile1">Example file input</label>
<input type="file" class="form-control-file" id="exampleFormControlFile1" name="rogue">
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
My php code
$new=($_FILES['rogue']['name']);
print_r($new);
The exact error code is "Notice: Undefined index: rogue in C:\xampp\htdocs\eshop\data\adminhandler.php on line 13"
I have been trying to process the inputs of a web form which submits to itself. Everything works fine except for chrome android browser. The code works well when accessed through browsers on PC and other mobile browsers like UC Browser. But miserably fails in chrome android. The submit button and "post" requests are not set on the first run. And more strangely the same code works on same chrome browser when reloaded. help will be greatly appreciated.
This is the code supposed to catch the values submitted
?php
require_once('connect_db.php');
require_once('functions.php');
$timezone = "Asia/Kolkata";
date_default_timezone_set($timezone);
if($_SERVER['REQUEST_METHOD'] == 'POST') {
$name = $mysqli->real_escape_string($_REQUEST['name']);
$gender = $mysqli->real_escape_string($_REQUEST['gender']);
$dob = $mysqli->real_escape_string($_REQUEST['dob']);
// And Some more Variables managed here
}
?>
And here is the html form part
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" data-toggle="validator">
<div class="form-group">
<label for="name" class="control-label">Name:</label>
<input class="form-control" onfocusout="this.value = this.value.toUpperCase();" autofocus="autofocus" id="name" placeholder="Name" data-error="Enter Your Name" name="name" required="" type="text">
<div class="help-block with-errors"></div>
</div>
<div class="form-group w3ls-opt">
<label for="Gender" class="control-label">Gender</label> <label class="w3layouts"> <input name="gender" id="gender1" value="male" checked="checked" type="radio">Male
</label> <label class="w3layouts label2"> <input name="gender" id="gender2" value="female" type="radio">Female </label> <label class="w3layouts"> <input name="gender" id="gender3" value="other" type="radio">Other
</label>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label for="dob" class="control-label">Date of Birth</label>
<input class="form-control" id="dob" placeholder="dd/mm/yyyy" name="dob" required="" max="31/05/1995" data-error="Enter Your Date of Birth in dd/mm/yyyy format" type="text" pattern="\d{1,2}/\d{1,2}/\d{4}">
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label for="inputEmail" class="control-label">Email:</label> <input class="form-control" style="text-transform:lowercase" id="inputEmail" placeholder="Email" data-error="Enter a valid Email" name="email" required="" type="email">
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label for="parent" class="control-label">Name
of Father/Parent/Guardian/Husband</label> <input class="form-control" id="father" placeholder="Name of Father" name="father" onfocusout="this.value = this.value.toUpperCase();" required="" data-error="Enter Your Parent's Name" type="text">
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label for="mother" class="control-label">Name
of Mother</label> <input class="form-control" onfocusout="this.value = this.value.toUpperCase();" id="mother" placeholder="Name of Mother" name="mother" required="" data-error="Enter Your Mother's Name" type="text">
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label class="control-label" for="address1">Address</label>
<textarea class="form-control" rows="3" id="address1" onfocusout="this.value = this.value.toUpperCase();" name="address1" data-error="Enter Address" required=""></textarea>
<div class="help-block with-errors"></div>
</div>
<div class="form-group"> <label class="control-label" for="address2">Address</label>
<textarea class="form-control" rows="3" id="address2" onfocusout="this.value = this.value.toUpperCase();" name="address2" data-error="Enter Address" required="" readonly="readonly">
OTTATHARA
KODUP PO
PIN:676504</textarea>
</div>
<div class="form-group">
<label for="Phone" class="control-label">Phone:</label> <input class="form-control" name="phone" id="Phone" placeholder="Phone" data-error="Enter a valid Phone Number" required="" min="0000000000" max="99999999999" type="number">
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label class="control-label" for="address">Course
Presently Studying</label>
<select class="form-control" id="course" name="course" required="">
<option value="" selected="selected">Select</option>
<option value="hsc">+2</option>
<option value="vhsc">VHSC</option>
<option value="diploma">Diploma</option>
<option value="graduation">Graduation</option>
<option value="professional">Professional Degree</option>
<option value="bed">B.Ed</option>
<option value="pg">Postgraduation</option>
<option value="mphil">M Phil</option>
<option value="research">Research</option>
<option value="certificate">Certificate Course</option>
<option value="others">Others</option>
</select>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label for="course_details" class="control-label">Deatils of Course(Group/Main/Branch):</label> <input class="form-control" onfocusout="this.value = this.value.toUpperCase();" placeholder="Course Details" name="course_details" id="course_details" required="" type="text">
<div class="help-block with-errors" required=""></div>
</div>
<div class="form-group">
<label for="institution" class="control-label">Name of Institution:</label> <input class="form-control" onfocusout="this.value = this.value.toUpperCase();" id="institution" placeholder="Institution" name="institution" required="" type="text">
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label class="control-label" for="duration_year">Course Duration(Year)</label>
<select class="form-control" id="duration_year" name="duration_year">
<option value="" selected="selected">Select</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label class="control-label" for="duration_year">Course Duration(Month)</label>
<select class="form-control" id="duration_month" name="duration_month">
<option value="" selected="selected">Select</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
</select>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label class="control-label" for="financial status">Financial Status</label>
<select class="form-control" id="finance" name="finance">
<option value="" selected="selected">Select</option>
<option value="apl">APL</option>
<option value="bpl">BPL</option>
<option value="finance_not_say">Prefer not to Specify</option>
</select>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label class="control-label" for="if_working">Are you Working Now?</label>
<select class="form-control" id="if_working" name="if_working" required="" onchange="change_work_option(this)">
<option value="" selected="selected">Select</option>
<option value="yes">Yes</option>
<option value="no">No</option>
</select>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label class="control-label" for="working_type">If working, details of employment</label>
<select class="form-control" id="working_type" name="working_type" disabled>
<option value="select" selected="selected">Select</option>
<option value="government">Government</option>
<option value="private">Private</option>
<option value="self employed">Self Employed</option>
<option value="others">Others</option>
</select>
<div class="help-block with-errors"></div>
</div>
<div class="form-group"> <label for="interest" class="control-label">Interests</label> <input onfocusout="this.value = this.value.toUpperCase();" class="form-control" id="interests" placeholder="Interests" name="interest" type="text"> </div>
<div class="form-group"> <label for="aspiration" class="control-label">Career Aspirations</label> <input onfocusout="this.value = this.value.toUpperCase();" class="form-control" id="aspiration" placeholder="Aspiration" name="aspiration" type="text"> </div>
<div class="form-group"> <input class="btn btn-primary btn-lg btn-block" id ="submit" name="submit" value="submit" type="submit">
</div>
</form>
Edited..
After posting above question I have been making a number of trail and errors and found that error is not with my form or code. Even so simple a form like given below fails. But when I reload it works..I read something about a bug in Chrome. Any solution or hack?
here is the simple form i tried in vain last
<html><body>
<?php echo $_POST["name"]." echoing"; ?>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" name="student_form" method="post" accept-charset="utf-8">
<input type="text" name="name" />
<input type="submit">
</form>
</body>
Thank you for your support. This is not exactly an answer to the cause of the issue, but simply how I managed to get out of it and set my form working. :)
As U guys pointed out, it should nt be a bug in chrome android( it could be more disastrous in that case). And when I tried many "deductive" debugging and trial and error I found something which may lead to clutch to the root of the error.
1. It works fine when I tested on another web host
2. In my erroneous host cum browser, when the form is submitted the url returned carries a strange get parameter Www.xxxx.com/?i=1
Since I had to solve the problem immediately, I manned a function in the controller file to reload the uri if the browser is android chrome and it is tab is "fresh" using
isset($_SERVER['HTTP_CACHE_CONTROL']) &&
($_SERVER['HTTP_CACHE_CONTROL'] === 'max-age=0' || $_SERVER['HTTP_CACHE_CONTROL'] == 'no-cache')
and it worked. But would be glad to know any insights u could share
I have an HTML form that posts to a PHP script. Everything is working except the checkbox. When it is checked, the value is not being posted.
HTML:
<input name="test" id="checkbox-02" type="checkbox" value="1" />
PHP:
if(!isset($_POST['test'])) {
$eventRepeat="No";
}
if(isset($_POST['test'])) {
$eventRepeat="Yes";
}
When this code runs, $eventRepeat always comes out as "No." I tried using the command "print_r($_POST)" and all inputs are posted except the checkbox, even when it is checked.
Any ideas what could cause this? I do have jQuery running so when it is checked two divs appear. Could that somehow be interfering? Here's the jQuery:
$(document).ready(function () {
$('#checkbox-02').change(function () {
if (!this.checked)
// ^
$('#repeatUntilDIV').fadeIn('slow');
$('#repeatFrequencyDIV').fadeIn('slow');
});
});
For reference, here is the full code:
<form class="cmxform form-horizontal tasi-form" id="commentForm" role="form" action="" method="post">
<div class="form-group">
<label for="inputEventTitle" class="col-lg-2 control-label">Event Title</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="inputEventTitle" name="inputEventTitle" placeholder="Event Title" required>
</div>
</div>
<div class="form-group">
<label for="inputEventDescription" class="col-lg-2 control-label">Description</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="inputEventTitle" name="inputEventDescription" placeholder="Event Description" required>
</div>
</div>
<div class="form-group">
<label for="inputEventStartTime" class="col-lg-2 control-label">Start Time</label>
<div class="col-lg-10">
<select name="inputEventStartTime" class="form-control" id="dp1" required>
<option label="Start Time">
<option value="12:00AM">12:00AM</option>
<option value="12:15AM">12:15AM</option>
<option value="12:30AM">12:30AM</option>
<option value="12:45AM">12:45AM</option>
<option value="1:00AM">1:00AM</option>
</select>
</div>
</div>
<div class="form-group">
<label for="inputEventEndTime" class="col-lg-2 control-label">End Time</label>
<div class="col-lg-10">
<select name="inputEventEndTime" class="form-control" id="dp1" required>
<option label="End Time">
<option value="1:00AM">1:00AM</option>
<option value="1:15AM">1:15AM</option>
<option value="1:30AM">1:30AM</option>
<option value="1:45AM">1:45AM</option>
<option value="2:00AM">2:00AM</option>
</select> </div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Date</label>
<div class="col-sm-6">
<input id="dp1" name="inputEventDate" type="text" size="16" class="form-control" required>
</div>
</div>
<div class="form-group">
<label for="inputEventDate" class="col-lg-2 control-label">Repeat?</label>
<div class="col-lg-10 checkboxes">
<label class="label_check" for="checkbox-02"> </label>
<input name="test" id="checkbox-02" type="checkbox" value="1" /> Yes, I want to repeat this event.
</div>
</div>
<div class="form-group" id="repeatUntilDIV" style="display:none;">
<label for="inputEventEndDate" class="col-lg-2 control-label">Repeat Until</label>
<div class="col-lg-10">
<input name="inputEventEndDate" id="eventEndDate" type="text" placeholder="End Date" class="form-control">
</div>
</div>
<div class="form-group" id="repeatFrequencyDIV" style="display:none;">
<label for="inputEventFrequency" class="col-lg-2 control-label">Repeat Every</label>
<div class="col-lg-10">
<select name="inputEventFrequency" class="form-control" id="dp1">
<option label="Repeat Every">
<option value="1">Repeat Every Day</option>
<option value="2">Repeat Every Other Day</option>
<option value="7">Repeat Every Week</option>
<option value="14">Repeat Every Other Week</option>
<option value="30">Repeat Every Month</option>
</select>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
<input type="submit" name="addPrimaryEvent" class="btn btn-success" value="Submit" />
</form>
I get this from var_dump($_POST):
array(8) {
["inputEventTitle"]=>
string(5) "Title"
["inputEventDescription"]=>
string(11) "Description"
["inputEventStartTime"]=>
string(6) "2:00AM"
["inputEventEndTime"]=>
string(6) "3:00AM"
["inputEventDate"]=>
string(10) "05-26-2014"
["inputEventEndDate"]=>
string(10) "05-29-2014"
["inputEventFrequency"]=>
string(1) "1"
["addPrimaryEvent"]=>
string(6) "Submit"
}
Very unclear why this would not work. But I noticed inconsistencies & imbalance in the HTML tags as well as an empty action="" which is not HTML5 valid. For more details, see this great answer over here.
So I have set it to #. You might want to actually change that to the full filename or path to the PHP script such as action="form.php". Or you could leave it out altogether like this:
<form class="cmxform form-horizontal tasi-form" id="commentForm" role="form" action="#" method="post">
But I prefer to be explicit & recommend the action="form.php" way of handling things. Here is your cleaned up HTML form:
<form class="cmxform form-horizontal tasi-form" id="commentForm" role="form" action="#" method="post">
<div class="form-group">
<label for="inputEventTitle" class="col-lg-2 control-label">Event Title</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="inputEventTitle" name="inputEventTitle" placeholder="Event Title" required="" />
</div>
</div>
<div class="form-group">
<label for="inputEventDescription" class="col-lg-2 control-label">Description</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="inputEventTitle" name="inputEventDescription" placeholder="Event Description" required="" />
</div>
</div>
<div class="form-group">
<label for="inputEventStartTime" class="col-lg-2 control-label">Start Time</label>
<div class="col-lg-10">
<select name="inputEventStartTime" class="form-control" id="dp1" required="">
<option value="12:00AM">
12:00AM
</option>
<option value="12:15AM">
12:15AM
</option>
<option value="12:30AM">
12:30AM
</option>
<option value="12:45AM">
12:45AM
</option>
<option value="1:00AM">
1:00AM
</option>
</select>
</div>
</div>
<div class="form-group">
<label for="inputEventEndTime" class="col-lg-2 control-label">End Time</label>
<div class="col-lg-10">
<select name="inputEventEndTime" class="form-control" id="dp1" required="">
<option value="1:00AM">
1:00AM
</option>
<option value="1:15AM">
1:15AM
</option>
<option value="1:30AM">
1:30AM
</option>
<option value="1:45AM">
1:45AM
</option>
<option value="2:00AM">
2:00AM
</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Date</label>
<div class="col-sm-6">
<input id="dp1" name="inputEventDate" type="text" size="16" class="form-control" required="" />
</div>
</div>
<div class="form-group">
<label for="inputEventDate" class="col-lg-2 control-label">Repeat?</label>
<div class="col-lg-10 checkboxes">
<input name="test" id="checkbox-02" type="checkbox" value="1" /> Yes, I want to repeat this event.
</div>
</div>
<div class="form-group" id="repeatUntilDIV" style="display:none;">
<label for="inputEventEndDate" class="col-lg-2 control-label">Repeat Until</label>
<div class="col-lg-10">
<input name="inputEventEndDate" id="eventEndDate" type="text" placeholder="End Date" class="form-control" />
</div>
</div>
<div class="form-group" id="repeatFrequencyDIV" style="display:none;">
<label for="inputEventFrequency" class="col-lg-2 control-label">Repeat Every</label>
<div class="col-lg-10">
<select name="inputEventFrequency" class="form-control" id="dp1">
<option value="1">
Repeat Every Day
</option>
<option value="2">
Repeat Every Other Day
</option>
<option value="7">
Repeat Every Week
</option>
<option value="14">
Repeat Every Other Week
</option>
<option value="30">
Repeat Every Month
</option>
</select>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button> <input type="submit" name="addPrimaryEvent" class="btn btn-success" value="Submit" />
</div>
</form>