I use jqGrid 4.9.3-pre - free jqGrid by Oleg. I edit data using the model window "Form Editing". The data get from the server. datatype: "json" with loadonce: false , paging of data don't use I use a standard table. Just call "Form Editing" ondblClickRow.
ondblClickRow: function(rowid) {
$(this).jqGrid('setSelection', rowid)
.jqGrid("editGridRow", rowid, {
recreateForm: true,
width: 1000,
height: "auto"});
}
Two questions:
I find your question interesting and so I created the demo , which demonstrates one of the possible implementation of making edited field of form editing. The results looks like on the picture below
The corresponding code is inside of beforeShowForm
callback:
beforeShowForm: function ($form) {
var $self = $(this),
myMarker = "<span class='mychanged-item fa fa-lg fa-arrow-circle-o-left' style='display:none;border-radius:6px;background-color:LightGreen;'></span>";
$form.find(".FormElement").focusout(function () {
var colName = $(this).attr("name"),
rowid = $form.find("input[name='" + $self[0].id + "_id" + "']")
.val(),
oldValue = $self.jqGrid("getCell", rowid, colName),
$myMarker = $(this).closest("td")
.next("td")
.find("span.mychanged-item");
if ($(this).val() !== oldValue) {
$myMarker.css("display", ""); // show
} else {
$myMarker.css("display", "none"); // hide
}
}).each(function () {
$(this).closest("td")
.after("<td style='width:15px'>" + myMarker + "</td>");
});
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.