对话框中的jqGrid错误

时间:2013-04-04 06:50:19

标签: jqgrid dialog datepicker

在我之前的post之后,我已经应用了Oleg的建议并且有效,但不是很好。

以下是此框的图片:

enter image description here

每一行都会收到一个带有日期选择器的选择框(称为“类型缺席”)和2个输入(称为“Début”和“Fin”)。

Alls行很好,除了最后一个字段('Fin')没有收到datepicker的第一行。

以下是代码:

        var myCong = $("#dlgcong");
        myCong.jqGrid({
            url:'xpabs.php?id='+id+'&y='+y,
            datatype: "json",
            height:"auto",
            cmTemplate: {sortable:false},
            gridview: true,
            colNames:['Type absence','Début','Fin','id'],
            colModel:[ 
                {name:'abs',index:'abs',width:155,editable:true,edittype:'select',
                    editoptions:{ 
                        dataUrl:"selabs.php", 
                    dataEvents: [
                            {
                                type: 'change',
                                fn: function(e) {
                                    $(this).parent().css('background-color','#'+$(this).find('option:selected').attr('colr'));
                                    if($(this).find('option:selected').attr('colr')=='ffffff'){
                                        $(this).parent().parent().find('input').datepicker('disable');
                                    }else{
                                        $(this).parent().parent().find('input').datepicker('enable');
                                        $(this).parent().parent().attr('changed',true);
                                    }
                                }
                            }
                        ]
                    },
                    cellattr: function (rowId, val, rawObject, cm, rdata) {
                        return ' style="background-color:#'+rawObject[4]+';color:white;"';
                    }
                },
                {name:'debut',index:'debut',align:'center',width:70,editable:true},
                {name:'fin',index:'fin',align:'center',width:70,editable:true},
                {name:'id',index:'id',hidden:true}
            ],
            jsonReader: {
                id:3,
                cell: "", 
                root: function (obj) { 
                    return obj; 
                } 
            },                  
            loadComplete: function (data) {
                var $self = $(this),
                        idPrefix = $self.jqGrid("getGridParam", "idPrefix"),
                        l = data.length,
                        i,
                        item,
                        cm;
                for (i = 0; i < l; i++) {
                    item = data[i];
                    cm = $self.jqGrid("getColProp", "debut");
                    cm.editoptions = {
                        dataInit: function(element) {
                            $(element).datepicker({
                                setDate:item[1],
                                minDate:'01/01/'+y,
                                maxDate:'31/12/'+y,
                                onSelect: function( selectedDate,inst ) {
                                    $(element).val(selectedDate );
                                    $(element).parent().parent().attr('changed',true);
                                }
                            })
                        }
                    };
                    $self.jqGrid("editRow", idPrefix + item[3]);
                    //
                    cm = $self.jqGrid("getColProp", "fin");
                    cm.editoptions = {
                        dataInit: function(element) {
                            $(element).datepicker({
                                setDate:item[2],
                                minDate:'01/01/'+y,
                                maxDate:'31/12/'+y,
                                onSelect: function( selectedDate,inst ) {
                                    $(element).val(selectedDate );
                                    $(element).parent().parent().attr('changed',true);
                                }
                            })
                        }
                    };
                    $self.jqGrid("editRow", idPrefix + item[3]);
                }
                myCong.find('select').each(function(){
                    $(this).css({
                        backgroundColor:'transparent',
                        color:'white',
                        border:0,
                        width:155
                    });
                });
                $('#EditDialog').dialog('option', 'title', 'Absences '+caption.toUpperCase());
            },
            idPrefix: "cong",
            rowNum: 10000   
        });

和来自服务器的JSON响应:

[["Cong\u00e9 pay\u00e9","06\/09\/2013","29\/09\/2013","3","0080FF"],["Cong\u00e9 pay\u00e9","19\/07\/2013","19\/07\/2013","2","0080FF"],["Cong\u00e9 exceptionnel","03\/06\/2013","03\/06\/2013","5","FF8000"],["R.T.T.","31\/05\/2013","31\/05\/2013","4","FF0000"],["R.T.T.","10\/05\/2013","10\/05\/2013","6","FF0000"]]

我不明白为什么只有第一行的最后一个字段被破坏,因此所有行都与loadComplete例程有关。

如果有人对这个问题有所了解以及如何解决这个问题,请提前感谢您的帮助和花费的时间。 祝你今天愉快。 JiheL

1 个答案:

答案 0 :(得分:1)

错误似乎很简单:您应删除

的第一个电话
$self.jqGrid("editRow", idPrefix + item[3]);
在“for”循环中。如果您在已经处于编辑模式的行上第二次调用editRow,因为上一次调用,则第二次调用将被忽略。