Bind inline ui datepicker to a form field

Bind inline ui datepicker to a form field

Hello,

I am trying (without success so far) to bind an inline datepicker to a html form field. If someone selects a date with the datepicker, then this date should be given to the form field.

Let's take this example:
Inline datepicker "#datepicker", form field "#date1".

  1. <html lang="en">
    <head>
        <title>jQuery UI Datepicker - Display inline</title>
        <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
        <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
        <script type="text/javascript" src="../../ui/ui.core.js"></script>
        <script type="text/javascript" src="../../ui/ui.datepicker.js"></script>
        <link type="text/css" href="../demos.css" rel="stylesheet" />







  2.     <script type="text/javascript">
        $(function() {
            $("#datepicker").datepicker();
        });
        </script>





  3. </head>
    <body>

    Date: <div id="datepicker"></div>

    <input type="hidden" size="10" name="date1"  id="date1"/>

    </body>
    </html>










How can I achieve that form "#date1" gets the date selected by datepicker "#datepicker"?

Perhaps someone can help me? Thanks in advance!