jqGrid日期选择器自动弹出

Question

我正在使用基本功能的PHP jqGrid，并且没有附加任何javascript。弹出框首次打开时，一切正常。

当我再次编辑时，日期选择器每次都会自动弹出。这是一个错误？

我的代码非常基本，我不知道它可能是什么。

这里是我的代码：

<?php 



// Connection to the server 
$conn = new PDO(DB_DSN,DB_USER,DB_PASSWORD); 
// Tell the db that we use utf-8 
$conn->query("SET NAMES utf8"); 

// Create the jqGrid instance 
$grid = new jqGridRender($conn); 

$grid->SelectCommand = 'SELECT id, date, description, goal, 
    type FROM events'; 

$grid->table = 'events'; 
$grid->setPrimaryKeyId('id'); 
$grid->serialKey = false; 
// Set output format to json 
$grid->dataType = 'json'; 
// Let the grid create the model 
$Model = array (
    array ("name" => "date"), 
    array ("name" => "description"), 
    array ("name" => "goal"), 
    array ("name" => "type") 

); 
$grid->setColModel($Model); 

// Set the url from where we obtain the data 
$grid->setUrl('event-grid.php'); 
// Set some grid options 
$grid->setGridOptions(array(
    "caption"=>"Events", 
    "rowNum"=> 5, 
    "rowList"=>array(5,10,20,30), 
    "sortname"=>"date", 
    "width" => 400, 
    "height" => 113, 
    "hoverrows" => true, 
    "viewrecords" => false, 
    "sortable"=>true 
)); 

///*** Use this to define both server and user date params for date picker and field please remeber that the grid CRUD interactions are separate from jqueryui Datepicker you must integrate them together ***/ 
$grid->setUserTime("h:i:s"); 
$grid->setUserDate('Y M d'); 
$grid->setDbDate('Y-m-d'); 

$grid->setColProperty("date", array(
     "label"=>"Event Date", 
     "width"=>80, 
     "align"=>"center", 
     "fixed"=>true, 
     "formatter"=>"date", 
     "formatoptions"=>array(
      "srcformat"=>"Y-m-d", 
      "newformat"=>"Y M d") 

// CODE BLOCK BELOW TO USE JS DATE PICKER 
// 
//  "editoptions"=>array("dataInit"=> 
//    "js:function($){setTimeout(function(){ 
//     jQuery($).datepicker({dateFormat:'yy-mm-dd', 
//     changeMonth: true, 
//     showOn: 'both', 
//     buttonImage: 'img/83-calendar.png', 
//     buttonImageOnly: true, 
//     minDate: '-5Y', 
//     maxDate: '+5Y'}); 
//     jQuery('.ui-datepicker').css({'zIndex':'1200','font-size':'75%'});},200);}") 


    )); 

// Set the datepicker on OrderDate field. Note that the script automatically 
// converts the user date set in the jqGrid 
$grid->setDatepicker('date', array("buttonIcon"=>true), true, false); 
$grid->datearray = array('date'); 


// Enable navigator 
$grid->navigator = true; 
// Enable only deleting 
$grid->setNavOptions('navigator', array(
    "excel"=>false, 
    "add"=>true, 
    "edit"=>true, 
    "del"=>true, 
    "view"=>false, 
    "search"=>false, 
    "csv" => true 
    )); 

$grid->setNavOptions('add', array(
    "closeAfterAdd"=>true, 
    "reloadAfterSubmit"=>true 
)); 

$grid->setNavOptions('edit', array(
    "closeAfterEdit"=>true, 
    "reloadAfterSubmit"=>true 
)); 

$grid->csvsep=","; 

//$grid->debug = true; 

//Enjoy 
$grid->renderGrid('#event-grid','#event-pager',true, null, null, true,true); 
$conn = null; 



?> 

的代码是非常简单的，正是因为看到了演示。

$conn = new PDO(DB_DSN,DB_USER,DB_PASSWORD); 
// Tell the db that we use utf-8 
$conn->query("SET NAMES utf8"); 

// Create the jqGrid instance 
$grid = new jqGridRender($conn); 
// Write the SQL Query 
$grid->SelectCommand = 'SELECT EmployeeID, FirstName, LastName, BirthDate FROM employees'; 
// Set the table to where you add the data 
$grid->table = 'employees'; 
// Set output format to json 
$grid->dataType = 'json'; 
// Let the grid create the model 
$grid->setColModel(); 
// Set the url from where we obtain the data 
$grid->setUrl('grid.php'); 
$grid->setColProperty('EmployeeID', array("editable"=>false)); 
/* 
$grid->setColProperty('BirthDate', 
     array("formatter"=>"date", 
      "formatoptions"=>array("srcformat"=>"Y-m-d H:i:s", "newformat"=>"Y-m-d"), 
      "editoptions"=>array("dataInit"=> 
       "js:function(elm){setTimeout(function(){ 
        jQuery(elm).datepicker({dateFormat:'yy-mm-dd'}); 
        jQuery('.ui-datepicker').css({'zIndex':'1200','font-size':'75%'});},100);}") 
      )); 
* 
*/ 
$grid->setColProperty("BirthDate", array( 
    "formatter"=>"date", 
    "formatoptions"=>array("srcformat"=>"Y-m-d H:i:s","newformat"=>"Y M d") 
    ) 
); 

// Date options to edit 
$grid->setUserDate("Y M d"); 
$grid->setUserTime("Y M d"); 

$grid->setDatepicker('BirthDate'); 

$grid->datearray = array("BirthDate"); 

// Set some grid options 
$grid->setGridOptions(array( 
    "rowNum"=>10, 
    "scrollrows"=>true, 
    "rowList"=>array(10,20,30), 
    "sortname"=>"EmployeeID" 
)); 
$grid->navigator= true; 
$grid->setNavOptions('navigator', array("excel"=>false,"add"=>true,"edit"=>true,"del"=>false,"view"=>false, "search"=>false)); 
// Close the dialog after editing 
$grid->setNavOptions('edit',array("height"=>150,"dataheight"=>'auto', "closeAfterEdit"=>true)); 
$grid->setNavOptions('add',array("height"=>150,"dataheight"=>'auto',"closeAfterEdit"=>true)); 

// Enjoy 
$grid->renderGrid('#grid','#pager',true, null, null, true,true); 
$conn = null; 

Answer 1

原因是一些因素的组合。您在编辑表单的第一个字段上设置了日期选择器，您可以使用datepicker的选项在编辑表单的第一个控件上打开on focus和jqGrid set focus。

有很多方法来解决问题，但如果编辑表格的第一开口的行为是你OK，那么你可以尝试只是为了使用editGridRowrecreateForm: true选项。