jQuery lightbox form not submitting data - php

I've looked all over the place and it seems that people only want to open a lightbox AFTER submitting a form. I however want to submit the form FROM a lightbox. All my code works until I put the form into a lightbox so I'm wondering if this is even possible.
Form submit code (PHP):
if(isset($_POST['updatemain'])) {
$company = $_POST['conameu'];
$vault = $_POST['vnameu'];
$q = "UPDATE siteinformation SET SiteName = :company, VaultName = :vault";
$query = $db->prepare($q);
$results = $query->execute(array(
":company" => $company,
":vault" => $vault
));
header('Location: vault.php');
}
Form in the lightbox code:
<div class="backdrop"></div>
<div class="box"><div class="close"><img src="images/close.png" /></div>
<fieldset>
<legend>Pick a Section to Work on</legend>
<div id="prompt">Select a Section:</div>
<div id="answer">
<select id="sectionchange">
<option value="main">Main Titles</option>
<option value="organ">Emergency Organizations</option>
<option value="number">Common Numbers</option>
<option value="website">Common Websites</option>
<option value="quicklink">Quick Links</option>
</select>
</div>
</fieldset>
<div id="mainsection">
<form id="updatemain" action="" method="post">
<fieldset>
<legend><strong>Main Title Information</strong></legend>
<div id="prompt">Client Company Name:</div><div id="answer"><input type="text" name="conameu" id="conameu" /></div>
<div id="prompt">Web Tool Name:</div><div id="answer"><input type="text" name="vnameu" id="vnameu" /></div>
<div id="prompt"><input type="submit" id="updatemain" value="Update Information" /></div>
</fieldset>
</form>
</div>
</div>
</div>
Like I said, this works FINE until it is in the light box so I'm kind of stumped at this point.
Any ideas?
Thanks in advance for your time!

Per the comment section:
Add a name attribute with the value updatemain to your submit button.
Without this, PHP will not have a POST value $_POST['updatemain'] set, so the first if statement will always be false.

Updated to reflect that the "name" must be present in the submit button for this to work, even though for whatever reason it didnt need to be before. Thanks again #andbeyond
<div class="backdrop"></div>
<div class="box"><div class="close"><img src="images/close.png" /></div>
<fieldset>
<legend>Pick a Section to Work on</legend>
<div id="prompt">Select a Section:</div>
<div id="answer">
<select id="sectionchange">
<option value="main">Main Titles</option>
<option value="organ">Emergency Organizations</option>
<option value="number">Common Numbers</option>
<option value="website">Common Websites</option>
<option value="quicklink">Quick Links</option>
</select>
</div>
</fieldset>
<div id="mainsection">
<form id="updatemain" action="" method="post">
<fieldset>
<legend><strong>Main Title Information</strong></legend>
<div id="prompt">Client Company Name:</div><div id="answer"><input type="text" name="conameu" id="conameu" /></div>
<div id="prompt">Web Tool Name:</div><div id="answer"><input type="text" name="vnameu" id="vnameu" /></div>
<div id="prompt"><input type="submit" id="updatemain" name="updatemain" value="Update Information" /></div>
</fieldset>
</form>
</div>
</div>
</div>

Related

How to let a button automatically enter values from the database into a form?

