Question

我试图为输入文本字段分配一个datepicker值，但是因为它在一个模态中我遇到了麻烦。它甚至可能是因为我不知道要引入哪些脚本和样式表。这里是代码

// A simple callback implementation.
function pickerCallback(data) {
  if (data.action == google.picker.Action.PICKED) {
    var fileId = data.docs[0].id;
    $('#\\#myModal').modal('show');
 }
}

$(date).ready(function(){
    var date_input=$('input[name="date"]'); //our date input has the name "date"
    var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
    var options={
      format: 'mm/dd/yyyy',
      container: container,
      todayHighlight: true,
      autoclose: true,
    };
    date_input.datepicker(options);
  })


</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js">    </script>
  </head>

  <body>

<div id="result"></div>
<!-- The Google API Loader script. -->
<script type="text/javascript" src="https://apis.google.com/js/api.js?onload=loadPicker"></script>
<div class="modal fade" id="#myModal">
  <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">Set Metadata</h4>
  </div>
  <div class="modal-body">
     Department ID: <select id = "drop" style="margin-bottom: 0.25cm;">
    <option value="#001">#001---Law</option>
    <option value="#002">#002---Sales</option>
    <option value="#003">#003---Tech</option>
  </select>
    <div style="overflow: hidden; padding-right: .5em;">
        Date:<input type="text" id = "date" style="margin-left: 60px; margin-bottom: 0.25cm;" placeholder="MM/DD/YYY"/>
    </div>
    Additional Tag: <input type="text" id="metadata" style="overflow: hidden; padding-right: .5em; margin-bottom: 0.25cm;" onkeydown="if(event.keyCode == 13) document.getElementById('set_tag').click();"/>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary" onclick="setMeta(document.getElementById('drop').value)">Save changes</button>
  </div>
</div>
<!-- /.modal-content -->
  </div>
  <!-- /.modal-dialog -->
</div>
<!-- /.modal -->
<!--End Modal-->
     </body>
   </html>

我只是想要它，以便当顶部的if语句出现时，会出现模态对话框（它会出现），但它会在文本框中显示日期选择器。如果有人知道一个很好的解决方案。

在Bootstrap模式中使用DatePicker

0 个答案: