从 JqGrid ShowLink click 发送 Ajax 请求
当用户单击 jqGrid 中的链接时,我需要加载一些动态 html。
这是我的定义
function loadUserAdministrationList() {
jQuery("#userlist").jqGrid({
url: '/Administration/GetData/',
datatype: 'json',
mtype: 'GET',
colNames: ['Username', 'Prénom', 'Nom', 'Courriel'],
colModel: [{ name: 'Username', index: 'Username', width: 300, align: 'left',
edittype: 'select', formatter: 'showlink',
formatoptions: { baseLinkUrl: '/Administration/ModifyUser'} },
{ name: 'Prénom', index: 'Firstname', width: 300, align: 'left' },
{ name: 'Nom', index: 'Lastname', width: 300, align: 'left' },
{ name: 'Courriel', index: 'Email', width: 300, align: 'left'}],
pager: jQuery('#userlistpager'),
rowNum: 20,
rowList: [5, 10, 20, 50],
sortname: 'Firstname',
sortorder: "asc",
height:600,
viewrecords: true,
imgpath: '/Public/css/theme/custom/images',
caption: '',
loadtext: 'Chargement des utilisateurs...'
}).navGrid('#userlistpager',
{ search: true, edit: false, add: false, del: false },
{}, // default settings for edit
{}, // default settings for add
{}, // default settings for delete
{ closeOnEscape: true, multipleSearch: true,
closeAfterSearch: true }, //search options
{}
);
};
,您可以看到我想加载修改表单。 我如何告诉 jqGrid 在单击 showLink 时执行 ajax 调用? 谢谢
I need to load some dynamic html when a user click on a link in a jqGrid.
here is my definition
function loadUserAdministrationList() {
jQuery("#userlist").jqGrid({
url: '/Administration/GetData/',
datatype: 'json',
mtype: 'GET',
colNames: ['Username', 'Prénom', 'Nom', 'Courriel'],
colModel: [{ name: 'Username', index: 'Username', width: 300, align: 'left',
edittype: 'select', formatter: 'showlink',
formatoptions: { baseLinkUrl: '/Administration/ModifyUser'} },
{ name: 'Prénom', index: 'Firstname', width: 300, align: 'left' },
{ name: 'Nom', index: 'Lastname', width: 300, align: 'left' },
{ name: 'Courriel', index: 'Email', width: 300, align: 'left'}],
pager: jQuery('#userlistpager'),
rowNum: 20,
rowList: [5, 10, 20, 50],
sortname: 'Firstname',
sortorder: "asc",
height:600,
viewrecords: true,
imgpath: '/Public/css/theme/custom/images',
caption: '',
loadtext: 'Chargement des utilisateurs...'
}).navGrid('#userlistpager',
{ search: true, edit: false, add: false, del: false },
{}, // default settings for edit
{}, // default settings for add
{}, // default settings for delete
{ closeOnEscape: true, multipleSearch: true,
closeAfterSearch: true }, //search options
{}
);
};
as you can see i would like to load a modification form.
How can i tell jqGrid to do an ajax call on the click of showLink ?
Thanks
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
可能的解决方案如下所示:
edittype: 'select'
和align: 'left'
并考虑添加title: false
而是在鼠标悬停在单元格上时删除工具提示的显示。formatter: 'showlink'
的formatoptions
修改为以下内容:formatoptions: { baseLinkUrl: 'javascript:', showAction: "MyBase.GetAndShowUserData(jQuery('# userlist'),'#myDiv','", addParam: "');" }
。 jqGrid 将构造元素的
href
属性,如下所示:href="javascript:MyBase.GetAndShowUserData(jQuery('#userlist'),'# userDetails','?id=rowId');"
其中rowId
将是相应网格行的 id。MyBase.GetAndShowUserData
的函数,如下所示:(在下面的代码中,我们使用全局
MyBase
仅用于命名空间)我想在这里,您的页面上有一个
或其他带有
id="userDetails"
的元素,并且函数
MyBase.GetAndShowUserData
将进行 ajax 调用并将结果填充到中。
MyBase.GetAndShowUserData
内部的代码只是一个原始模板。我只想展示如何从网格访问数据。A possible solution could looks like following:
edittype: 'select'
andalign: 'left'
and consider to addtitle: false
instead to remove displaying of the ToolTip on hover a cell with the mouse.formatoptions
which containformatter: 'showlink'
to following:formatoptions: { baseLinkUrl: 'javascript:', showAction: "MyBase.GetAndShowUserData(jQuery('#userlist'),'#myDiv','", addParam: "');" }
. jqGrid will constructhref
attribute of<a>
element like following:href="javascript:MyBase.GetAndShowUserData(jQuery('#userlist'),'#userDetails','?id=rowId');"
whererowId
will be the id of the corresponding grid row.MyBase.GetAndShowUserData
like following:(In the code below we use global
MyBase
only for namespacing)I suppose here, that on your page there are a
<div>
or other element withid="userDetails"
likeand the function
MyBase.GetAndShowUserData
will make an ajax call and fill the results inside the<div id="userDetails"></div>
. The code inside ofMyBase.GetAndShowUserData
is a raw template only. I wanted only to show how you can access the data from the grid.