datepicker всплывает автоматически при загрузке в jqgrid

Question

ребята, я знаю, что это фиктивный вопрос, но я потратил 2 дня на поиск решения, но так и не дошел, так что PLZ помогите мне ... Я использую jqgrid .. и столбец с именем «From Date» требуется, чтобы быть все время в режиме редактирования .. но DatePicker выскакивает автоматически, и я хочу, чтобы выскочить на мыши на поле .. вот мой код

<script type="text/ecmascript" src="https://code.jquery.com/jquery-2.2.3.min.js"></script> 
 
    <!-- We support more than 40 localizations --> 
 
    <script type="text/ecmascript" src="resources/grid.locale-en.js"></script> 
 
    <!-- This is the Javascript file of jqGrid --> 
 
    <script type="text/ecmascript" src="resources/jquery.jqGrid.js"></script> 
 
    <!-- A link to a Boostrap and jqGrid Bootstrap CSS siles--> 
 
    <script type="text/ecmascript" src="resources/bootstrap-datepicker.js"></script> 
 
    
 
\t <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" type="text/css" media="screen" href="resources/ui.jqgrid-bootstrap.css" /> 
 
    <link rel="stylesheet" type="text/css" media="screen" href="resources/bootstrap-datepicker.css" /> 
 
\t 
 

 
\t <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
 
    
 
    $(document).ready(function() { 
 
      $("#jqGrid").jqGrid({ 
 
       data: data.rows, 
 
       //url: "data.json", 
 
       datatype: "local", 
 
       styleUI : "Bootstrap", 
 
       colModel: [ 
 
          { label: 'Order ID', name: 'OrderID', key: true, width: 75, hidden:true },     
 
          { label: 'From Date', name: 'FromDate', width: 150,id: "datepicker", 
 
         \t editable: true, 
 
           edittype:"text", 
 
           editoptions: { 
 
            dataInit: function (element) { 
 
             $(element).datepicker({  \t 
 
     \t \t \t \t \t \t \t \t \t format: 'yyyy-mm-dd', 
 
             }); 
 
            }, 
 
            
 
           }, 
 
          }, 
 
          
 
          { label: 'Customer ID', name: 'CustomerID', width: 150}, 
 
          { label: 'Ship Name', name: 'ShipName', width: 200}, 
 
          { 
 
         \t label :'Row Data', 
 
           name: 'RowData', 
 
           align : 'center', 
 
           formatter: function() { 
 
            return "<img src='resources/icon.jpg' onclick='OpenDialog(this)' alt='Data Row' />"; 
 
            width = 15; 
 
           } 
 
          }, 
 
         ], 
 
\t \t \t \t onSelectRow: editRow, 
 
\t \t \t \t viewrecords: true, 
 
\t \t \t \t editurl : "JqGridServlet", 
 
       width: 780, 
 
       height: 200, 
 
       rowNum: 20, 
 
\t \t \t \t rowList : [20,30,50], 
 
       rownumbers: true, 
 
       rownumWidth: 25, 
 
       multiselect: true, 
 
       pager: "#jqGridPager", 
 
       \t loadComplete: function() { 
 
       \t  var $this = $(this), ids = $this.jqGrid('getDataIDs'), i; 
 
       \t  for (i = 0; i < ids.length; i++) { 
 
       \t   $this.jqGrid('editRow', ids[i]); 
 
       \t  } 
 
       \t  
 
       \t } 
 
      }); 
 
      $('#jqGrid').navGrid("#jqGridPager", { 
 
      \t edit: false, 
 
      \t add: true, 
 
      \t del: false, 
 
      \t refresh: true, 
 
      \t view: false 
 
      \t }); 
 
      
 
     });

и здесь является скриншотом

enter image description here

anyhelp будет высоко оценен

Answer 1

Я думаю, это ошибка с датой подборщика работа вокруг будет добавить это к вашему CSS.

#ui-datepicker-div { display: none; } 

ИЛИ добавить это DatePicker

$(element).datepicker({  
autoOpen: false,   
format: 'yyyy-mm-dd', 
});