This is an image of how the page looks like,
The 2 big blue buttons at the top are buttons that represent a value from the database. The main function of this button is to help the user to fill in the form in a convenient way leaving only the "Description" to be filled in.
This is my code for the page,
<div class="bodycontainer">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">My Records</h3>
</div>
<div class="panel-body">
<?php
require 'dbfunction.php';
$con = getDbConnect();
$day = date("l");
if (mysqli_connect_errno($con)) {
"Failed to connect to MySQL: " . mysqli_connect_error();
} else {
$result = mysqli_query($con, "SELECT * FROM timetableschedule WHERE day='" . $day . "'");
while ($schedule = mysqli_fetch_array($result)) {
?>
<div class="col-md-4">
<div class="admininfobox">
<a class="btn btn-primary">
<?php
echo "<br/>";
echo $schedule['academicInstitution'] . "<br />";
echo $schedule['startTime'] . "-" . $schedule['endTime'] . "hrs<br />";
echo "<br/>";
?>
</a>
</div>
</div>
<?php
}
mysqli_close($con);
}
?>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Record Activity</div>
<div class="panel-body">
<form name="Create New Admin" class="form-horizontal" method="post" action="handlerecord.php">
<div class="form-group">
<div class="col-sm-4">
<label>Academic Institution</label>
<input list="AcadInst" type="text" class="form-control" placeholder="Institution Name" name="academicInstitution">
<datalist id="AcadInst">
<option value="Singapore Polytechnic (SP)">
<option value="Ngee Ann Polytechnic (NP)">
<option value="Temasek Polytechnic (TP)">
<option value="Republic Polytechnic (RP)">
<option value="Nanyang Polytechnic (NYP)">
<option value="Others (Please specify)">
</datalist>
</div>
<div class="col-sm-4">
<label>Level of Teaching</label>
<input list="LvTeaching" type="text" class="form-control" placeholder="Teaching Stage" name="levelofteaching">
<datalist id="LvTeaching">
<option value="Undergraduate Teaching">
<option value="Postgraduate Teaching">
<option value="Continuing Education">
<option value="Others (Please specify)">
</datalist>
</div>
<div class="col-sm-4">
<label>Type of Teaching</label>
<input list="TyTeaching" type="text" class="form-control" placeholder="Teaching Type" name="typeofteaching">
<datalist id="TyTeaching">
<option value="Clinical Teaching">
<option value="Academic Teaching">
<option value="Talk">
<option value="Others (Please specify)">
</datalist>
</div>
</div>
<div class="form-group">
<div class="col-sm-4">
<label for="startdate">Start Time</label>
<input type="text" class="form-control" placeholder="Select Time" name="starttime">
</div>
<div class="col-sm-4">
<label for="enddate">End Time</label>
<input type="text" class="form-control" placeholder="Select Time" name="endtime">
</div>
<div class="col-sm-4">
<label for="enddate">Description</label>
<input type="text" class="form-control" placeholder="Optional" name="Description">
</div>
</div>
<div class="form-group">
<div class="col-sm-4">
<input type="submit" value="Add" class="btn btn-primary">
</input>
</div>
</div>
</form>
</div>
</div>
An overview of the database,
I am not sure on how to code it. Like Once the user click onto the button, the button goes through the database and input the data accordingly into the form ready for the user to submit.
My suggestion is to create an AJAX request on click.
Create a page loadFormData.php
Accept key data to search in database. For eg: id. Then search in database with this key and get the results. Finally encode this to json (json_encode()) and echo the result.
When the user clicks on the button, trigger an ajax (Javascript) function and send the key values to the loadFormData.php
From the returned json result, extract institution name, start time, end time etc and fill this to form fields using JavaScript
$("#blueButton").click(function() {
$.ajax({
type: "GET",
url: "loadFormData.php",
dataType: "json",
success : function(data) {
// extract each item from the variable 'data'
}
});
});
You should create a form and use action to state the method of entering the values that you want.
For example
http://www.w3schools.com/php/php_forms.asp
You can use this to enter the data easily.

Why Reset functionality is not working with dynamic dropdown in php

In the following code the Reset functionality is not working with this dropdown means onclick of Reset button textbox value get reset but the dropdown select is not reset to default value "select addvertize".
<form enctype="multipart/form-data" class="contact-form" name="deleteadvertize" id="deleteadvertize" action="" method="post">
<div class="row form-group">
<div class="col-xs-12">
<label>Select Advertize</label>
<div class="selector">
<?php
include 'config.php' ;
$result = mysql_query("select * from advertise");
echo '<select id="advt_id" name="advt_id" class="full-width selector">';
echo " <option value=''>Select One Advertize</option>";
while ($row = mysql_fetch_array($result)) {
echo "<option value='" . $row['advt_id'] ."'>" . $row['advt_title'] ."</option>";
}
echo "</select>"; ?>
</div>
</div>
</div>
<div align="center">
<button type="submit" class="btn-large">Submit</button>
<button type="reset" class="btn-large">Reset</button>
</div>
<form>
<div class="row form-group">
<div class="col-xs-12">
<label>Select Advertize</label>
<div class="selector">
<select id="advt_id" name="advt_id" class="full-width selector">
<option value=''>Select One Advertize</option>
<option value='1'>Select One </option>
</select>
</div>
</div>
</div>
<div align="center">
<button type="submit" class="btn-large">Submit</button>
<button type="reset" class="btn-large">Reset</button>
</div>
</form>
you need to you wrap your html in form tag
<form></form>
if still not work use jquery for this
$('select[name=advt_id] option').removeAttr('selected');
Reset works when you have <form></form> tag. Please check you have form tag or not ? if not the add.

