在jqgrid编辑中动态刷新多选下拉列表
Refresh multiselect dropdown dynamically in jqgrid edit
我正试图在jqgrid编辑中动态填充多选下拉列表。jqgrid有两个下拉菜单,即角色和角色类型。角色类型选项应根据角色中选择的选项进行更改。然而,尽管ajax调用在角色下拉更改事件中获得新值,但角色类型不会刷新。代码如下:
var selRoleVal;
var mygrid = $("#MyGrid"),
...
, getRoleTypes = function () {
var roleTypeData;
$.ajax({
type: "POST",
url: "Page/GetDefinitions",
data: "{'roleID': '" + selRoleVal + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
success: function (json) {
roleTypeData = json;
},
error: function (json) {
alert("Failed ...");
}
});
return roleTypeData;
}
, setRoleTypeValues = function (role) {
mygrid.jqGrid('setColProp', 'RoleType', {
editoptions: {
value: function (elem) {
var roleTypeData;
roleTypeData = getRoleType();
return roleTypeData;
}
, recreateForm: true
}
});
};
mygrid.jqGrid({
...,
colNames: ['ID', 'Role', 'Role Type'],
colModel: [
{ name: 'id', index: 'id', width: 20, editable: false, editoptions: { readonly: true, size: 1 } },
{
name: 'RoleName', index: 'RoleName', align: "center", width: 80, sortable: true, editable: true, edittype: "select", stype: "select",
searchoptions: {
value: RoleList
},
editoptions: {
value: RoleList,
dataInit: function (elem) {
selRoleVal = $(elem).val();
},
dataEvents: [{
type: 'change',
fn: function (e) {
selRoleVal = $(e.target).val();
setRoleTypeValues($(e.target).val());
}
}]
}
},
{
name: 'RoleType', index: 'RoleType', width: 100, sortable: true, editable: true, edittype: "select",
editoptions: {
value: getRoleType
,
dataInit: function (elem) {
$(elem).multiselect({
minWidth: 80,
height: 200,
selectedList: 10,
checkAllText: "Check all",
uncheckAllText: "Uncheck all",
noneSelectedText: "Any",
open: function () {
var $menu = $(".ui-multiselect-menu:visible");
$menu.width("auto");
return;
}
})
$(elem).multiselect('refresh');
},
multiple: true
}
}
],
rowNum: 20,
rowList: [20, 40, 60],
...
editurl: ...
....
}).jqGrid('navGrid', '#MyPager', {
....
, edit: true
, add: true
, del: true
, search: false
, recreateForm: true
})
刷新角色类型下拉列表时应包含哪些内容?
看看http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules,它演示了如何从角色选择中引用角色类型选择。试试这样的东西。
setRoleTypeValues = function (roleSelect, role) {
var roleTypeSelect = roleSelect.closest("tr").find("select#RoleType");
roleTypeSelect.empty().html(roleTypeDataOptionsAsHtml);
roleTypeSelect.multiselect('refresh');
});
};
{
name: 'RoleName', index: 'RoleName', align: "center", width: 80, sortable: true, editable: true, edittype: "select", stype: "select",
searchoptions: {
value: RoleList
},
editoptions: {
value: RoleList,
dataInit: function (elem) {
selRoleVal = $(elem).val();
},
dataEvents: [{
type: 'change',
fn: function (e) {
selRoleVal = $(e.target).val();
setRoleTypeValues($(e.target), $(e.target).val());
}
}]
}
},
希望这是有道理的。
相关文章:
- 如何在从多选下拉列表中选择选项值时动态生成文本框
- 无法使用PHP动态设置下拉列表中的值
- 如何根据对具有多行的先前列表的选择来动态加载下拉列表
- 如何在用户返回和上一个按钮时刷新下拉列表
- 使用angularJs中的数据库数据源刷新下拉列表
- 基于所选下拉列表值创建动态复选框
- 无法使用国家/地区选择中的状态动态填充下拉列表
- AngularJS:使用ng-show/hide动态维护下拉列表的3种状态(InProgress、Success、Err
- webforms:在javascript中动态添加下拉列表选项
- 引导下拉列表动态 ajax 列表项
- 动态更改的下拉列表不会刷新.(雾虫)
- 在jqgrid编辑中动态刷新多选下拉列表
- 将下拉列表动态更改为文本字段opencart
- 通过下拉列表动态更新总数
- ASP:下拉列表动态更改
- 来自 JavaScript 问题的 ASP 下拉列表动态值
- 如何动态刷新剑道下拉列表
- 通过输入字段和下拉列表动态更新字段
- 使用下拉列表动态更改照片
- 从其他下拉列表动态填充html下拉列表