[英]My date can not be updated if I have a date input and modal on the same input field
我有一个动态创建的日期输入字段。 我现在希望能够在选择时捕获更多信息(无论是否更改)。 为此,我使用了引导模式(引导 3)。 问题是当显示模式时无法更新日期。 显示日历; 但是,选择时不会将日期填充到输入字段中,并且无法手动输入日期。
动态创建的日期输入字段:
HTML5:
<div class="col-lg-2 col-md-3 col-sm-4 col-xs-6 padding-0">
<label id="labelAssist1" class="control-label control-label-center col-lg-12 col-md-12 col-sm-12 col-xs-12"></label>
<div class="input-group col-lg-12 col-md-12 col-sm-12 col-xs-12" id="datepicker29">
<!-- jQuery populated -->
</div>
</div>
javascript / jQuery:
var lineItems = '';
var dateCompleted = moment(obj.cadTaskCompletionDate).format("DD/MM/YYYY");
lineItems += '<input type="text" class="form-control dateChange" id="'+obj.adId+'" name="assist" value="' + dateCompleted + '" placeholder="DD/MM/YYYY" onclick="specificFunction(this.id, this.name)" onchange="myFunction(this.id, this.value, this.name)" style="background-color: #39CCCC;">';
lineItems += '<span class="input-group-addon">';
lineItems += '<span class="glyphicon glyphicon-calendar"></span>';
lineItems += '</span>';
$("#datepicker29").append(lineItems);
日期变更:
$(document).on('click', '.dateChange', function () {
$(this).datepicker({
format: 'dd/mm/yyyy',
autoclose: true,
todayHighlight: true,
}).datepicker( "show" );
});
模态 HTML:
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel"></h4>
</div>
<div class="modal-body">
<!-- Summernote input area -->
<div class="row">
<div class="container-fluid">
<div id='ymSpecific' class="row">
<div class="container-fluid">
<div class="input-group">
<label for="ymSpecificLine" id="labelText" class="text-left col-lg-12 col-md-12 col-sm-12 col-xs-12 col-form-label"></label>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-left">
<textarea class="summernote col-lg-12 col-md-12 col-sm-12 col-xs-12" id="ymSpecificLine" name="ymSpecificLine" rows="20"></textarea>
</div>
</div>
</div><!-- /container -->
</div><!-- /row -->
</div><!-- /container -->
</div><!-- /row -->
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="modalClearBtn" class="btn btn-primary">Clear</button>
<button type="button" id="modalSaveBtn" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
点击模态:
$(document).on('click', 'input[name="assist"]', function () {
//Only for name is 'assist' other names are 'participate' and 'lead'
sessionStorage.setItem('ssADID', this.id);
$("#ymSpecificLine").summernote('reset');
$("#myModal").modal('show');
$('#myModalLabel').text("Assist Details");
$('#labelText').text("You may enter specific information relating to your Assist:");
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.