無料の jqgrid は注文を表示します。投稿された注文は、背景が黄色で、アクション ボタンのみを開く必要があります。未掲載の注文には、白い背景、標準の削除、およびカスタムの投稿アクション ボタンがあります。
アクション列の colmodel:
{"hidden":false,"label":"Activity","name":"_actions","search":false,"width":94
,"sortable":false,"formatter":"actions","viewable":false,"formatoptions":{"editbutton":false,"onSuccess":function (jqXHR) { jqXHRFromOnSuccess=jqXHR;return true;}
,"delbutton":true,"delOptions":{"url":"http://localhost:52216/admin/Grid/Delete?_entity=DoklstlT","afterComplete":function (response, postdata, formid) {
summarefresh($grid);
$grid[0].focus();
}
}}},
投稿された状態は、ブール値の Kinnitatud 列によって決定されます。
{"label":null,"name":"Kinnitatud","index":"Kinnitatud","editoptions":{"value":"True:False","readonly":"readonly","disabled":"disabled"},"template":"booleanCheckboxFa","editable":true,"width":0,"classes":null,"hidden":true,"searchoptions":{"sopt":["eq","ne"],"value":":Free;true:Yes;false:No"},"dataEvents":[{"type":"focus","fn":function(e) {if(typeof e.target.ischanged=='undefined') {e.target.ischanged=false}}
},"",{"type":"click","fn":function(e) {dataChanged(e.target)}
},{"type":"blur","fn":function(e) {summarefresh()}
}]}],
他のグリッドに投稿された状態は、未投稿のドキュメントに対して入力されていない Kinkuup 列によって決定されます。
{"template":DateTemplate
,"label":null,"name":"Kinkuup","index":"Kinkuup","editoptions":{"dataInit":null,"size":10,"readonly":"readonly","disabled":"disabled"},"searchoptions":{"dataInit":initDateSearch
,"size":10,"attr":{"size":10}},"width":0,"classes":null,"hidden":true,"dataEvents":[]}],
両方の列をグリッドで非表示または表示できます。ユーザーの好みに応じて。
カスタム アクション ボタンは、すべての行に対して loadComplete で作成されます。
loadComplete: function() {
var iCol = getColumnIndexByName($(this),'_actions');
$(this).children("tbody").children("tr.jqgrow")
.children("td:nth-child("+(iCol+1)+")")
.each(function() {
$("<div>",
{
title: "Confirm (F2)",
mouseover: function() {
$(this).addClass('ui-state-hover');
},
mouseout: function() {
$(this).removeClass('ui-state-hover');
},
click: function(e) {
resetSelection();
idsOfSelectedRows = [$(e.target).closest("tr.jqgrow").attr("id")];
$("#grid").jqGrid('setSelection', $(e.target).closest("tr.jqgrow").attr("id"), false);
$('#grid_postbutton').click();
}
}
)
.addClass("ui-pg-div ui-inline-post")
.append('<span class="fa ui-state-default fa-fw fa-lock"></span>')
.prependTo($(this).children("div"));
$("<div>",
{
title: "Open (Enter)",
mouseover: function() {
$(this).addClass('ui-state-hover');
},
mouseout: function() {
$(this).removeClass('ui-state-hover');
},
click: function(e) {
openDetail($(e.target).closest("tr.jqgrow").attr("id"));
}
}
)
.addClass("ui-pg-div ui-inline-open")
.append('<span class="fa ui-state-default fa-folder-open-o"></span>')
.prependTo($(this).children("div"));
});
その後、Fontawesome チェックボックス フォーマッタを使用して無料の jqgrid で投稿された行からアクション ボタンを削除する方法 のコードを使用してボタンが条件付きで削除された後、行編集は条件付きで無効になり、背景が変更されます。
disableRows('Kinkuup', false);
disableRows('Kinnitatud', true);
var disableRows = function (rowName, isBoolean) {
var iCol = getColumnIndexByName($grid, rowName),
cRows = $grid[0].rows.length,
iRow,
row,
className,
isPosted,
mycell,
mycelldata,
cm = $grid.jqGrid('getGridParam', 'colModel'),
iActionsCol = getColumnIndexByName($grid, '_actions'), l,
isPostedStr;
l = cm.length;
for (iRow = 0; iRow < cRows; iRow = iRow + 1) {
row = $grid[0].rows[iRow];
className = row.className;
if ($(row).hasClass('jqgrow')) {
isPostedStr = $.unformat.call($grid[0], row.cells[iCol],
{ rowId: row.id, colModel: cm[iCol] }, iCol);
//if (cm[iCol].convertOnSave) {
// isPosted = cm[iCol].convertOnSave.call(this, {
// newValue: isPostedStr,
// cm: cm[iCol],
// oldValue: isPostedStr,
// id: row.id,
// //item: $grid.jqGrid("getLocalRow", row.id),
// iCol: iCol
// });
//}
isPosted = isPostedStr !== "False" && isPostedStr.trim() !== "";
if (isPosted) {
if ($.inArray('jqgrid-postedrow', className.split(' ')) === -1) {
// todo: how to disable actions buttons and form editing:
row.className = className + ' jqgrid-postedrow not-editable-row';
$(row.cells[iActionsCol]).attr('editable', '0');
$(row.cells[iActionsCol]).find(">div>div.ui-inline-del").hide();
$(row.cells[iActionsCol]).find(">div>div.ui-inline-post").hide();
$(row.cells[iActionsCol]).find(">div>div.ui-inline-edit").hide();
}
}
}
}
};
無料の jqgrid アクション オプションを使用してこのコードを簡素化する方法
標準の編集と削除、およびユーザー定義のアクションボタンの両方を非表示にする統一された方法を作成する方法は? コールバックを使用してカスタム ボタンの作成を条件付きで無効にできる場合でも、標準ボタンを非表示にするには DOM の変更が必要です。おそらく、すべてのアクション ボタンを同じ方法で定義します。おそらく、既存の rowattr または cellattr コールバックを使用するか、新しいものを導入することで実行できます。
現在、行は以下のコードでのみ読み取るように設定されています
row.className = className + ' jqgrid-postedrow not-editable-row';
$(row.cells[iActionsCol]).attr('editable', '0');
diableRows を完全に削除できるように、これを感謝するのは合理的ですか? おそらく、これの代わりに rowattr() を使用できます。
