I'm making a registration form which will have the user put in his birthday.
The problem is when it comes to February and months who do not end in 31. The user is able to put something like 31 February or 31 April. Is there any practical way to display just 28 when February is selected? (aside from using Ajax)
<html>
<body>
<form action="registration.php" method="post">
<p><u>Select table</u></p>
<p>Select date:</p>
<select name="day">
<?php
for($i=1;$i<=31;$i++)
{
echo '<option value='.$i.'>'.$i.'</option>';
}
<select name="month">
<option value="January">January</option>
<option value="February">February</option>
<option value="Mars">Mars</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
<select name="year">
<?php
for($i=2011;$i<=2015;$i++)
{
echo '<option value='.$i.'>'.$i.'</option>';
}
?>
</select>
<br/><br/>
<input type="submit" value="Submit" />
</form>
</body>
</html>
Don't do that.
Most people are most comfortable typing their birthday out in full. The <option>/<select> bit is really unnecessary.
If you don't have access to a good date guesser server side (odds are you do), break it into three separate fields, but usually, that's not even necessary.
Just give them a single field that can comfortably fit 10 digits, and if the date is ambiguous when you receive it, ask the user if you guessed right.
http://jqueryui.com/demos/datepicker/
Use this and all your date problems are solved forever.
<html>
<head>
<title>Test</title>
</head>
<body>
Date Of Birth:
<select name="month" onChange="changeDate(this.options[selectedIndex].value);">
<option value="na">Month</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
<select name="day" id="day">
<option value="na">Day</option>
</select>
<select name="year" id="year">
<option value="na">Year</option>
</select>
<script language="JavaScript" type="text/javascript">
function changeDate(i){
var e = document.getElementById('day');
while(e.length>0)
e.remove(e.length-1);
var j=-1;
if(i=="na")
k=0;
else if(i==2)
k=28;
else if(i==4||i==6||i==9||i==11)
k=30;
else
k=31;
while(j++<k){
var s=document.createElement('option');
var e=document.getElementById('day');
if(j==0){
s.text="Day";
s.value="na";
try{
e.add(s,null);}
catch(ex){
e.add(s);}}
else{
s.text=j;
s.value=j;
try{
e.add(s,null);}
catch(ex){
e.add(s);}}}}
y = 1993;
while (y-->1940){
var s = document.createElement('option');
var e = document.getElementById('year');
s.text=y;
s.value=y;
try{
e.add(s,null);}
catch(ex){
e.add(s);}}
</script>
</body>
</html>
You could use JavaScript to restrict the dropdown to 28, 30, or 31 days based on the month. This does not require you to use AJAX.
Related
I have a table with a varchar column. I use a select form with values 01, 02, 03, 04 .... 10, 11, 12 etc to store data in this column. My problem is that, when I submit the form, the leading 'Zero' is removed. How can I maintain the leading zero?
**
NB. I have checked other similar posts but they don't have the
solution for my issue. I have tried var/char/text and still it's not
working hence why I posted this question if there's another way to get this done.
**
<form method=post enctype="multipart/form-data">
<select name="dd">
<option selected="selected">Day</option>
<option value='01'>01</option>
<option value='02'>02</option>
<option value='03'>03</option>
<option value='04'>04</option>
<option value='05'>05</option>
<option value='06'>06</option>
<option value='07'>07</option>
<option value='08'>08</option>
<option value='09'>09</option>
<option value='10'>10</option>
<option value='11'>11</option>
</select>
<select name="mm">
<option selected="selected">Month</option>
<option value='01'>01</option>
<option value='02'>02</option>
<option value='03'>03</option>
<option value='04'>04</option>
<option value='05'>05</option>
<option value='06'>06</option>
<option value='07'>07</option>
<option value='08'>08</option>
<option value='09'>09</option>
<option value='10'>10</option>
<option value='11'>11</option>
</select>
</form>
MySQL is as follows;
$caption = $_POST['dd'].-$_POST['mm'];
$sql = "INSERT INTO pages SET caption = '$caption'";
Use sprintf to format your value:
$caption = sprintf("%02d-%02d", $_POST['dd'], $_POST['mm']);
The key here is to work with the data as strings and don't do math on it like -$_POST['mm'] which will treat it as a number. In numbers leading zeros are always omitted because they always exist. 10 is actually something like 0x0000000a as far as the CPU is concerned.
I have requirement to get date between particular years so I have put two dropdown “from year” and “to Year” but I want to make validation for that “to dropdown” value must be great than “form dropdown”
Below is my html code
<div class="graph-filter">
<label>From</label>
<select onchange="change_data_year();" id="from_data_year" name="from_data_year" class="graph-select">
<option selected="" value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
</select>
<label>To</label>
<select id="to_data_year" name="to_data_year" class="graph-select">
<option selected="" value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
</select>
<input type="submit" value="Submit">
Try like this
function change_data_year(){
$('#to_data_year option').prop('disabled',false);
var from_data_year=$('#from_data_year').val();
var to_data_year=$('#to_data_year').val();
$('#to_data_year option').filter(function() {
return $(this).val() < from_data_year;
}).prop('disabled', true);
}
I hope that is like you need it.
I am developing a website using CI, PHP, JQuery. I have a dropdown menu. When I try to get the value using JQuery, the result always 0. Here is my code.
html:
<div id="label"><label>Merk</label></div><div id="pilihan"><select name="brand">
<option value="0">PILIH SATU</option>
<option value="1">ACURA</option>
<option value="2">ALFA ROMEO</option>
<option value="3">ASTON MARTIN</option>
<option value="4">AUDI</option>
<option value="5">BENTLEY</option>
<option value="6">BERTONE</option>
<option value="7">BIMANTARA</option>
<option value="8">BMW</option>
<option value="9">BUGATTI</option>
<option value="10">BUICK</option>
<option value="11">CADILLAC</option>
<option value="12">CHANA</option>
<option value="13">CHERY</option>
<option value="14">CHEVROLET</option>
<option value="15">CHRYSLER</option>
<option value="17">CITROEN</option>
<option value="18">CODA</option>
<option value="19">DAEWOO</option>
<option value="20">DAIHATSU</option>
<option value="21">DAIMLER</option>
<option value="22">DATSUN</option>
<option value="23">DODGE</option>
<option value="24">DYNA</option>
<option value="25">FERRARI</option>
<option value="26">FIAT</option>
<option value="27">FORD</option>
<option value="28">FOTON</option>
<option value="29">GREELY</option>
<option value="30">GMC</option>
<option value="31">GREAT WALL</option>
<option value="32">HAGLER</option>
<option value="33">HINO</option>
<option value="34">HOLDEN</option>
<option value="35">HONDA</option>
<option value="36">HUMMER</option>
<option value="37">HYUNDAI</option>
<option value="38">INFINITI</option>
<option value="39">ISUZU</option>
<option value="40">JAGUAR</option>
<option value="41">JEEP</option>
<option value="42">KIA</option>
<option value="43">KTM</option>
<option value="44">LAMBORGHINI</option>
<option value="45">LAND ROVER</option>
<option value="46">LEXUS</option>
<option value="47">LIGIER</option>
<option value="48">LOTUS</option>
<option value="49">MASERATI</option>
<option value="50">MAYBACH</option>
<option value="51">MAZDA</option>
<option value="52">MCLAREN</option>
<option value="53">MERCEDES-BEN</option>
<option value="54">MINI</option>
<option value="55">MITSUBISHI</option>
<option value="56">MORGAN</option>
<option value="57">NISSAN</option>
<option value="58">OPEL</option>
<option value="59">PEUGEOT</option>
<option value="60">PORSCHE</option>
<option value="61">PROTON</option>
<option value="62">RANGE ROVER</option>
<option value="63">RENAULT</option>
<option value="64">ROLLS-ROYCE</option>
<option value="65">SAAB</option>
<option value="66">SKODA</option>
<option value="67">SMART</option>
<option value="68">SSANGYONG</option>
<option value="69">SUBARU</option>
<option value="70">SUNBEAM</option>
<option value="71">SUZUKI</option>
<option value="72">TATA</option>
<option value="73">TIMOR</option>
<option value="74">TOYOTA</option>
<option value="75">TRIUMPH</option>
<option value="76">VAUXHALL</option>
<option value="77">VOLKSWAGEN</option>
<option value="78">VOLVO</option>
<option value="79">WRANGLER</option>
</select></div>
JQuery:
$('select[name="brand"]').change(function(){
var brand = $("select[name='brand']").val();
alert(brand);
$.ajax({
type: "POST",
url: '<?php echo site_url("ajax_data/getmodel"); ?>',
dataType: 'json',
data: { vehicle_class : '', vehicle_brand : brand },
success: function(data) {
// Clear all options from vehicle class select
$('select[name="model"] option').remove();
// Fill vehicle class select
$.each(data, function(i, j){
var row = "<option value=\"" + j.model_id + "\">" + j.model_name + "</option>";
$(row).appendTo('select[name="model"]');
});
}
});
});
What is wrong with my code actually? Thank you.
I've just put your code in to a text file (named test.html)...
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<div id="label"><label>Merk</label></div><div id="pilihan"><select name="brand">
<option value="0">PILIH SATU</option>
<option value="1">ACURA</option>
<option value="2">ALFA ROMEO</option>
<option value="3">ASTON MARTIN</option>
: : :
<option value="77">VOLKSWAGEN</option>
<option value="78">VOLVO</option>
<option value="79">WRANGLER</option>
<script type="text/javascript">
$('select[name="brand"]').change(function(){
var brand = $("select[name='brand']").val();
alert( brand );
});
</script>
</body>
</html>
And the code works, perfectly in FireFox, Chrome and IE8.
Also, my mate says salam sejahtera. :o)
You're selecting with select[name=brand], which means you're trying to access
<select value="THIS_IS_WHAT_YOU_ARE_SELECTING">
but you want the selected option, so use
$('select[name=brand] option:selected').val();
I have this code in html -
<select name="uyear">
<option value="0">YEAR</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
</select>
Now i have certain values stored in DB i have to fetch the value from the DB and then show the stored year as selected BUT i cannot write this year drop-down list in php. Now how can i show selected value in the above drop-down WITHOUT writing it in php code??
EDIT : its just one drop down that i have shown here..i have huge numbers of drop down written in html and if i go to change them in php then it will take 3-4 days as there r n numbers of drop down on this page. Thats why i need a solution with which i neednot change the select tag ino php code ans still can show selected as per DB value.
Have PHP write at another place:
<body onload="document.getElementsByName('uyear')[0].selectedIndex=$myDearIndex">
If PHP is out, you'll have to do something in JavaScript... and you may need to do a value-search to select the correct index. I submit that it may be as much of a pain doing a function and then scriptlet for each select as it would be just re-writing your select output loops in PHP.
Untested:
<body onload="setDefaultSelections()">
<script>
function setDefaultSelection(selectName, default) {
var select = document.getElementsByName(selectName)[0];
for (i = 0; i < select.length; i++) {
if (select[i].value == default) {
select.selectedIndex = i;
break;
}
}
}
function setDefaultSelections() {
setDefaultSelection('uyear', '<? $uyear ?>');
setDefaultSelection('ucountry', '<? $country ?>');
...
}
</script>
hello all im back with another question on my project. i keep getting stuck for some reason! i only started using AJAX today so i hope you will forgive my ignorance! okay first of all i have a type button and when i click on it i want it to return a number (which is the amount of a particular item the customer wants to purchase) and the name of a item. the number is selected from a dropdownlist and the name of the book is got from a input type=" hidden". to get the number from the dropdown list to php i want to use AJAX which i have set up as a method in the header of my html page. the code for this method is shown below at the moment im trying to use ajax to return the number of the item to this same php page. here is the method.
function ajax_post(myform)
{
var hr = new XMLHttpRequest();
var url = "islandshop.php";
var index = myform.quantity1.selectedIndex;
var value = document.getElementById("quantity1").options[index].value;
var variable = "value="+value;
hr.open("post", url, true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("status").innerHTML = return_data;
}
}
hr.send(variable);
document.getElementById("status").innerHTML = "processing data";
}
next is where when i press the button i want just the number from the dropdown list returned to me in php. but when i clcik on the button which is my add to cart button it returns the whole page "islandshop.php" to me. but with the value at the end of the page which is not all bad at least it is returning the value. here is my form where i call the ajax_post() method with my button.
<form method="post" action="" name="form1">
<span style="color:#000"> <label for="quantity">Quantity:</label></span>
<select name="quantity1" id="quantity1" onchange="">
<option value="1" selected>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>
<option value="12">12</option>
<option value="13">13</option><option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option><option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option><option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option><option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option><option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option><option value="29">29</option>
<option value="30">30</option>
</select>
<input type="hidden" name="book1" value="cape clear island: its peopleand landscape" />
<input type="button" value="Add To Cart" name="submit1" onclick="javascript:ajax_post(this.form)"></button>
</form>
which to me seems fine. and the last part is just php tags at the end of the islandshop.php page where i try and print the value and get a copy of the whole page back. so essentially i have my page shown twice in the browser. but with the value in the second version of the page.
<?php
if(isset($_SESSION['username']))
{
echo 'Thank you you selected '. $_POST['value'];
}
?>
i think i know why im getting the whole page back when i press the button as i have the hr.open() url as this page "islandshop.php. i read something about this and it said something about sending the values to the browser and then the browser sending the variable back to a .php page which would redirect them to the original page but it wasnt explained very well. so really my main goal is to just get the value from the dropdown list back to me from the server in php form so i can use the value to do stuff on this page! thanks again for the help hopefully i wont have to post so many questions after i figure this one out. even if anyone can direct me to a good book or article on AJAX i would be delighted! cheers
If you are posting back to the same page then you can do a conditional check to see if the $_POST['value'] is set or not. If it is then do an echo, if not then display the html.
<?php
if( isset($_SESSION['username']) && isset( $_POST['value'] ) )
{
echo 'Thank you you selected '. $_POST['value'];
}
else
{
?>
<form method="post" action="" name="form1">
<span style="color:#000">
<label for="quantity">Quantity:</label></span>
<select name="quantity1" id="quantity1" onchange="">
<option value="1" selected>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>
<option value="12">12</option>
<option value="13">13</option><option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option><option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option><option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option><option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option><option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option><option value="29">29</option>
<option value="30">30</option>
</select>
<input type="hidden" name="book1" value="cape clear island: its peopleand landscape" />
<input type="button" value="Add To Cart" name="submit1" onclick="javascript:ajax_post(this.form)"></button>
</form>
<?php } ?>
I strongly advise you to take a look at the jQuery: http://jquery.com/