I need to remove the blank option.
This is a restaurant web page and this is the reservation form.
The thing is that they are reciving a lot of "blank" reservation hours because people don't specify the reservation hour.
Sorry for my English, I'm from Spain :)
The code:
HTML read by browser
<div id="lashoras">
<select name="Hora" size="1" onChange="updateHoraPersonas();">
<option value="" selected="selected"> </option>
<option value="1330">13:30</option>
<option value="1400">14:00</option>
<option value="1430">14:30</option>
<option value="1500">15:00</option>
<option value="1930">19:30</option>
<option value="2000">20:00</option>
<option value="2030">20:30</option>
<option value="2100">21:00</option>
<option value="2130">21:30</option><option value="2200">22:00</option></select>
</div>
source code HTML
<div id="lashoras">
<?php
echo $selectFullDay;
?>
SelectFullDay PHP Var
$selectFullDay = build_select_options ("Hora","id_lookup","lookup","lookups",0," ",$onChange,$theWhere,$multiple,$orderby);
updateHoraPersonas Function
function updateHoraPersonas(){
var mediodiaMax = maxPersonas;
var nocheMax = maxPersonas;
mediodiaMax = maxPersonas-curDia_mediodia_reservados;
if(mediodiaMax<0) mediodiaMax = 0;
nocheMax = maxPersonas-curDia_noche_reservados;
if(nocheMax<0) nocheMax = 0;
var hora = $('#lashoras').val();
//hora blank for first, otherwise 1330
//primero ver si llegado a tope de mediodia/noche
if (hora <= horaCambio) {
selectMax = mediodiaMax;
} else {
selectMax = nocheMax;
}
//y ahora hora a hora
selectMax = Math.min(selectMax,horasArray[hora]);
var Numero_de_personasSelect = "";
for (i=1 ; i<= selectMax ; i++) {
if (i==1) {
selected = "selected='selected'";
} else {
selected = "";
}
Numero_de_personasSelect += "<option value='"+i+"' "+selected+" >"+i+"</option>";
}
if (selectMax <=0 ) {
Numero_de_personasSelect += "<option value=''>Completo</option>";
}
$("#Numero_de_personas").html(Numero_de_personasSelect);
//alert('mediodiaMax: '+mediodiaMax+' | nocheMax: '+nocheMax+' | selectMax: '+selectMax);}
</script>
....
Change the form submission so that the user cannot submit if the reservation time is not specified! This way you processing time does not increase on explicitly removing blank options
an exapmle
<?php
if(!isset($_POST['time'])){
//'Enter valid details
}else{
//redirect here
}
Related
I am working on an administrative form where I have to select the client first and then select the building.
I have in the database a table with clients and another with the buildings of the clients correctly associated.
The problem is that I I wanted to do a select with the clients and a select with the buildings but instead of showing all the buildings, only showing the ones of the selected client.
I was able to do the code below after a lot of research, but I could not get it to fetch the values to bd to the salect of the building.
This form is for managers to assign tasks to technicians, where technicians will have to do pre-contracted services.
<!DOCTYPE html>
<html>
<head>
<script>
function populate(s1,s2){
var s1 = document.getElementById(s1);
var s2 = document.getElementById(s2);
s2.innerHTML = "";
if(s1.value == "Chevy"){
var optionArray = ["|","camaro|Camaro","corvette|Corvette","impala|Impala"];
} else if(s1.value == "Dodge"){
var optionArray = ["|","avenger|Avenger","challenger|Challenger","charger|Charger"];
} else if(s1.value == "Ford"){
var optionArray = ["|","mustang|Mustang","shelby|Shelby"];
}
for(var option in optionArray){
var pair = optionArray[option].split("|");
var newOption = document.createElement("option");
newOption.value = pair[0];
newOption.innerHTML = pair[1];
s2.options.add(newOption);
}
}
</script>
</head>
<body>
<h2>Choose Your Car</h2>
<hr />
Choose Car Make:
<select id="slct1" name="slct1" onchange="populate(this.id,'slct2')">
<option value=""></option>
<option value="Chevy">Chevy</option>
<option value="Dodge">Dodge</option>
<option value="Ford">Ford</option>
</select>
<hr />
Choose Car Model:
<select id="slct2" name="slct2"></select>
<hr />
</body>
</html>
as a final result would have to be for example if I select the client AAA must appear in buildings only the buildings associated with the customer AAA:
AAA-buildings1
AAA-buildings2
AAA-buildings3
...
If I understand the question, you wish to (a) trap the user's SELECT choice of client, and then use that information to get the appropriate info from the database in order to populate the second SELECT.
This is exactly the type of scenario for which AJAX was created. It's actually pretty simple (more simple with jQuery than with pure js, but isn't everything...). Here are some examples on how it works:
dropdown options is dependent from another dropdown options (all value from database)
A basic video tutorial re ajax (pure javascript)
Code Examples:
HTML:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<select id="slct1" name="slct1">
<option value=""></option>
<option value="Chevy">Chevy</option>
<option value="Dodge">Dodge</option>
<option value="Ford">Ford</option>
</select>
<hr />
Choose Car Model:
<select id="slct2" name="slct2"></select>
JS/JQuery:
$('#slct1').change(function(){
let s1 = this.value;
$.ajax({
type: 'post',
url: 'myajax.php',
data: 's1=' + s1
}).done(function(d){
$('#slct2').html(d); //"d" can be any varname you want (here AND line above)
});
});
PHP file: (myajax.php)
<?php
$sel1 = $_POST['s1'];
if ($sel1 == 'Chevy'){
$out = '<option value="Cobalt">Cobalt</option>';
$out += '<option value="Camaro">Camaro</option>';
$out += '<option value="Malibu">Malibu</option>';
$out += '<option value="Silverado">Silverado</option>';
}elseif ($sel1 == 'Ford'){
$out = '<option value="Model A">Model A</option>';
$out += '<option value="F150">F150</option>';
$out += '<option value="Mustang">Mustang</option>';
$out += '<option value="Mondeo">Mondeo</option>';
}
echo $out;
Example 2:
Untested and off-the-cuff, but you get the idea
<?php
include 'connect.php'; //connects to MySQL and creates $conn
$sel1 = $_POST['s1'];
$query = "SELECT * FROM `cars` WHERE `brand`='" .$sel1. "' ";
$aR = mysqli_query($conn, $query);
$out = '';
while ($r = mysql_fetch_assoc($aR)){
$out .= '<option value="' .$r['model']. '">' .$r['model']. '</option>';
}
echo $out;
I am trying to create something similar to an auction/bidding table/form.
If a value (current bid) is 1000, I am trying to create a selection box that allows another user to bid in intervals of 500, so for this example the outcome would be like:
Current Bid: 1000
Buy Now: 5000
<select class="form-control">
<option value="1500">1500</option>
<option value="2000">2000</option>
<option value="2500">2500</option>
<option value="3000">3000</option>
<option value="3500">3500</option>
<option value="4000">4000</option>
<option value="4500">4500</option>
</select>
Something like this:
<?php
$query = $db->query('SELECT * FROM auctions WHERE available = 1 LIMIT 1');
$num = $query->num_rows;
if($num > 0) {
echo '<select class="form-control">';
foreach($query as $row) {
$currentBid = $row['currentBid']; // 1000
$buyNow = $row['buyNow']; // 5000
$bids = ?? // this is where I am stuck, how can I make the difference between $currentBid and $buyNow show as options divided by 500's
echo '
<option value="'.$bids.'">'.$bids.'</option>
';
}
echo '</select>';
}
else {
echo "No auctions available";
}
?>
...
$currentBid = $row['currentBid'];
$buyNow = $row['buyNow'];
...
$options = '';
for($p = $currentBid + 500; $p <= $buyNow; $p += 500) {
$options .= '<option value="'.$p.'">'.$p.'</option>';
}
So I am trying to make this clip submission form interactive in the following way:
I want the second Select list choices to change according to which city is selected in the first select list.
Here is my script function code:
<script>
function spotListChange(s1, s2) {
var s1 = document.getElementById(s1);
var s2 = document.getElementById(s2);
s2.innerHTML = "";
if(s1.value == ""){
var optionArray = ["|"];
}
<?php
while ($cityList = $cityListDB->fetch()) {
$city = $cityList['city'];
$spotList = $db->query("SELECT * FROM spots WHERE city='$city' ORDER BY name");
?>
else if(s1.value == "<?php echo $city; ?>"){
var optionArray = ["|"
<?php
while ($spot = $spotList->fetch()) {
echo ", \"" . $spot['city'] . "|" . $spot['city'] . "\"";
}
?>
];
}
<?php
}
?>
for(var option in optionArray){
var pair = optionArray[option].split("|");
var newOption = document.createElement("option");
newOption.value = pair[0];
newOption.innerHTML = pair[1];
s2.options.add(newOption);
}
}
</script>
Here is the part of the form with the two select lists. (I'll get rid of most city options available just to make the code shorter)
<select id="city" name="city" style="margin-left: 135px;" onChange="spotListChange('city', 'spotSelectList')" required>
<option value="" selected="selected">Ville...</option>
<option value="Albanel">Albanel</option>
<option value="Alma">Alma</option>
<option value="La Doré">La Doré</option>
<option value="Saint-Félicien">Saint-Félicien</option>
<option value="Mashteuiatsh">Mashteuiatsh</option>
</select><br />
<select id="spotSelectList" name="spot" style="margin-left: 135px;">
</select>
If I change the PHP inside the else if by fix/text values, it works fine, so the issue must be there, but I don't get where the issue is.
Do yourself a favor and use jquery for it, it makes your code more simple and is a plenty of tutorial out there.
I recomend you make a json response from php to an ajax call from jquery (javascript).
Can you see this as reference:http://simpleweb.github.io/jquery-dependent-selects/
also this:http://www.9lessons.info/2010/08/dynamic-dependent-select-box-using.html
Hope this helps you.
I have a similar problem like this one: Code Igniter - form_dropdown selecting correct value from the database, but in this case, i have 2 dropdown, State & City (using JavaScript). The dropdown option for City is repopulated based on what user choose in State dropdown.
For example, when a user choose a State (eg: New York), then the dropdown options for City become only cities in New York (eg: Albany, Amsterdam etc).
After user selects a value, then hits save, its saved to the database.
The problem is, how do i get the dropdown to automatically choose the one thats been selected by the user in the initial stage? I can do it if it's only 1 dropdown option. But in this case, the dropdown for City is repopulated based on what user choosed in State dropdown option.
Controller:
//this one i managed to get it automatically choose the one that's been selected by the user in the initial stage
$username=$this->session->userdata('username');
$data['orgtype'] = $this->m_user->get_orgtype_dropdown($username);
//these two are the problem
$data['state'] = $this->m_user->get_state_dropdown($username);
$data['city'] = $this->m_user->get_city_dropdown($username);
Model:
function get_orgtype_dropdown($username){
$sqlstr="SELECT * FROM a01 WHERE username='$username'";
$hslquery=$this->db->query($sqlstr);
foreach($hslquery->result_array() as $row){
$return[$row['orgtype']] = $row['orgtype'];
}
return $return;
}
function get_state_dropdown($username){
$sqlstr="SELECT * FROM a01 WHERE username='$username'";
$hslquery=$this->db->query($sqlstr);
foreach($hslquery->result_array() as $row){
$return[$row['state']] = $row['state'];
}
return $return;
}
function get_city_dropdown($username){
$sqlstr="SELECT * FROM a01 WHERE username='$username'";
$hslquery=$this->db->query($sqlstr);
foreach($hslquery->result_array() as $row){
$return[$row['city']] = $row['city'];
}
return $return;
}
View:
<?php
$orgtypeOption = array(
'Academic' => 'Academic',
'Professional' => 'Professional',
);
echo form_label("Organization Type : ");
echo form_dropdown('orgtype', $orgtypeOption, $orgtype);
echo br();
echo form_label("State : ");
?>
<select name ="state" id="countrySelect" size="1" onChange="makeSubmenu(this.value)">
<option></option>
<option value="USA" <?php if ($state=="USA") echo 'selected="selected"';?>>USA</option>
<option value="Singapore" <?php if ($state=="Singapore") echo 'selected="selected"';?>>Singapore</option>
<option value="Jawa Timur" <?php if ($state=="Jawa Timur") echo 'selected="selected"';?>>Jawa Timur</option>
<option value="Jawa Barat" <?php if ($state=="Jawa Barat") echo 'selected="selected"';?>>Jawa Barat</option>
</select>
<?php
echo br();
echo form_label("City : ");
?>
<select name="city" id="citySelect" size="1">
<option></option>
</select>
JavaScript:
var citiesByState = {
USA: ["NY","NJ"],
Singapore: ["taas","naas"],
"Jawa Timur": ["Surabaya","Malang"],
"Jawa Barat": ["Bandung","Banjar"]
};
function makeSubmenu(value) {
if(value.length==0) document.getElementById("citySelect").innerHTML = "<option></option>";
else {
var citiesOptions = "";
for(cityId in citiesByState[value]) {
citiesOptions+="<option>"+citiesByState[value][cityId]+"</option>";
}
document.getElementById("citySelect").innerHTML = citiesOptions;
}
}
function displaySelected() {
var country = document.getElementById("countrySelect").value;
var city = document.getElementById("citySelect").value;
alert(country+"\n"+city);
}
function resetSelection() {
document.getElementById("countrySelect").selectedIndex = 0;
document.getElementById("citySelect").selectedIndex = 0;
}
Here's the preview: application preview picture
Help please
I am still a beginner with PHP. I am having a problem with drop downs and links. I want to be able to choose an option in the drop down menu and it go to the specified page. For some reason only the links for the second drop down menu. (MUNICIPALITIES) will work correctly by linking to the specific municipality page. The crime drop down menu will not link to the specific crime page. I have included the code for the crime drop down and municipality drop down. I have also included the script below.
Ultimately my question is why aren't both drop downs functioning correctly with the link?
<script language="JavaScript" type="text/javascript">
function gopage(theLink) {
if (document.dropdown.theLink.value != "") {
location.href = document.dropdown.theLink.value;
}
}
</script>
<form name="dropdown">
<select name="theLink" onchange="gopage(theLink)">
<option value="ALL">Choose Crime associated with the Gang</option>
<?php
//echo 'NOWWWWWWWWWWWWWWWWWWWWWW';
if ($length3 <> 0) {
for ($m = 0; $m < $length3; $m++) {
$rows = $resultset3[$m][crime_name];
$trackchoices = $rows;
$options2 = "<option value=\"crimesmain.php?crime=$trackchoices\">$trackchoices</option>";
echo "$options2";
}
}
else if ($length3 == 0) {
$trackanswer = "NO CRIMES";
$options5 = "<option value=\"$trackanswer\">$trackanswer</option>";
echo "$options5";
}
?>
</select>
</form>
<br>
<br>
<form name="dropdown">
<select name="theLink" onchange="gopage(this)">
<option value="ALL">Choose Municipality associated with the Gang</option>
<?php
if ($length12 <> 0) {
for ($q = 0; $q < $length12; $q++) {
$rows2 = $resultset6[$q][municipality_name];
$trackchoices2 = $rows2;
//try
$options3 = "<option value=\"municipalitymain.php?mun=$trackchoices2\">$trackchoices2</option>";
//echo "<a href='municipalitymain.php?mun=$options3'>";
echo "$options3";
}
}
else if ($length12 == 0) {
$trackanswer = "NO MUNICIPALITY";
$options6 = "<option value=\"$trackanswer\">$trackanswer</option>";
echo "$options6";
}
?>
</select>
</form>
I think a better solution would be to pass the id of the select element to gopage so your function looks like this
function gopage(elId)
{
if (document.getElementById(elId).value != "") {
location.href = document.getElementById(elId).value;
}
}
First Dropdown
<select name="theLink" id="crime" onchange="gopage('crime')">
Second Dropdown
<select name="theLink2" id="muni" onchange="gopage('muni')">