2

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

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

我的代码是如此基本，我不知道它还能是什么。

在此处输入图像描述

这是我的代码：

<?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;
4

1 回答 1

2

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

有很多方法可以解决这个问题，但是如果第一次打开编辑表单的行为对您来说是可以的，那么您可以尝试只使用editGridRowrecreateForm: true的选项。

于 2013-01-03T00:09:13.480 回答