jquery-ui datepicker problem

hey guys I have two divs- with id="form1" which is inline and the other with id="form2" which gets its content through ajax(where the div tag is mentioned on the same page).

<div id="form1">
 .
 .form content
 .
 .
</div>
<div id="form2"> //gets content dynamically

Now, I have used the following datepicker code-

    $(function() {
    $( "#datepicker,#datepicker1" ).datepicker({ dateFormat: 'yy-mm-dd' });
开发者_如何学JAVA});

Now, I have applied the datepicker id to a field in form1 and it works perfectly. The problem is in the second form. The second form gets generated by loop and i have used the following logic to apply the id datepicker1 to it-

<? foreach ($list as $key => $value): ?>
    <? $dt='';
    if($key=='date_of_purchase'){

        $dt="datepicker1";
    }?>
        <tr><td><?= $key ?> :</td><td><input id="<?=$dt;?>" type="text" name='<?= $key ?>' size="25" value='<?php echo $value; ?>'/></td></tr>
    <? endforeach; ?>

Now, the id datepicker1 is getting applied perfectly to the required field but the jquery datepicker popup is not coming up as expected.

Whats the solution??

$("#datepicker1").live("click",function() {
    $(this).datepicker({showOn:'focus',dateFormat: 'yy-mm-dd'}).focus();
 });

id="form2" which gets its content through ajax

Well, there's your problem :)

The javascript code that adds the datepicker functionality is probably executed before the ajax event is finished. Try and loading the datepicker for the second form after it's content has loaded.

The jquery function is only running once when the dom is first loaded. It doesn't refire when you load ajax content. The best way to fix this is to use the jquery delegate function attached to a parent element. Just give the inputs that you want to have a datepicker the class of 'datepicker' (or some other way to select them). Something like this.

$('#parentID').delegate('.datepicker', 'focus', function() {
    $(this).datepicker({ dateFormat: 'yy-mm-dd' });
});

I'm assuming that 'parentID' is the ID of some parent element of both forms.