私は Trirand MVC jqGrid パッケージを持っていますが、この質問は jqGrid 全体に当てはまると確信しています。IDにバインドされた列があります:
new JQGridColumn
{
DataField = "PaymentSchemeId",
HeaderText = "Payment Scheme",
DataType = typeof(ParkadePaymentScheme),
Searchable = true,
SearchToolBarOperation = SearchOperation.IsEqualTo,
SearchType = SearchType.DropDown,
SearchControlID = WidgetNames.DropDownSearchPaymentScheme,
Editable = true,
EditType = EditType.DropDown,
EditorControlID = WidgetNames.DropDownEditPaymentScheme
},
私のGridModel(グリッドのビューモデル)で。表示モードの場合、PaymentSchemeId
予想どおり、グリッドに の値が表示されます。編集モードでは、すべての支払いスキームを含むドロップダウンが表示され、いずれかを選択すると、ID の代わりにその名前が表示されますが、それは単なる副作用だと思います。
プロパティ値PaymentSchemeId
の表示中に値をバインドして格納するように列を設定するにはどうすればよいですか?PaymentSchemeName
グリッドによってレンダリングされるスクリプトはかなり長いですが、意味のあるものを編集することを恐れて、すべて含めています。
jQuery(document).ready(function () {
jQuery('#IndexGrid').jqGrid({
url: '/Parkade/IndexDataRequest?jqGridID=IndexGrid',
editurl: '/Parkade/EditRow?jqGridID=IndexGrid&editMode=1',
mtype: 'GET',
datatype: 'json',
page: 1,
colNames: ["Edit Actions", "Id", "Name", "Payment Scheme", "Active?", "Remarks"],
colModel: [{
"search": false,
"sortable": false,
"formatoptions": {
"editbutton": true,
"delbutton": true,
"keys": true
},
"width": 50,
"formatter": "actions",
"name": "",
"index": ""
}, {
"searchoptions": {
"searchhidden": true
},
"index": "Id",
"hidden": true,
"key": true,
"name": "Id"
}, {
"stype": "select",
"editable": true,
"index": "Name",
"searchoptions": {
"value": ":All;Brooklyn Mall:Brooklyn Mall"
},
"name": "Name"
}, {
"editoptions": {
"value": "3:Pay on Entry;1:Pay on Exit;2:Pay on Foot"
},
"editable": true,
"stype": "select",
"edittype": "select",
"searchoptions": {
"value": ":All;Pay on Foot:Pay on Foot"
},
"name": "PaymentSchemeId",
"index": "PaymentSchemeId"
}, {
"editoptions": {
"value": "True:Yes;False:No"
},
"editable": true,
"stype": "select",
"edittype": "select",
"searchoptions": {
"value": ":All;True:True"
},
"name": "IsActive",
"index": "IsActive"
}, {
"width": 300,
"index": "Remarks",
"searchoptions": {
dataInit: function (el) {
setTimeout(function () {
var ec = 'AutoCompleteRemarks';
if (typeof (jQuery(el).autocomplete) !== 'function') alert('JQAutoComplete javascript not present on the page. Please, include jquery.jqAutoComplete.min.js');
jQuery(el).autocomplete(eval(ec + '_acid'));
}, 200);
}
},
"editable": true,
"name": "Remarks"
}],
viewrecords: true,
scrollrows: false,
prmNames: {
id: "Id"
},
headertitles: true,
autowidth: true,
pager: jQuery('#IndexGrid_pager'),
loadError: jqGrid_aspnet_loadErrorHandler,
rowNum: 20,
rowList: [10, 20, 30],
editDialogOptions: {
"recreateForm": true,
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
},
editData: {
__RequestVerificationToken: jQuery('input[name=__RequestVerificationToken]').val()
}
},
addDialogOptions: {
"recreateForm": true,
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
},
editData: {
__RequestVerificationToken: jQuery('input[name=__RequestVerificationToken]').val()
}
},
delDialogOptions: {
"recreateForm": true,
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
},
delData: {
__RequestVerificationToken: jQuery('input[name=__RequestVerificationToken]').val()
}
},
searchDialogOptions: {
"multipleSearch": true,
"recreateForm": true,
"resize": false
},
viewRowDialogOptions: {},
jsonReader: {
id: "Id"
},
sortorder: 'asc',
height: '85%',
viewsortcols: [false, 'vertical', true]
}).navGrid('#IndexGrid_pager', {
"edit": false,
"add": true,
"del": false,
"search": true,
"refresh": true,
"view": false,
"position": "left",
"cloneToTop": true
}, jQuery('#IndexGrid').getGridParam('editDialogOptions'), jQuery('#IndexGrid').getGridParam('addDialogOptions'), jQuery('#IndexGrid').getGridParam('delDialogOptions'), jQuery('#IndexGrid').getGridParam('searchDialogOptions'), jQuery('#IndexGrid').getGridParam('viewRowDialogOptions')).bindKeys();
function jqGrid_aspnet_loadErrorHandler(xht, st, handler) {
jQuery(document.body).css('font-size', '100%');
jQuery(document.body).html(xht.responseText);
};
jQuery('#IndexGrid').filterToolbar({
"searchOnEnter": false
});
});
/Parkade/IndexDataRequest?jqGridID=IndexGrid
リクエストのレスポンスは次のとおりです。
{"page":1,"total":1,"records":1,"rows":[{"id":"1","cell":["","1","Brooklyn Mall","2","True",""]}],"userdata":{}}
PaymentSchemeId
私のエンティティには table への FK がPaymentScheme
あり、それらのレコードの 1 つの PK を に保存するPaymentSchemeId
ため、Id
サフィックスとドロップダウン全体が必要になるため、これは の値が 2 になると予想されます。JS でわかるように、ドロップダウンはサーバー側で設定されます。
例、およびその他の関連コードが追加されました。IdでPaymentSchemeId
ある値を持つことを期待しています。int
私はまさに私が期待したものを手に入れます。ドロップダウンの値は、次の列定義でレンダリングされます。
"editoptions": {
"value": "3:Pay on Entry;1:Pay on Exit;2:Pay on Foot"
私は彼らの例を逐語的にコピーすることに非常に近いのでjqGridID=IndexGrid
、コントローラーで無視されるクエリ文字列がGET リクエストに含まれている理由を理解しないでください。
public JsonResult IndexDataRequest()
{
var gridModel = new ParkadeGridModel();
JQGridState gridState = gridModel.Grid.GetState();
Session[SessionKeys.JqGridState] = gridState;
SetupGrid(gridModel.Grid);
ViewData["PaymentSchemeId_Data"] = _indexModel.PaymentSchemes;
return gridModel.Grid.DataBind(_indexModel.Items.AsQueryable());
}
質問する前に:
private void SetupGrid(JQGrid grid, string indexMsg = null)
{
_indexModel = BuildIndexModel();
grid.DataUrl = Url.Action("IndexDataRequest");
grid.EditUrl = Url.Action("EditRow");
grid.Columns.Insert(0, new JQGridColumn
{
EditActionIconsColumn = true,
EditActionIconsSettings = new EditActionIconsSettings
{
SaveOnEnterKeyPress = true
},
HeaderText = "Edit Actions",
Width = 50,
Searchable = false,
Sortable = false
});
SetupParkadeNameDropDown(grid);
SetupPaymentSchemeDropDown(grid);
SetupYesNoDropDown(grid);
}
と:
private void SetupPaymentSchemeDropDown(JQGrid parkadesGrid)
{
JQGridColumn paymentColumn = parkadesGrid.Columns.Find(c => c.DataField == "PaymentSchemeId");
if (parkadesGrid.AjaxCallBackMode == AjaxCallBackMode.RequestData)
{
var searchList = _indexModel.Items.Select(m => m.PaymentSchemeName).Distinct().Select(l => new SelectListItem { Text = l, Value = l });
paymentColumn.SearchList = searchList.ToList();
paymentColumn.SearchList.Insert(0, new SelectListItem { Text = "All", Value = "" });
var editList = _paymentSchemeRepository.Get().OrderBy(p => p.Name).ToList();
paymentColumn.EditList = editList.Select(l => new SelectListItem { Text = l.Name, Value = l.Id.ToString() }).ToList();
}
}
CustomFormatter
この FK 列のフォーマッターとして「セレクター」を使用する必要があると思いますが、列定義でTrirand を使用してこれを実現する方法をまだ考えています。