使用刷新选择框时,编辑选项中的dataUrl在JqGrid中不起作用

时间:2012-05-17 08:59:51

标签: jquery jqgrid data-url

我是jqGrid的新手。我正在尝试在editoptions中使用dataUrl来为每行编辑刷新选择框选项值(在显示编辑表单之前)。

但我没有看到刷新发生,我完成了在jqGrid中编辑行时在firebug中看到的任何http请求。

我在名为"loadPoleManagers.php"的列中的dataUrl中调用了一个php文件Pole_manager,在php文件中我返回选择带有选项的html标记,纯html标记。

如果我遗失了什么,你能不能请任何人建议我吗?

下面是我的jqGrid代码。

$('#groups_grid').jqGrid({
    caption: 'Groups',
    hidegrid:false,
    height:'100%',
    width:1024,
    imgpath: 'style/jquery.plugins/jqgrid/steel/images',
    loadui:'disable',
    forceFit:true,
    pager: jQuery('#pagerGroups'),
    viewrecords:true,
    url:'data/xml/grid/groups.php',
    datatype: "xml",
    mtype:'POST',
    ajaxSelectOptions: { cache: false },
    colNames:['ID','Name', 'Complete day compulsory', 'Pole manager',
        'Support Leader', 'Itrack group name'],
    colModel:[
        {name:'id_group',index:'id_group', width:40, align:"center"},
        {name:'name',index:'name', width:70, resizable:true, editable:true,
            editoptions: {size:'20', maxlength:'45'}},
        {name:'complete_day_compulsory',index:'complete_day_compulsory',
            width:110, align:"center", resizable:true, sortable:true,
            editable:true, edittype:'select', editoptions: {value:"0:No;1:Yes"}},
        {name:'pole_manager',index:'pole_manager->last_name', width:100,
            resizable:true, sortable:true, editable:true,
            edittype:'select',editoptions:{dataUrl:'loadPoleManagers.php'}},
        {name:'support_leader',index:'support_leader->last_name', width:100,
            resizable:true, sortable:true, editable:true, edittype:'select',
            editoptions: {value:support_leaders}},
        {name:'itrack_group_name',index:'itrack_group_name', width:100,
            resizable:true, editable:true, edittype:'text'}
    ],
    rowNum:15,
    rowList:[5, 10, 15, 25],
    imgpath: 'style/jquery.plugins/jqgrid/steel/images',
    sortname: 'id_group',
    multiselect: false,
    onSelectRow: rowSelectedHandler,
    ondblClickRow: function(id){
        if(id){
            jQuery('#groups_grid').restoreRow(lastEditedGroup);
            jQuery('#groups_grid').editRow(id,true);
            lastEditedGroup=id;
        }
    },
    loadComplete: function(){
        lastEditedGroup = null;
        lastSelectedGroup = null;
    },
    editurl: 'data/forms_handle/edit_group.php'
    }).navGrid("#pagerGroups",
        {refresh: true, edit: true, add: true, del: true, search: true, view: false},
        {height:220, width:690, closeAfterEdit:true, recreateForm:true},
        {height:220, width:690, closeAfterAdd:true,recreateForm:true},
        {height:140, width:380},
        {height:80, width:450, closeAfterSearch:true,closeOnEscape:true,
            multipleSearch:true}
    );

感谢。

1 个答案:

答案 0 :(得分:0)

我使用beforeShowForm函数来解决此问题。

以下是选择行并单击进行编辑时刷新选择框选项列表的完整代码。

$("#groups_grid").jqGrid({
    caption: "Groups",
    hidegrid:false,
    height:'100%',
    width:1024,
    imgpath: 'style/jquery.plugins/jqgrid/steel/images',
    loadui:"disable",
    forceFit:true,
    pager: jQuery('#pagerGroups'),
    viewrecords:true,
    url:'data/xml/grid/groups.php',
    datatype: "xml",
    mtype:'POST',
    ajaxSelectOptions: { cache: false },
    colNames:['ID','Name', 'Complete day compulsory', 'Pole manager', 'Support Leader', 'Itrack group name'],
    colModel:[                                          
        {name:'id_group',index:'id_group', width:40, align:"center"},
        {name:'name',index:'name', width:70, resizable:true, editable:true, editoptions: {size:'20', maxlength:'45'}},
        {name:'complete_day_compulsory',index:'complete_day_compulsory', width:110, align:"center", resizable:true, sortable:true, editable:true, edittype:'select', editoptions: {value:"0:No;1:Yes"}},
        {name:'pole_manager',index:'pole_manager->last_name', width:100,  resizable:true, sortable:true, editable:true, edittype:'select',editoptions: {value:pole_managers}},
        {name:'support_leader',index:'support_leader->last_name', width:100,  resizable:true, sortable:true, editable:true, edittype:'select', editoptions: {value:support_leaders}},
        {name:'itrack_group_name',index:'itrack_group_name', width:100,  resizable:true, editable:true, edittype:'text'}
    ],
    rowNum:15,
    rowList:[5, 10, 15, 25],
    imgpath: 'style/jquery.plugins/jqgrid/steel/images',
    sortname: 'id_group',
    multiselect: false,
    onSelectRow: rowSelectedHandler,
    ondblClickRow: function(id){ 
        if(id){
            jQuery('#groups_grid').restoreRow(lastEditedGroup);
            jQuery('#groups_grid').editRow(id, true);
            lastEditedGroup = id;
        }
    },
    loadComplete: function(){
        lastEditedGroup = null;
        lastSelectedGroup = null;
    },


    editurl: 'data/forms_handle/edit_group.php'
}).navGrid("#pagerGroups", 
    {
        refresh: true, edit: true, add: true, del: true, search: true, view: false},
    {
        height:220, 
        width:690, 
        closeAfterEdit:true, 
        recreateForm:true,
        beforeShowForm:function(formID) {
            $.post("data/xml/loadPoleManagers.php?group="+lastSelectedGroup, {},
                function(response){
                    //alert(response);
                    jQuery('#pole_manager',formID).empty().append(response);
                },
                 "text"
            );
        }
    },
    {height:220, width:690, closeAfterAdd:true,recreateForm:true},
    {height:140, width:380},
    {height:80, width:450, closeAfterSearch:true,closeOnEscape:true, multipleSearch:true}
);

在我的data / xml / loadPoleManagers.php文件中,我只返回html选项标记

"<"option>one"</"option">"
"<"option">"Two"</"option">"