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

ребята, я знаю, что это фиктивный вопрос, но я провел 2 дня в поисках решения, но никогда не достиг, поэтому plz помогите мне … я использую jqgrid .. и столбец с именем «от даты» должен быть все время в editmode .. but the datepicker pops out automatically and i want it to pop out on click on the field .. вот мой код

 <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> 
    
	<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" />
	

	<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",
                        	   editable: true,
                               edittype:"text",
                               editoptions: {
                                   dataInit: function (element) {
                                      $(element).datepicker({       	  
        									format: 'yyyy-mm-dd',
                                      });
                                   },
                                   
                               },
                           },
                           
                            { label: 'Customer ID', name: 'CustomerID', width: 150},
                           { label: 'Ship Name', name: 'ShipName', width: 200},
                           {
                        	   label :'Row Data',
                               name: 'RowData',
                               align : 'center',
                               formatter: function () {
                                   return "<img src='resources/icon.jpg' onclick='OpenDialog(this)' alt='Data Row' />";
                                   width = 15;
                               }
                           },
                       ],
				onSelectRow: editRow, 
				viewrecords: true,
				editurl : "JqGridServlet",
                width: 780,
                height: 200,
                rowNum: 20,
				rowList : [20,30,50],
                rownumbers: true, 
                rownumWidth: 25, 
                multiselect: true,
                pager: "#jqGridPager",
                	loadComplete: function () {
                	    var $this = $(this), ids = $this.jqGrid('getDataIDs'), i;
                	    for (i = 0; i < ids.length; i++) {
                	        $this.jqGrid('editRow', ids[i]);
                	    }
                	   
                	}
            });
            $('#jqGrid').navGrid("#jqGridPager", {
            	edit: false, 
            	add: true, 
            	del: false, 
            	refresh: true, 
            	view: false
            	});
            
        });

а вот скриншот

Введите описание изображения здесь

anyhelp был бы высоко оценен

1 ответ

  1. Я думаю, что это ошибка с выбором даты, вокруг которой будет работать, чтобы добавить это к вашему css.

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

    Или добавьте это в datepicker

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