3

我需要在单击按钮时复制一组输入字段；根据需要多次。

此功能与我们在 LIferay 中的功能相同：

转到“控制面板-> 用户”，单击任何用户。

在页面右侧，在识别下；点击“地址、电话号码”。

单击加号（添加按钮）复制输入字段集。

这是我为我的要求所做的代码。

输入框代码：

<input class="date-pick" readonly="readonly" id="<portlet:namespace/>fromDate1"   type="text" onchange="showDate()"

     name="<portlet:namespace/>fromDate1" value="" />" >

使用日期值的javascript：

function showDate()
  {
   alert(document.getElementById("<portlet:namespace/>fromDate1"));
  }

将日期选择器与上述文本框绑定的 jQuery 函数：

jQuery(function(){
  jQuery('.date-pick').datepicker({autoFocusNextInput: true});
});

Liferay.Autofields 函数用于创建重复的表单字段行：

jQuery(
  function () {
        new Liferay.AutoFields(
                    {
                          container: '#<portlet:namespace />webFields',
                          baseRows: '#<portlet:namespace />webFields > .lfr-form-row',
                          fieldIndexes: '<portlet:namespace />formFieldsIndexes',
                          onAdd: function(newField) {
                                      alert('This field got added.');
                                      jQuery('.date-pick').datepicker({autoFocusNextInput: true});
                                },

                          onRemove: function() {
                                      alert('The last field was removed.');
                                }
                    }
        );
  }

);

对于原始输入字段集，日期选择器工作正常；但是对于单击加号（添加按钮）后生成的输入字段集，日期选择器不起作用。

此外，由于输入字段的名称会动态更改，因此我在使用输入字段的值时遇到了问题（请参阅 javascript 函数 showDate()）。

有没有人在这方面工作或有任何想法；那么请帮忙

4

2 回答 2

1

Got it Fixed. Thanks again to this thread -

Why does jQuery UI's datepicker break with a dynamic DOM?

于 2011-06-15T08:04:08.300 回答
0

It appears that the AutoFields plugin is not compatible with the DatePicker plugin. The issue lies in that the JavaScript events responsible for the DatePicker widget are not getting copied correctly on the replicated fields.

I suppose you could fix that in the "onAdd" event, but I am at a loss for how you would implement that piece.

于 2011-06-14T17:02:52.937 回答