jqGrid:按上一个和下一个箭头时，图像在编辑窗口中未更改 [英] jqGrid : Image not changing in edit window when pressing the previous and next arrow

问题描述

我有一个jqGrid，其中有一个保存图像的列.当用户单击页面上的编辑图标时，则在编辑窗口中可以看到照片，并且该照片是通过navGrid-

的编辑部分中的以下命令完成的

 recreateForm: true,
beforeInitData: function () {
    var cm = jQuery("#list3").jqGrid('getColProp', 'img'),
    selRowId = jQuery("#list3").jqGrid('getGridParam', 'selrow');
    cm.editoptions.src = '/BDED_WEB/resources/images/user'+selRowId+'.jpg';
}                
 

但是，如果我想通过按编辑窗口中的上一个和下一个箭头来返回并前进到数据集，则所有数据均已更改，但图像未更改.这意味着当用户单击pData或nData按钮时，不会调用beforeInitData方法.

当用户按下下一个和上一个箭头按钮时，如何在编辑窗口中也更改图像?

解决方案

您似乎在使用答案创建的演示.

要通过单击编辑表单的下一步"，上一步"按钮来实现图像更改(在下面的图像上标记为黄色)

一个人可以使用 afterclickPgButtons 回调进行设置src属性.

 afterclickPgButtons: function () {
    var $self = $(this),
        selRowId = $self.jqGrid("getGridParam", "selrow");
    // "img" below is the column name which have edittype: "image"
    $("#img").attr("src", "/BDED_WEB/resources/images/user" + selRowId + ".jpg");
}
 

该演示演示了原始演示.

I have a jqGrid and in which there is a column which holds an image. When the user click on the edit icon from the page then in the edit window the photo is visible and that has been done by the following command in the edit section of the navGrid -

recreateForm: true,
beforeInitData: function () {
    var cm = jQuery("#list3").jqGrid('getColProp', 'img'),
    selRowId = jQuery("#list3").jqGrid('getGridParam', 'selrow');
    cm.editoptions.src = '/BDED_WEB/resources/images/user'+selRowId+'.jpg';
}                

But if I want to go back and forward to the data set by pressing the previous and next arrow in the edit window, then all the data changed but the image is not changing. That means the beforeInitData method is not getting called when the user is clicking on pData or nData button.

How can I change the image also in the edit window when the user press the next and previous arrow buttons?

解决方案

It looks like you use the demo which I created for the answer.

To implement changing of the image on clicking on the "Next", "Prev" buttons of the edit form (marked yellow on the image below)

one can use afterclickPgButtons callback which set src attribute.

afterclickPgButtons: function () {
    var $self = $(this),
        selRowId = $self.jqGrid("getGridParam", "selrow");
    // "img" below is the column name which have edittype: "image"
    $("#img").attr("src", "/BDED_WEB/resources/images/user" + selRowId + ".jpg");
}

The demo demonstrates the modified version of the original demo.

这篇关于jqGrid:按上一个和下一个箭头时，图像在编辑窗口中未更改的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！