Display and hide the date popup when i use the tab key Help Required

Question

0.00/5 (No votes)

See more:

I have a calender popup window in textbox1 and textbox2. Then when i click the textbox1 the calender get open and after select the date it ll get hide.but i need the same function in tab key ,if i click the tab key calender in textbox1 get open and when i select the date the calender popup ll get close and open the textbox2 calender ans same lik textbox1. Pls help me

Thanks in advance

Posted 15-Dec-11 0:30am

priya from Madras

Updated 18-Dec-11 19:51pm

v3

Add a Solution

4 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Bojjaiah · Accepted Answer · 2011-12-15T00:44:00

Hi priya,

you can do like this

XML

<td>
                                               <asp:TextBox ID="txtclosedt" runat="server" Style="text-align: right;"
                                                   ClientIDMode="Static"></asp:TextBox>
                                           </td>
                                           <td>
                                               <asp:CalendarExtender ID="txtShipmentDate_CalendarExtender" runat="server" TargetControlID="txtclosedt"
                                                   Enabled="True">
                                               </asp:CalendarExtender>  </td>

it will work fine

this ajax extender calender

koolprasad2003 · Accepted Answer · 2011-12-15T00:49:00

Solution 2

you need to take help of Javascript.
check if TAB key is pressed in Textbox if yes then show popup. here is function

JavaScript

function onTab()
{
  if(event.keyCode == 9) //check for tab key
  {
    //show popup window.open() ot alert()
  }
}

call above function on Textbox keypress event

Posted 15-Dec-11 0:49am

koolprasad2003

Updated 15-Dec-11 0:50am

v2

Comments

priya from Madras 15-Dec-11 7:14am

nothing happened

Balakrishnan Dhinakaran · Accepted Answer · 2011-12-18T22:30:00

use j query date picker

http://jqueryui.com/demos/datepicker/#default[^]

Eq:

XML

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Datepicker - Default functionality</title>
    <link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css">
    <script src="http://jqueryui.com/jquery-1.6.2.js"></script>
    <script src="http://jqueryui.com/ui/jquery.ui.core.js"></script>
    <script src="http://jqueryui.com/ui/jquery.ui.widget.js"></script>
    <script src="http://jqueryui.com/ui/jquery.ui.datepicker.js"></script>
    <link rel="stylesheet" href="http://jqueryui.com/demos/demos.css">
    <script>
    $(function() {
        $( "#datepicker" ).datepicker();
    });
    </script>
</head>
<body>

<div class="demo">

<p>Date: <input type="text" id="datepicker"></p>

</div><!-- End demo -->



<div class="demo-description">
<p>The datepicker is tied to a standard form input field.  Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay.  Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If a date is chosen, feedback is shown as the input's value.</p>
</div><!-- End demo-description -->

</body>
</html>

priya from Madras · Accepted Answer · 2011-12-18T21:19:00

Solution 3

Pls Let me know the solution , Its Urgent

Posted 18-Dec-11 21:19pm

priya from Madras

Updated 18-Dec-11 21:22pm

v3

Comments

Balakrishnan Dhinakaran 19-Dec-11 3:41am

display your code

Display and hide the date popup when i use the tab key Help Required

4 solutions

Solution 1

Solution 2

Solution 4

Solution 3

Add your solution here

Preview 0