0

私は 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 を使用してこれを実現する方法をまだ考えています。

4

1 に答える 1

1

問題を完全に再現することはできませんが、次の 2 つの手順を実行することをお勧めします。

  • たとえば、最初の列name: "act"の定義に任意の名前を追加します。jqGrid は、プロパティを"Edit Actions"持つ列を正しく処理できません。"name": ""colModel
  • formatter: "select"列のプロパティに追加しますPaymentSchemeId

を使用formatter: "select"すると、ユーザーにはPay on Foot 理解できない id の代わりにが表示されます2。サーバーからの JSON 応答には引き続き が含まれているはず2ですが、jqGrid はPay on Foot使用のために値を表示しますformatter: "select"。追加または編集操作中に送信されるデータには、ユーザーが選択したテキスト ("Pay on Entry"、"Pay on Exit"、および "Pay on Foot") の代わりに整数 (1、2、または 3) が含まれます。したがって、サーバー側では整数 ID のみを使用し、ユーザーには対応するテキストのみが表示されます。私はそれがあなたが望むものだと思います。

ユーザーに整数のみを表示させたい場合は、"value": "3:3;1:1;2:2"代わりに を使用する必要があり"value": "3:Pay on Entry;1:Pay on Exit;2:Pay on Foot"ます。

于 2013-10-20T11:33:48.353 に答える