繁体   English   中英

如果我在同一个输入字段上有日期输入和模式,我的日期无法更新

[英]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">&times;</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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM