jQuery-克隆日期选择器字段
jQuery - Cloning a datepicker field
我正试图克隆一个表行,并让一个日期选择器框处理所有行。目前,第一个是有效的,但不是后来的盒子。
有人能提供一些建议吗?非常感谢您的帮助!
这是代码:
HTML
<link rel="stylesheet" type="text/css" href="http://brenda.upreach.org.uk/plugins/jquery.datepick.package-4.1.0/redmond.datepick.css">
<script type="text/javascript" src="http://brenda.upreach.org.uk/plugins/jquery.datepick.package-4.1.0/jquery.datepick.js"> </script>
<div class="clone_Associate">
<input type="text" name="DATE_SET[]" class="datepick" value="04/12/2013">
</div>
<div class="placer_Associate"></div>
<a href="#" class="clone_trigger_Associate">Clone a new datebox!</a>
jQuery
$(function() {
$('.datepick').datepick({
dateFormat: 'dd/mm/yyyy', showTrigger: '#calImg'});
});
$(document).ready(function(){
$(".clone_trigger_Associate").click(function () {
var total = $('[name^="UPDATE_METHOD"]').length;
var index = Math.round(total / 2);
$('.clone_Associate').last().clone().insertBefore(".placer_Associate");
$('input.cl:last').val('');
$('.clone_Associate').last().find("input[type='checkbox']").prop("name","UPDATE_METHOD["+index+"][]")
// Date pick element
$('.datepick').datepick({
dateFormat: 'dd/mm/yyyy', showTrigger: '#calImg'}
);
event.preventDefault();
});
});
一个jsfiddle在这里:http://jsfiddle.net/dalepotter/aSG6e/
演示:http://jsfiddle.net/aSG6e/15/
$(function() {
var options = {dateFormat: 'dd/mm/yy'}
$('.datepick').datepicker(options);
$(".clone_trigger_Associate").click(function (e) {
e.preventDefault();
var $newInput = $('.datepick:last').clone(true).removeAttr('id');
$(this).before($newInput);
$newInput.datepicker('destroy').datepicker(options);
});
});
更改此代码;
$('.clone_Associate').last().clone().insertBefore(".placer_Associate");
与此相关;
var newDate = '<div class="clone_Associate"><input type="text" name="DATE_SET[]" class="datepick" value="04/12/2013"></div>';
$('.clone_Associate:last').after(newDate);
相关文章:
- jQuery-克隆的日期选择器日历未显示在日期选择器字段旁边
- 在Meteor中加载带有采集数据的选择输入字段
- jQuery-克隆日期选择器字段
- 添加带有选择选项字段的表单
- 需要基于下拉选择的字段
- 自动选择输入字段
- 选择其他字段元素时如何重置选择选项下拉列表
- 当所有表单具有相同的名称和 id 时,选择焦点字段的表单
- 焦点将放在jquery中的验证日期选择器字段上
- jQuery - 添加第二个变量以选择选项字段
- 在更改时验证引导日期选取器字段
- 语义 UI 搜索 - 筛选器字段
- jQuery清除日期选择器字段中的值,该值与未选中的复选框相关联
- WordPress ContactForm7日期选择器字段-禁用/阻止特定日期
- 仅获取输入类型文本,而不获取选择器字段
- Sencha Touch:点击按钮显示日期选择器字段
- 在SharePoint Designer 2010中隐藏人员选择器字段
- 如何在文本框中显示一个值,点击"done"在sencha触摸中选择器字段中的按钮
- 单选按钮选择更改日期选择器字段的值
- 已设置值的链接日期选择器字段