jquery date picker link to dropdown

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" href="css/jquery.datepick.css" type="text/css" />
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js/jquery.datepick.js"></script>

<script type = "text/javascript">

function updateSelected(dates) {
	$('#selectedMonth').val(dates.length ? dates[0].getMonth() + 1 : ' ');
	$('#selectedDay').val(dates.length ? dates[0].getDate() : ' ');
	$('#selectedYear').val(dates.length ? dates[0].getFullYear() : ' ');
	checkLinkedDays();
}

$('#selectedPicker').datepick( {
							  minDate: '01/01/2001', maxDate: '12/31/2010',
							  alignment: 'bottomRight', onSelect: updateSelected,
							  showTrigger: '#calImg'});

$('#selectedMonth, #selectedDay, #selectedYear').change(function() {
$('#selectedPicker').datepick('setDate', new Date ($('#selectedYear').val(), $('#selectedMonth').val() - 1, $('#selectedDay').val()));});

</script> 

</head>

<body>
<table width="200" border="1">
  <tr>
    <td>
        <select name="selectedMonth" id="selecetedMonth">
          <option value="Jan">Jan</option>
          <option value="Feb">Feb</option>
          <option value="Mar">Mar</option>
          <option value="Apr">Apr</option>
          <option value="May">May</option>
          <option value="Jun">Jun</option>
          <option value="Jul">Jul</option>
          <option value="Aug">Aug</option>
          <option value="Sep">Sep</option>
          <option value="Oct">Oct</option>
          <option value="Nov">Nov</option>
          <option value="Dec">Dec</option>
    </select></td>
    <td>
        <select name="selectedDay" id="selectedDay">
          <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>
          <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>
          <option value="31">31</option>
        </select>
    </td>
    <td>
        <select name="selectedYear" id="selectedYear">
          <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>
          <option value="2010">2010</option>
        </select>
    </td>
    <td><img id="calImg" src="images/calendar.gif" width="16" height="15" alt="Popup" class="trigger" /></td>
  </tr>
</table>
</body>
</html>

So basically we want to connect or rather link the date picker to the dropdown menus (Month/Day/Year). Could anyone help us make this work, we're new about jquery :) thanks.

ekseks

Junior Poster in Training

61 posts since May 2010

Reputation Points: 8

Solved Threads: 0

1 Year Ago

it's like dropdown 1: Month dropdown 2: Day dropdown 3: Year then DATEPICKER... as i change the values of the boxes it also affects the date of the datepicker vice-versa as i change the date on my date picker the dropdown values also automatically changes

ekseks

Junior Poster in Training

61 posts since May 2010

Reputation Points: 8

Solved Threads: 0

1 Year Ago

pls me and my team need this badly can someone help?

ekseks

Junior Poster in Training

61 posts since May 2010

Reputation Points: 8

Solved Threads: 0

1 Year Ago

can someone please help us we need this for a project within 36 hours before submittion thanks :(

ekseks

Junior Poster in Training

61 posts since May 2010

Reputation Points: 8

Solved Threads: 0

1 Year Ago

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="jquery.datepick.js"></script>

<style type="text/css">@import "jquery.datepick.css";</style>

<script type="text/javascript">

//Update three select controls to match a datepicker selection
function updateSelected(dates) {
	$('#selectedMonth').val(dates.length ? dates[0].getMonth() + 1 : ' ');
	$('#selectedDay').val(dates.length ? dates[0].getDate() : ' ');
	$('#selectedYear').val(dates.length ? dates[0].getFullYear() : ' ');
	checkLinkedDays();
}

$('#selectedPicker').datepick( {
							  minDate: '01/01/2001', maxDate: '12/31/2010',
							  alignment: 'bottomRight', onSelect: updateSelected,
							  showTrigger: '#calImg'});

//Update datepicker from three select controls
$('#selectedMonth, #selectedDay, #selectedYear').change(function() {
$('#selectedPicker').datepick('setDate', new Date ($('#selectedYear').val(), $('#selectedMonth').val() - 1, $('#selectedDay').val()));});

</script>

<title>LOL</title>
</head>

<body>

<select id="selectedMonth">
	<option value="1">Jan</option>
    <option value="2">Feb</option>
    <option value="3">Mar</option>
    <option value="4">Apr</option>
    <option value="5">May</option>
    <option value="6">Jun</option>
    <option value="7">Jul</option>
    <option value="8">Aug</option>
    <option value="9">Sep</option>
    <option value="10">Oct</option>
    <option value="11">Nov</option>
    <option value="12">Dev</option>
    </select>
<select id="selectedDay">
	<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>
    <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="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>
    <option value="31">31</option>
    </select>
<select id="selectedYear">
	<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>
    <option value="2010">2010</option>
    </select>
    <input id="selectedPicker" class="hasDatepick" type="hidden" size="10 value="01/01/2001">
    <img class="trigger datepick-trigger" alt="Popup" src="images/icon_cal.png">

</body>
</html>

we are now on this code are we doing anything wrong we can't seem to make it work thanks for your replies

ekseks

Junior Poster in Training

61 posts since May 2010

Reputation Points: 8

Solved Threads: 0

This question has already been solved

You