jquery-ui 日期选择器问题答案

【问题标题】：jquery-ui datepicker problemjquery-ui 日期选择器问题
【发布时间】：2011-10-28 07:40:31
【问题描述】：

嘿，伙计们，我有两个 div - id="form1" 是内联的，另一个 id="form2" 通过 ajax 获取其内容（在同一页面上提到了 div 标签）。

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

现在，我使用了以下日期选择器代码-

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

现在，我已将 datepicker id 应用于 form1 中的一个字段，并且效果很好。问题在于第二种形式。第二种形式由循环生成，我使用以下逻辑将 id datepicker1 应用于它-

<? 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; ?>

现在，id datepicker1 已完美应用于所需字段，但 jquery datepicker 弹出窗口未按预期出现。

解决办法是什么？？

【问题讨论】：

出于好奇，你为什么使用 div 作为表单元素的包装器（
很好）？
只是因为某个结构问题。反正我没有使用任何表单属性，所以没关系。
您的循环是否使用id="datepicker1" 生成多个输入？
不，它没有..我检查了这种可能性..

标签： php jquery jquery-ui jquery-plugins datepicker

【解决方案1】：

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

【讨论】：

【解决方案2】：

id="form2" 通过ajax获取其内容

好吧，那是你的问题:)

添加日期选择器功能的 javascript 代码可能在 ajax 事件完成之前执行。尝试在第二个表单的内容加载后为其加载日期选择器。

【讨论】：

例如，在你的jQuery.ajax的回调中。
不，没有帮助...如果有任何帮助，我正在为 form2 使用 ui-dialog（单击编辑按钮时会调用它）。该站点在 codeigniter 中编码...form2 循环在不同的视图文件中..

【解决方案3】：

jquery 函数只在第一次加载 dom 时运行一次。加载 ajax 内容时它不会重新触发。解决此问题的最佳方法是使用附加到父元素的 jquery 委托函数。只需将您想要拥有日期选择器的输入指定为“日期选择器”类（或其他选择它们的方式）。像这样。

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

我假设 'parentID' 是两种表单的某些父元素的 ID。

【讨论】：

我相信它也会起作用......只是我不想指定一个共同的 parentid......