Form and Validation/CSS Issue

I have a form located here:
http://f14.co/auto-search/Test/
You'll see in the code that there is a form element about halfway down:
</div>
<form method="post" class="form-horizontal" id="final_form" action="send_mail.php">
<input type="hidden" name="template" id="template" value="Buyers" />
<div class="modal-body" >
<div id="lead_info_1">
<div class="input select">
<div class=""></div>
<div class="span-4 step-2-dropdown append-bottom control-group">
<select class="span3 required" name="minPrice" id="minPrice">
About 1/4 of the way down there is a checkbox that I need to be inside the form to work with send_mail.php:
<div class="sold"></div>
<div class="form">
<h2>Search for your dream home<br />
and save now!</h2>
<legend>Which Areas are you interested in?</legend>
<div class="areas row-fluid" style="text-align:left !important;">
<div class='span5' style='margin-left:0px !important;'>
<label>
<input type="checkbox" name="arrayValue[]" id="area[0]" value="test" style='margin-top:-5px !important;'> test</label>
</div>
</div>
<input type="button" onclick="jQuery('#myModal').modal('show')" value="CONTINUE" />
However, if I move the form element above the checkboxes, the error checking (the form turns red if values aren't filled out), goes away.
Anyone know how to preserve the error checking? I can't for the life of me figure out what I'm doing wrong. Not sure if this is a page code problem or a CSS issue.

Html form posting, no data passed on [duplicate]

This question already has answers here:
Does form data still transfer if the input tag has no name?
(3 answers)
Closed 5 years ago.
I've been sitting with this problem for a while now, can't seem to figure out whats wrong with the code.
The problem is that no data gets posted from the form to the script.
<div class="mws-panel-body">
<form class="mws-form" action="blueprints/add" method="post" id="pForm">
<div class="mws-form-inline">
<div class="mws-form-row">
<label>Blueprint name</label>
<div class="mws-form-item small">
<input type="text" class="mws-autocomplete mws-textinput" id="pName" value="" />
<div>The name of the blueprint, search completion is enabled.</div>
</div>
</div>
<div class="mws-form-row">
<label>Hangar</label>
<div class="mws-form-item micro">
<select id="pHangar">
<option value="0" selected>Personal</option>
<option value="1">Corporation</option>
</select>
<div>Indicates who the blueprint belongs to.</div>
</div>
</div>
<div class="mws-form-row">
<label>State</label>
<div class="mws-form-item micro">
<select id="pState">
<option value="1" selected>Original</option>
<option value="0">Copy</option>
</select>
<div>The state of the blueprint, be it original or a copy.</div>
</div>
</div>
<div class="mws-form-row">
<label>Productions runs</label>
<div class="mws-form-item small">
<input type="text" class="mws-textinput" id="pRuns" value="0" />
<div>The number of production runs left on copy.</div>
</div>
</div>
<div class="mws-form-row">
<label>Material efficiency</label>
<div class="mws-form-item small">
<input type="text" class="mws-textinput" id="pME" value="0" />
<div>The current material efficiency level of the blueprint.</div>
</div>
</div>
<div class="mws-form-row">
<label>Production efficiency</label>
<div class="mws-form-item small">
<input type="text" class="mws-textinput" id="pPE" value="0" />
<div>The current production efficiency level of the blueprint.</div>
</div>
</div>
</div>
<div class="mws-button-row">
<input type="submit" value="Add blueprint" class="mws-button blue" />
<input type="reset" value="Reset" class="mws-button gray" />
</div>
</form>
</div>
It seems to be a problem with the form itself, as if the form is set to get, it just enters the script with a question-mark only, blueprints/add?, meaning no data gets passed on at all.
Any pointers or suggestions will be appreciated.
My platform is PHP if that helps.
You should be using the name attribute of input to send the data to a PHP post script. Example:
Form:
<form action="add.php" method="post">
<input type="text" name="firstname" />
</form>
Script (add.php):
<?php
//print the $_POST['firstname'] variable
echo $_POST['firstname'];
?>
You need to add the name attribute to your input and select elements
<input type="text" name="myinput">
Php will then build your $_POST array with those names.

cross-browser problem with input type submit

I have a problem with a form that I made, it is working in Firefox but in IE and Chrome it doesnt! when I press the Submit button in IE and Chrome nothing happens! I didnt check this before because I didnt thought that I will have problems like this! I dont know what I am missing here! is there any known problem (bug)
the form:
<div id="Formulari">
<div class="WraperForForm">
<form action="index.php?menu=rezervimet&submenu=rezervo" method="post">
<div class="elementsLabelBox">
Emri:
</div>
<div class="elementsBox">
<input type="text" id="emri" name="emri">
</div>
<div class="elementsLabelBox">
Mbiemri:
</div>
<div class="elementsBox">
<input type="text" id="mbiemri" name="mbiemri">
</div>
<div class="elementsLabelBox">
Prej:
</div>
<div class="elementsBox">
<select class="selectDest" name="Prej" onChange="getState(this.value)">
<option></option>
'.funksionet::all_directions().'
</select>
</div>
<div class="elementsLabelBox">
Deri:
</div>
<div class="elementsBox">
<div id="statediv"><select class="selectDest" name="deri">
<option></option>
</select></div>
</div>
<div class="elementsLabelBox">
<form name="Data1Drejtim">
<label for="data1drejtim">Data e nisjes:</label>
</div>
<div class="elementsBox">
<input type="text" id="data1drejtim" name="data1drejtim">
<script language="JavaScript">
// whole calendar template can be redefined per individual calendar
var A_CALTPL = {
\'months\' : [\'Janar\', \'Shkurt\', \'Mars\', \'Prill\', \'Maj\', \'Qershor\', \'Korrik\', \'Gusht\', \'Shtator\', \'Tetor\', \'Nentor\', \'Dhjetor\'],
\'weekdays\' : [\'Di\', \'He\', \'Ma\', \'Me\', \'Ej\', \'Pr\', \'Sh\'],
\'yearscroll\': true,
\'weekstart\': 0,
\'centyear\' : 70,
\'imgpath\' : \'images/\'
}
new tcal ({
// if referenced by ID then form name is not required
\'controlname\': \'data1drejtim\'
}, A_CALTPL);
</script>
</div>
<!-- ___________________ RETURN DATE _____________________________________ -->
<div id="hideThis">
<div class="elementsLabelBox">
<label for="dataKthyese">Data kthyese:</label>
</div>
<div class="elementsBox">
<input type="text" id="dataKthyese" name="dataKthyese">
<script language="JavaScript">
// whole calendar template can be redefined per individual calendar
var A_CALTPL = {
\'months\' : [\'Janar\', \'Shkurt\', \'Mars\', \'Prill\', \'Maj\', \'Qershor\', \'Korrik\', \'Gusht\', \'Shtator\', \'Tetor\', \'Nentor\', \'Dhjetor\'],
\'weekdays\' : [\'Di\', \'He\', \'Ma\', \'Me\', \'Ej\', \'Pr\', \'Sh\'],
\'yearscroll\': true,
\'weekstart\': 0,
\'centyear\' : 70,
\'imgpath\' : \'images/\'
}
new tcal ({
// if referenced by ID then form name is not required
\'controlname\': \'dataKthyese\'
}, A_CALTPL);
</script>
</form>
</div>
</div>
<div class="elementsLabelBox">
Persona:
</div>
<div class="elementsBox">
<select name="persona">
<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>
</select>
</div>
<!-- <tr>
<td width="30" >Fëmij:</td>
<td><input type="text" size="3" name="femij"></td>
</tr> -->
<div class="elementsBox">
</div>
<div class="elementsLabelBox">
</div>
<div class="elementsLabelBox">
<label for="1drejtim">Një drejtim</label>
<input type="radio" id="1drejtim" name="drejtimi" value="një drejtim" onclick="toggleVisibility(\'hideThis\',0)">
<br/>
<label for="1drejtim">Kthyese</label>
<input type="radio" id="kthyese" name="drejtimi" checked="checked" value="kthyese" onclick="toggleVisibility(\'hideThis\',1)">
</div>
<input style="float:right;margin:15px 49px 0 0;" type="submit" value="Rezervo" name="rezervo" />
</form><!-- end of the reservation form-->
</div>
</div><!-- end of Formulari-->
Thank you for your time.
You have two <form> tags in this document, and the one nested closest to the submit button has no action or method attributes. IE and Chrome are correct to do nothing since this form has no action to associate with submission.

Categories