Monday, August 8, 2011

YearPicker with JQuery

Here's my first attempt to use JQUERY in my work. I created a year-picker. My script shows up the drop down box with years after 1993 and redirects to appropriate page on change.

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<div id="adr1">
<table cellpadding="10" cellspacing="0" border="0">
<tr>
<td><img src="sample.jpg" alt="Sample1" /></td>
<td><h2>Sample2</h2><br /><br />
<select name="yearpicker" id="yearpicker" onchange="location = 'adr_' + this.options[this.selectedIndex].value + '.htm';"></select>
<script type="text/javascript">
for (i = new Date().getFullYear(); i > 1993; i--) { $('#yearpicker').append($('<option />').val(i).html(i)); }
</script>
</td>
</tr>
</table>
</div>
</asp:Content>

No comments:

Post a Comment