1

我正在尝试使用 Bootstrap 3 datetimepicker。但是字形日历没有打开。看到这个小提琴：http: //jsfiddle.net/vqsss5fx/

$(function () {

    var data = [
        { rank: 1, company: 'Exxon Mobil', DatePicker: '04/04/1990 00:00', revenues: '339938.0', profits: '36130.0' },
        { rank: 2, company: 'Wal-Mart Stores', DatePicker: '05/03/2014 00:00', revenues: '315654.0', profits: '11231.0' },
        
    ];
    var obj = { 
      
        title: "ParamQuery Grid with JSON Data",      
        scrollModel:{autoFit:true, theme:true}
    };
    obj.colModel = [
        { title: "Rank", width: 100, dataType: "integer", dataIndx: "rank" },
        { title: "Company", width: 200, dataType: "string", dataIndx: "company" },
		{ title: "DatePicker", width: 200, dataType: "string", dataIndx: "date",editable:false, 
		 render : function(){
		  var date = '<div class="form-group" style="width:150px;margin-left:50px;text-align:center"><div class="input-group date" id="datetimepicker123"><input type="text" value="04/05/2012 00:00" class="form-control"><span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span></div></div>';
		                                                                                                                                                                      
		  return date;
		 }
		 },
        { title: "Revenues ($ millions)", width: 150, dataType: "float", align: "right", dataIndx: "revenues" },
      
    ];
	
	 $('body').on('mouseover','.input-group',function() {		
	 
		$("#datetimepicker123").datetimepicker();
	 });
	
    obj.dataModel = { data: data };
	
    $("#grid_json").pqGrid(obj);
	
});
 	 
<div id="grid_json" style="margin:100px;"></div>

4

1 回答 1

2

我看到三个问题：

  • 您有多个具有相同 ID (#datetimepicker123) 的 HTML 元素：请避免使用它！
  • 而不是$("#datetimepicker123").datetimepicker();您应该使用$(".input-group.date").datetimepicker();为每个日期输入添加时间选择器。

  • 时间选择器出现，但它被 HTML 单元格截断（您可以看到输入字段下方的箭头）。可能需要一些 CSS 自定义：

    .pq-grid-cell{
    overflow:visible;
}

结果：http: //jsfiddle.net/vqsss5fx/3/

于 2015-03-30T11:27:16.407 回答