I want to save data depending on the option selected on the select menu, its option has a certain percentage attached to it, i tried using the code below but its only saving one value irregardless of which option is selected.
I have tried to use conditional-field by Steven Wanderski, but its only saving one value in all selections
my index.php
<?php
require_once('config.php');
require_once('function.php');
?>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script src="js/conditional-field.min.js"></script>
</head>
<body>
<div class="container mt-3">
<form role="form" method="post" action="process.php">
<?php $grant="20";
$direct_cost="100";
$discounts="100";
$overhead_costs="70";
?>
<p class="h4 mb-4">Supplier Spends</p>
<div class="form-row mb-4">
<div class="col">
<label for="prog_description">Name of the Programme:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="prog_description" name="prog_description" class="form-control" placeholder="enter name of the programme embarked on" required>
</div>
</div>
<label for="type_of_contrib">Type of Contribution:</label><span style="color: red !important; display: inl`enter code here`ine; float: none;">*</span>
<select name="type_of_contrib" id="TypeOfContribution" class="TypeOfContribution form-control mb-4" required>
<option value="">--select type of contribution--</option>
<option value="Grant Contribution">Grant Contribution</option>
<option value="Direct cost incurred">Direct cost incurred</option>
<option value="discounts"> Discounts</option>
<option value="Overheads costs">Overheads costs</option>
<option value="Standard Loan">Standard Loan</option>
<option value="Lower Interest Rate">Lower Interest Rate</option>
<option value="Guarantees Provided">Guarantees Provided</option>
<option value="Minority Investment">Minority Investment</option>
<option value="Services at no Cost">Services at no Cost</option>
<option value="Services at a Discount">Services at a Discount</option>
<option value="Time of Employees">Time of Employees</option>
<option value="Shorter payment periods">Shorter payment periods</option>
<option value="Investment with lower Dividend">Investment with lower Dividend</option>
</select>
<div class="benefit form-row mb-4 ">
<div class="col">
<label for="Grant Contribution">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor" class="form-control" placeholder="benefit factor" value="<?php echo $grant;?>" readonly="readonly" required>
</div>
</div>
<div class="benefit2 form-row mb-4">
<div class="col">
<label for="Direct cost incurred">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor" class="form-control" placeholder="benefit factor" value="<?php echo $direct_cost;?>" readonly="readonly" required>
</div>
</div>
<div class="benefit3 form-row mb-4">
<div class="col">
<label for="Discounts">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor"class="form-control" placeholder="benefit factor" value="<?php echo $discounts;?>" readonly="readonly" required>
</div>
</div>
<div class="benefit4 form-row mb-4">
<div class="col">
<label for="Overheads costs">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor"class="form-control" placeholder="benefit factor" value="<?php echo $overhead_costs;?>" readonly="readonly" required>
</div>
</div>
<div class="benefit5 form-row mb-4">
<div class="col">
<label for="Standard Loan">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor"class="form-control" placeholder="benefit factor" value="70" readonly="readonly" required>
</div>
</div>
<div class="benefit6 form-row mb-4">
<div class="col">
<label for="Lower Interest Rate">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor"class="form-control" placeholder="benefit factor" value="50" readonly="readonly" required>
</div>
</div>
<div class="benefit7 form-row mb-4">
<div class="col">
<label for="Guarantees Provided">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor" class="form-control" placeholder="benefit factor" value="3" readonly="readonly" required>
</div>
</div>
<div class="benefit8 form-row mb-4">
<div class="col">
<label for="Minority Investment">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor"class="form-control" placeholder="benefit factor" value="70" readonly="readonly" required>
</div>
</div>
<div class="benefit9 form-row mb-4">
<div class="col">
<label for="Services at no Cost">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor" class="form-control" placeholder="benefit factor" value="60" readonly="readonly" required>
</div>
</div>
<div class="benefit10 form-row mb-4">
<div class="col">
<label for="Services at a Discount">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor" class="form-control" placeholder="benefit factor" value="60" readonly="readonly" required>
</div>
</div>
<div class="benefit11 form-row mb-4">
<div class="col">
<label for="Time of Employees">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor" class="form-control" placeholder="benefit factor" value="60" readonly="readonly" required>
</div>
</div>
<div class="benefit12 form-row mb-4" value="100";>
<div class="col">
<label for="shorter payment periods">Benefit Factor:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="text" id="benefit_factor" name="benefit_factor" class="form-control" placeholder="benefit factor" value="15" readonly="readonly" required>
</div>
</div>
<label for="budgeted_spend">Budgeted Spend:</label>
<input type="number" id="budgeted_spend" name="budgeted_spend" class="form-control mb-4" placeholder="Budgeted Spend" required>
<label for="actual_amount">Actual Amount Spent:</label><span style="color: red !important; display: inline; float: none;">*</span>
<input type="number" id="actual_amount" name="actual_amount" class="form-control mb-4" placeholder="Actual Amount Spent" required>
<label for="current_status">Status of the programme:</label><span style="color: red !important; display: inline; float: none;">*</span>
<select name="current_status" id="current_status" class="status form-control mb-4" required>
<option disabled selected>--select current status--</option>
<option value="started">started</option>
<option value="in_progress">in-progress</option>
<option value="completed">completed</option>
<option value="cancelled">cancelled</option>
</select>
<label for="anticipated_completion">Anticipated Completion Date:</label>
<input type="date" id="anticipated_completion" name="anticipated_completion" class="form-control mb-4" required>
<button class="btn btn-info my-4 btn-block" type="submit">Save Data</button>
</form>
<br>
<?php
get_all_records();
?>
</div>
<script>
$(document).ready(function(){
new ConditionalField({
control: '.TypeOfContribution',
visibility: {
'Grant Contribution': '.benefit',
'Direct cost incurred': '.benefit2',
'discounts': '.benefit3',
'Overheads costs': '.benefit4',
'Standard Loan': '.benefit5',
'Lower Interest Rate': '.benefit6',
'Guarantees Provided': '.benefit7',
'Minority Investment': '.benefit8',
'Services at no Cost': '.benefit9',
'Services at a Discount': '.benefit10',
'Time of Employees': '.benefit11',
'Shorter payment periods': '.benefit12',
}
});
});
</script>
?>
Related
I have created a form using jquery steps, and I want data that the user will fill to three different databases Practitioner, PractitionerSpecialty, PractitionerCompetenceLevel. After I finish the form I use form.submit(); to create request. but on the website is return 419 error I am not sure if I created the controller function correctly, it can be a reason for that.
My form in blade.php:
<form method="post" id="practitioner-form" action="/practitioner">
<h3>Practitioner</h3>
<section>
<legend>Practitioner Information</legend>
<div class="j-row">
<div class="j-unit" style="width: 45%; display: inline-block">
<label for="effective_date" class="j-label">{{trans('personalData.effectiveDate')}}</label>
<div class="input-group">
<input name="main_effective_date_create" id="main_effective_date_create"
type="date" class="form-control required">
</div>
</div>
<div class="j-unit" style="margin-left: 9%; width: 45%; display: inline-block">
<label for="expiry_date" class="j-label">{{trans('personalData.expiryDate')}}</label>
<div class="input-group">
<input name="main_expiry_date_create" id="main_expiry_date_create"
type="date" class="form-control">
</div>
</div>
</div>
<div class="j-row">
<div class="j-unit" style="width: 45%; display: inline-block">
<label for="phone" class="j-label">{{trans('personalData.phoneNumber')}}</label>
<div class="input-group">
<input name="main_phone_create" id="main_phone_create"
type="tel" class="form-control">
</div>
</div>
<div class="j-unit" style="margin-left: 9%; width: 45%; display: inline-block">
<label for="mobile" class="j-label">{{trans('personalData.mobileNumber')}}</label>
<div class="input-group">
<input name="main_mobile_create" id="main_mobil_create"
type="tel" class="form-control">
</div>
</div>
</div>
<div class="j-row">
<div class="j-unit">
<label for="email" class="j-label">{{trans('personalData.email')}}</label>
<div class="input-group">
<input name="main_email_create" id="main_email_create"
type="tel" class="form-control">
</div>
</div>
</div>
</section>
<h3>{{trans('settings.specialty')}}</h3>
<section>
<legend>{{trans('personalData.practitionersSpecialty')}}</legend>
<div class="j-row">
<label for="practitioner_specialty_id"
class="block">Select {{trans('settings.specialty')}}</label>
<select name="practitioner_specialty_id_create"
id="practitioner_specialty_id_create"
class="form-control">
#foreach($specialties as $specialty)
<option
value="{{$specialty->practitioner_specialty_id}}">{{$specialty->name}}</option>
#endforeach
</select>
</div>
<div class="j-row">
<div class="j-unit" style="width: 45%; display: inline-block">
<label for="effective_date_specialty"
class="j-label">{{trans('personalData.effectiveDate')}}</label>
<div class="input-group">
<input name="specialty_effective_date_create"
id="specialty_effective_date_create"
type="date" class="form-control required">
</div>
</div>
<div class="j-unit" style="margin-left: 9%; width: 45%; display: inline-block">
<label for="expiry_date_specialty" class="j-label">{{trans('personalData.expiryDate')}}</label>
<div class="input-group">
<input name="specialty_expiry_date_create" id="specialty_expiry_date_create"
type="date" class="form-control">
</div>
</div>
</div>
</section>
<h3>{{trans('settings.competenceLevel')}}</h3>
<section>
<legend>{{trans('personalData.practitionersCompetenceLevel')}}</legend>
<div class="j-row">
<label for="competence_level" class="block">{{trans('settings.competenceLevel')}}</label>
<select name="practitioner_competence_level_id_create"
id="practitioner_competence_level_id_create"
class="form-control">
#foreach($competence_levels as $level)
<option
value="{{$level->competence_level_id}}">{{$level->name}}</option>
#endforeach
</select>
</div>
<div class="j-row">
<div class="j-unit" style="width: 45%; display: inline-block">
<label for="effective_date_competence"
class="j-label">{{trans('personalData.effectiveDate')}}</label>
<div class="input-group">
<input name="competence_effective_date_create"
id="competence_effective_date_create"
type="date" class="form-control required">
</div>
</div>
<div class="j-unit" style="margin-left: 9%; width: 45%; display: inline-block">
<label for="expiry_date_competence" class="j-label">{{trans('personalData.expiryDate')}}</label>
<div class="input-group">
<input name="competence_expiry_date_create" id="competence_expiry_date_create"
type="date" class="form-control">
</div>
</div>
</div>
<div class="form-group row">
<div class="col-lg-12">
<label for="notes" class="block">{{trans('tables.notes')}}</label>
</div>
<div class="col-lg-12">
<textarea placeholder="Description" cols="80" rows="5" name="notes_create"></textarea>
</div>
</div>
</section>
</form>
Route for adding data to the database:
Route::post('/practitioner', 'CRUD\Settings\PractitionerController#storePractitioner')->name('addPractitioner');
Controller with storing function:
public function storePractitioner(Request $request, $id){
$practitioner_id = $this->practitionerRepository->getIdByPersonId($id);
$practitioner = Practitioner::where('person_id', $id);
$practitioner_specialty = PractitionerSpecialty::where('practitioner_id', $practitioner_id);
$practitioner_competence_level = PractitionerCompetenceLevel::where('practitioner_id', $practitioner_id);
$practitioner->effective_date=$request->get('main_effective_date_create');
$practitioner->expiry_date=$request->get('main_expiry_date_create');
$practitioner->phone=$request->get('main_phone_create');
$practitioner->mobile=$request->get('main_mobile_create');
$practitioner->email=$request->get('main_email_create');
$practitioner_specialty->practitioner_specialty_id=$request->get('practitioner_specialty_id_create');
$practitioner_specialty->effective_date=$request->get('specialty_effective_date_create');
$practitioner_specialty->expiry_date=$request->get('specialty_expiry_date_create');
$practitioner_competence_level->practitioner_competence_level_id=$request->get('practitioner_competence_level_id_create');
$practitioner_competence_level->effective_date=$request->get('competence_effective_date_create');
$practitioner_competence_level->expiry_date=$request->get('competence_expiry_date_create');
$practitioner_competence_level->notes=$request->get('notes_create');
return back()->with('success', 'New practitioner has been added');
}
something is missing on your form. add: {{ csrf_field() }} to the form after the form opening tag
I'm trying to re-arrange my input boxes to look something like this:
currently, they just go down one under each other
I tried using this code but all it did was make the boxes shorter
http://jsfiddle.net/aY9HC/
Here is my code
<style>
.fieldBlock
{
display: block;
width: 200px;
float: left;
}
</style>
here is the text box code
<div id="main-wrapper">
<div class="unix-login">
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-lg-4">
<div class="login-content card">
<center><h3>Register Account</h3>
<p><strong>Create Account</strong> » Purchase » Begin</p></center>
<div class="login-form">
<form data-toggle="validator" method="post" id="register_form">
<div class="form-group">
<div class="fieldBlock">
<label>Name</label>
<input id="username" type="name" name="name" class="form-control" placeholder="First & Last Name" required>
</div>
</div>
<div class="form-group">
<div class="fieldBlock">
<label>Age</label>
<input type="dob" id="age" name="age"class="form-control" placeholder="03/26/2001" required></div>
</div>
<div class="form-group">
<label>Email address</label>
<input id="email" type="email" name="email" class="form-control" placeholder="Email" data-error="This email is invalid" required>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label>Password</label>
<input id="password" type="password" name="password" class="form-control" placeholder="Password" data-minlength="8" data-error="Minimum of 8 characters" required>
<div class="help-block"></div>
</div>
<div class="form-group">
<label>Choose Your Course</label>
<select name="course" class="form-control">
<option value="0" selected>Texas Parent Taught Drivers Ed</option>
<option value="1">Texas Instructor Taught Drivers Ed</option>
<option value="2">Texas Adult Drivers Ed</option>
</select>
</div>
<div class="form-group">
<label>Referral</label>
<input id="referral" type="text" name="referral" class="form-control" placeholder="Referral Code" value="<?php echo $refer?>">
</div>
<div class="form-group checkbox">
<label>
<input id="policy" type="checkbox" data-error="Don't you agree?" required> Agree the terms and Privacy Policy
</label>
<div class="help-block with-errors"></div>
</div>
<button name="register" type="submit" class="btn btn-primary btn-flat m-b-30 m-t-30" >Register</button>
<div class="register-link m-t-15 text-center">
<p>Already have account? Sign in</p>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
All it did was keep the boxes under each other and make them a bit smaller. I'm a bit stuck right now. Help would be appericated. Thanks!
try adding
display:inline-block
on both text boxes.
Alternatively you can also try
display: flex;
You were on the right track with using float to move the elements next to each other. However, when elements are floating next to each other in a cramped space they will stack up by default. By making the parent container larger or smaller you can see how this works.
Also, there were a couple of missing fieldBlocks so the styles stop being applied.
I didn't want to take too much time on it but thought it would be fun to throw together a working sample from the code you provided. There's probably much more that could be cleaned up but hopefully it provides some insight.
http://jsfiddle.net/aY9HC/1373/
CSS
/* make a nice form wrapper */
#main-wrapper{
width:100%;
padding:1em;
}
#main-wrapper h3,
#main-wrapper p,
#main-wrapper button{
text-align:center;
margin-bottom:10px;
clear:left;
}
#main-wrapper button{
display:block;
position:relative;
left:45%;
}
/* Define our basic fieldBlock style / stagger rows */
.fieldBlock
{
width: 50%;
float: left;
margin-bottom:15px;
}
.fieldBlock input,
.fieldBlock select{
height:30px;
}
.fieldBlock input[type='checkbox']{
height:10px;
}
.fieldBlock:nth-of-type(3n){
width:100%;
}
.fieldBlock:nth-of-type(3n) input{
width:40%;
}
/* Define look for our labels */
.fieldBlock label{
font-weight:bold;
display:block;
margin-bottom:5px;
}
.fieldBlock .nonblock{
display:inline-block;
}
HTML
<div id="main-wrapper">
<h3>Register Account</h3>
<p><strong>Create Account</strong> » Purchase » Begin</p>
<form data-toggle="validator" method="post" id="register_form">
<div class="fieldBlock">
<label>Name</label>
<input id="username" type="name" name="name" class="form-control" placeholder="First & Last Name" required>
</div>
<div class="fieldBlock">
<label>Age</label>
<input type="dob" id="age" name="age"class="form-control" placeholder="03/26/2001" required>
</div>
<div class="fieldBlock">
<label>Email address</label>
<input id="email" type="email" name="email" class="form-control" placeholder="Email" data-error="This email is invalid" required>
<div class="help-block with-errors"></div>
</div>
<div class="fieldBlock">
<label>Password</label>
<input id="password" type="password" name="password" class="form-control" placeholder="Password" data-minlength="8" data-error="Minimum of 8 characters" required>
<div class="help-block"></div>
</div>
<div class="fieldBlock">
<label>Choose Your Course</label>
<select name="course" class="form-control">
<option value="0" selected>Texas Parent Taught Drivers Ed</option>
<option value="1">Texas Instructor Taught Drivers Ed</option>
<option value="2">Texas Adult Drivers Ed</option>
</select>
</div>
<div class="fieldBlock">
<label>Referral</label>
<input id="referral" type="text" name="referral" class="form-control" placeholder="Referral Code" value="<?php echo $refer?>">
</div>
<div class="fieldBlock checkbox">
<input id="policy" type="checkbox" data-error="Don't you agree?" required />
<label for="policy" class="nonblock">Agree the terms and Privacy Policy</label>
<div class="help-block with-errors"></div>
</div>
<button name="register" type="submit" class="btn btn-primary btn-flat m-b-30 m-t-30" >Register</button>
<p>Already have account? Sign in</p>
</form>
</div>
You can just use col classes
<div class='row'>
<div class='col'>Your first text box</div>
<div class='col'>Your second text box</div>
</div>
Try to use bootstrap grid (rows and cols) to organize input fields.
Example pattern:
<form data-toggle="validator" method="post" id="register_form">
<div class="row mx-0">
<div class="form-group col-6">
<div class="fieldBlock">
<label>Name</label>
<input id="username" type="name" name="name"
class="form-control"
placeholder="First & Last Name" required>
</div>
</div>
<div class="form-group col-6">
<div class="fieldBlock6">
<label>Age</label>
<input type="dob" id="age"
name="age"class="form-control"
placeholder="03/26/2001" required>
</div>
</div>
</div>
<div class="row mx-0">
<div class="form-group col-12">
<label>Email address</label>
<input id="email" type="email" name="email"
class="form-control" placeholder="Email"
data-error="This email is invalid" required>
<div class="help-block with-errors"></div>
</div>
</div>
</form
I have a PHP that validates if a input is empty if it is an error message is displayed e.g Email required, I am using Bootstrap for my form. Originally the message is displayed under the input (which I don't want).
Code im currently using:
<label>Number Of Rooms: </label>
<input type="number" class="form-control input-sm" max="10" name="Rooms" value="<?php echo $RoomErr;?>">
<span class="error">* <br><?php echo $RoomErr;?></span>
here is the link to the website website
I want to display the error message inside the text input i tried assigning the error to the value of the input:
<label>Number Of Rooms: </label>
<input type="number" class="form-control input-sm error" max="10" name="Rooms" value="<?php echo $RoomErr;?>">
The following does not work.
My CSS just assigns the error to color red
.error{
color:red;
}
I can't find much stuff about this.
You can try like this, because it is working as a placeholder.
<input type="number" class="form-control input-sm error" max="10" name="Rooms" placeholder="<?php echo $RoomErr;?>">
Please try this. I am using position:absolute; And manage this
label {
display: inline-block;
margin-left: 20px;
width: 135px;
}
.error {
color: red;
}
.form-group .error {
left: 165px;
position: absolute;
top: 5px;
}
.form-group{position:relative;}
.form-inline .form-control{display: inline-block;
vertical-align: middle;
width: auto;}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<div class="col-md-9">
<div class="container-form">
<p><span class="error">* required field.</span></p>
<form id="EmailForm" class="form-horizontal" action="" method="post">
<div class="form-inline">
<div class="form-group" style="position: relative;">
<label for="first_name">Name: </label>
<input class="form-control input-sm" name="first_name" type="text">
<span class="error">*Name is required</span>
</div>
</div>
<div class="form-inline">
<div class="form-group">
<label for="last_name">SurnameName: </label>
<input class="form-control input-sm" name="last_name" type="text">
<span class="error">*</span>
</div>
</div>
<div class="form-inline">
<div class="form-group">
<label for="email">Email: </label>
<input class="form-control input-sm" name="email" type="text">
<span class="error">* Email is required</span>
</div>
</div>
<div class="form-inline">
<div class="form-group">
<label>Number Of Rooms: </label>
<input class="form-control input-sm" max="10" name="Rooms" value="Mininum number of Hours : 3" type="number">
<span class="error">* Mininum number of Hours : 3</span>
</div>
</div>
<div class="form-inline">
<div class="form-group">
<label> Number hours: </label>
<input class="form-control input-sm" min="3" name="Hours" type="number">
<span class="error">* Mininum number of Hours : 3</span>
</div>
</div>
<div class="form-inline">
<div class="form-group">
<label for="description">Description of the House: </label>
<textarea name="description" rows="auto" class="form-control input-sm" cols="55"></textarea>
<span class="error">* Description is required</span>
</div>
</div>
<div class="form-inline">
<div class="form-group">
<div class="radio" style="margin-left:70px">
<input name="ironing" id="radiobtn" value="Yes" type="radio">
Yes
</div>
<div class="radio">
<input name="ironing" id="radiobtn" value="No" type="radio">
No
</div>
<span class="error">* Ironing is Required</span>
<span class="help-block" style="margin-left:50px">Would Like Ironing?</span>
</div>
</div>
<input class="btn btn-info btn-lg" name="submit" value="Submit" type="submit">
</form>
</div>
</div>
I am looking to append the submitted form data with the most recent form data on top. Before I added the CSS the form data was appending nicely in order but on the right side.I would like to append in the middle with the nice border. Here is the PHP and CSS. Now it appears somewhat in the center with the nice border, but the text appears on top on the previous submitted form text.
<?php
session_start();
?>
<!DOCTYPE html>
<html>
<head>
<title>Explore</title>
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/pure-min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link id="page_favicon" href="favicon.ico" rel="icon" type="image/x-icon" />
<!-- Optional theme -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2-rc.1/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2-rc.1/js/select2.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="index.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script type="text/javascript" src="ddslick.js"></script>
<script type="text/javascript" src="http://dl.dropbox.com/u/40036711/Scripts/ddslick.js"></script>
<script type="text/javascript" src="searchlist/src/jquery-customselect.js"> </script>
<link rel="stylesheet" type="text/css" href="searchlist/src/jquery-customselect.css">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script type="text/javascript" src="timeago.js"></script>
<!-- GOOGLE API IMPORTANT -->
<link rel="stylesheet" href="main.css">
</head>
<body>
<ol class="breadcrumb" style="position: fixed; width:100%; z-index: 1000;">
<li> <span class="glyphicon glyphicon-home" aria-hidden="true"></span> Home</li>
<li><span class="glyphicon glyphicon-credit-card" aria-hidden="true"></span> Hokie Passport</li>
<li> <span class="glyphicon glyphicon-picture" aria-hidden="true"></span> Photos</li>
<li><span class="glyphicon glyphicon-globe" aria-hidden="true"></span> Weather</li>
</ol>
<div id="allContent" >
<div id="formData" >
<input class="button-warning pure-button" style ="position: fixed; bottom: 0px;"title="Clear page content"type="submit" name="clear" id="clearbtn" value="Clear">
<?php
#FOR THE DRIVERS ONLY
if (!isset($_SESSION['inputs'])) {
// initialize the saved input session variable the first time
$_SESSION['inputs'] = array();
}
if (isset($_POST['name']) || isset($_POST['nameTwo'])) {
array_push($_SESSION['inputs'], $_POST);
}
foreach (array_reverse($_SESSION['inputs']) as $input) {
if(isset($input['desiredNum']))
{
echo " <span class='trip'> <p class='driverAlert' > DRIVER </p> <img src='taxi.png' width ='50' height='50'title='driver'> {$input['name']}, Age: {$input['age']} <br> To: {$input['arriveLoc']} - From: {$input['departLoc']}<br>
Leaves: {$input['departDate']} Returns: {$input['returnDate']} <br> Will drive up to: {$input['desiredNum']} people
<br> Contact # {$input['email']} <br> <br> </span>
";
}
else
{
echo " <span class='trip'> <p class='riderAlert' > PASSENGER </p> <img src='rider.png' width ='50' height='50'title='rider'> {$input['nameTwo']}, Age: {$input['ageTwo']} <br> Would like to go to {$input['departLocTwo']} from {$input['arriveLocTwo']} on {$input['departDateTwo']} and return on
{$input['returnDateTwo']} <br> Contact # {$input['emailTwo']} <br> <br></span>
";
}
}
?>
</div>
<!-- States selector -->
<div id="rider">
<input class="button-success pure-button" type="button" id="riderbtn"value="Passenger"> <br>
<form action="vt.php" id="riderForm" method="post" class="form-inline">
<div class="form-group">
<input required type="text" class="form-control input-sm" required id="nameTwo" name="nameTwo" placeholder="Enter Name" autocomplete="off">
</div><br> <br>
<div class="form-group">
<input type="text" class="form-control input-sm" id="ageTwo" required name="ageTwo" placeholder="Enter Age" autocomplete="off">
</div> <br> <br>
<div class="form-group">
<input type="text" class="form-control input-sm" id="departLocTwo" required name="departLocTwo" autocomplete="off" placeholder="Departure Location">
</div><br> <br>
<div class="form-group">
<input type="text" class="form-control input-sm" id="arriveLocTwo" required name="arriveLocTwo" autocomplete="off"placeholder="Destination Location">
</div><br> <br>
<div class="form-group">
<input type="date" class="form-control input-sm" id="departDateTwo" required name="departDateTwo" autocomplete="off" placeholder="Depart Date">
</div><br> <br>
<div class="form-group">
<input type="date" class="form-control input-sm" id="returnDateTwo" required name="returnDateTwo" autocomplete="off" placeholder="Return Date">
</div> <br> <br>
<div class="form-group">
<input type="email" class="form-control input-sm" id="emailTwo" required name="emailTwo" autocomplete="off" placeholder="Email">
</div><br> <br>
<input class="btn btn-default" type="submit" value="Submit" onclick="submitRider();">
</form>
</div>
<div id="driver">
<input type="button" class="button-success pure-button" id="driverbtn"value="Driver">
<form action="vt.php" id="driverForm" method="post" class="form-inline">
<select class="form-control" id="desiredNum" name="desiredNum">
<option disabled>How many people may you drive?</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
</select>
<br> <br>
<div class="form-group">
<input required type="text" class="form-control " id="name" required name="name" autocomplete="off" placeholder="Enter Name">
</div><br> <br>
<div class="form-group">
<input type="text" class="form-control " id="age" name="age" required autocomplete="off" placeholder="Enter Age">
</div> <br> <br>
<div class="form-group">
<input type="text" class="form-control " id="depart" name="departLoc" required autocomplete="off" placeholder="Departure Location">
</div><br> <br>
<div class="form-group">
<input type="text" class="form-control " id="arrive" name="arriveLoc" required autocomplete="off"placeholder="Destination Location">
</div><br> <br>
<div class="form-group">
<input type="date" class="form-control " id="departDate" name="departDate" required autocomplete="off"placeholder="Depart Date">
</div><br> <br>
<div class="form-group">
<input type="date" class="form-control " id="returnDate" name="returnDate" autocomplete="off" required placeholder="Return Date">
</div> <br> <br>
<div class="form-group">
<input type="email" class="form-control " id="email" required name="email" autocomplete="off" placeholder="Email">
</div><br> <br>
<input class="btn btn-default" type="submit" value="Submit" onclick="submitDriver();">
</form>
</div>
</div>
</body>
<script type="text/javascript">
$('#driverbtn').click(function()
{
$('#driverForm').toggle();
});
$('#riderbtn').click(function()
{
$('#riderForm').toggle();
});
$('#clearbtn').click(function()
{
$.post('clear.php', function()
{window.location = window.location.href;});
});
</script>
<script type="text/javascript">
$(document).ready( function(){
$('#states').ddslick();
});
</script>
<!--- End of rider data -->
</html>
.driverAlert
{
color: green;
}
.riderAlert
{
color:red;
}
body
{
background-color: white;
}
#allContent div
{
width: 33%;
position: relative;
float: left;
}
body
{
overflow-y: scroll;
}
#riderForm
{
display: none;
}
#driverForm
{
display: none;
}
#driverbtn
{
margin-top: 20px;
margin-bottom: 22px;
}
#riderbtn
{
margin-top: 20px;
margin-bottom: 22px;
}
#rider
{
position: fixed;
right: -450px;
}
#driver
{
position: fixed;
right: -200px;
}
#options
{
text-align: center;
}
.trip{
position: fixed;
top: 250px;
right:250px;
display: inline-block;
padding: 16px;
margin: 10px 0;
max-width: 468px;
border: #ddd 1px solid;
border-top-color: #eee;
border-bottom-color: #bbb;
border-radius: 5px;
box-shadow: 0 1px 3px rgba(0,0,0,0.15);
font: bold 14px/18px Helvetica, Arial, sans-serif;
color: #000;
}
So I have an e-newsletter popup on my website so users can stay in contact and up to date with our happenings. I only want the popup to appear on the homepage and i've put together a simple shorthand conditional statement like so:
<?php if(Mage::getSingleton('cms/page')->getPageId() == '2' && Mage::app()->getFrontController()->getRequest()->getRouteName() == 'cms') : ?>
<div id="newsletter_sign_up" style="display:none;" >
<div style="padding:20px;" >
<form action="<?php echo($this->getUrl('newsletter/subscriber/new')) ?>" method="post" >
<div class="fieldset">
<h1 style="color: #28ced7; text-align: left; font-family: Arial, Helvetica, sans-serif; font-size: 28px;">verbiage goes here</h1>
<h2 class="legend" style="text-align:left; font-family: Arial, Helvetica, sans-serif; font-size: 13px;">verbiage goes here</h2>
<!--end-->
<ul class="form-list">
<li class="fields">
<div class="customer-name">
<div class="field name-firstname">
<label class="required" for="firstname" style="text-align:left;"><em>*</em>First Name</label>
<div class="input-box">
<input type="text" class="input-text required-entry" maxlength="255" title="First Name" value="" name="firstname" id="firstname" autocomplete="off"/>
</div>
</div>
<div class="field name-lastname">
<label class="required" for="lastname" style="text-align:left;"><em>*</em>Last Name</label>
<div class="input-box">
<input type="text" class="input-text required-entry" maxlength="255" title="Last Name" value="" name="lastname" id="lastname" autocomplete="off"/>
</div>
</div>
</div>
</li>
<li>
<label class="required" for="email_address" style="text-align:left;"><em>*</em>Email Address</label>
<div class="input-box">
<input type="text" class="input-text validate-email required-entry" title="Email Address" value="" id="email_address" name="email" autocomplete="off"/>
<input class="pop_newsletter_source" name="source" type="hidden" value="3" />
</div>
</li>
</ul>
</div>
<div class="buttons-set form-buttons">
<button onclick="pop_newsletter.submit(); return false;" title="Submit" class="button" type="submit" autocomplete="off" style="position: relative; right: 140px;"><span><span>Submit</span></span></button>
</div>
<p class="required">* Required Fields</p>
<h2 style="text-align: left; font-size: 10px;">Email Privacy Statement:</h2>
<p style="font-family: Arial, Helvetica, sans-serif; font-size: 10px; text-align: left;">more verbiage</p>
<!--//end-->
</form>
</div>
</div>
<?php endif; ?>
I've checked to verify that the page id is 2.
<?php echo "<pre>"; print_r(Mage::getSingleton('cms/page')->getPageId()); echo "</pre>"; ?>
I can't figure out why it breaks... am i missing something blatantly obvious? Any help would be appreciated.