Warum sind die Optionswerte des Status-Auswahlfelds in meinem jqGrid-Bearbeitungsformular falsch?

jqgrid hat im Bearbeitungsfeld falsche Dropdown-Optionswerte ausgewählt

Obwohl die Länder- und Bundeslandwerte im Bearbeitungsformular korrekt ausgewählt wurden, werden die im Bundesland-Auswahlfeld angezeigten Optionswerte angezeigt sind falsch, wenn das Formular bearbeitet wird. Dieses Problem bleibt auch dann bestehen, wenn nach Auswahl des US-Landes wieder zum britischen Land gewechselt wird.

So beheben Sie falsche Optionswerte im Auswahlfeld „Bundesstaat“

Um dieses Problem zu beheben, ist eine korrekte Eingabe erforderlich Füllen Sie das Auswahlfeld „Bundesland“ basierend auf dem ausgewählten Länderwert aus, wenn das Bearbeitungsformular geladen wird. Der Ansatz umfasst:

1. Auffüllen der Bundesstaatswerte basierend auf der Länderauswahl in der dataInit-Funktion.
2. Neuaufbau des Bundesstaatsauswahlfelds, wenn das Land geändert wird.

Codelösung

<code class="javascript">var countries = { '1': 'US', '2': 'UK' };
var states = { '1': 'Alabama', '2': 'California', '3': 'Florida', '4': 'Hawaii', '5': 'London', '6': 'Oxford' };
var statesOfCountry = {
    1: { '1': 'Alabama', '2': 'California', '3': 'Florida', '4': 'Hawaii' },
    2: { '5': 'London', '6': 'Oxford' }
};

var resetStatesValues = function () {
    grid.setColProp('State', { editoptions: { value: states} });
};

$("#list").jqGrid({
    data: mydata,
    datatype: 'local',
    colModel: [
        { name: 'Name', width: 200 },
        { 
            name: 'Country', 
            width: 100, 
            editable: true, 
            formatter: 'select',
            edittype: 'select', 
            editoptions: {
                value: countries,
                dataInit: function (elem) {
                    setStateValues($(elem).val());
                },
                dataEvents: [
                    { type: 'change', fn: function (e) { changeStateSelect($(e.target).val(), e.target); } },
                    { type: 'keyup', fn: function (e) { $(e.target).trigger('change'); } }
                ]
            }
        },
        {
            name: 'State', 
            width: 100, 
            editable: true, 
            formatter: 'select',
            edittype: 'select', 
            editoptions: { value: states }
        }
    ],
    onSelectRow: function (id) {
        if (id &amp;&amp; id !== lastSel) {
            if (lastSel != -1) {
                resetStatesValues();
                grid.restoreRow(lastSel);
            }
            lastSel = id;
        }
    },
    ondblClickRow: function (id, ri, ci) {
        if (id &amp;&amp; id !== lastSel) {
            grid.restoreRow(lastSel);
            lastSel = id;
        }
        resetStatesValues();
        grid.editRow(id, true, null, null, 'clientArray', null,
                        function (rowid, response) {  // aftersavefunc
                            grid.setColProp('State', { editoptions: { value: states} });
                        });
        return;
    },
    editurl: 'clientArray',
    sortname: 'Name',
    height: '100%',
    viewrecords: true,
    rownumbers: true,
    sortorder: "desc",
    pager: '#pager',
    caption: "Demonstrate dependend select/dropdown lists (edit on double-click)"
}).jqGrid('navGrid','#pager', 
          { edit: true, add: true, del: false, search: false, refresh: false },
          { // edit options
              recreateForm:true,
              onClose:function() {
                  resetStatesValues();
              }
          },
          { // add options
              recreateForm:true,
              onClose:function() {
                  resetStatesValues();
              }
          });</code>

Hinweise

• Die Methode „grid.setColProp(...)“ wird zum Festlegen der Spalteneigenschaften verwendet.
• Die dataInit Die Funktion wird verwendet, um das Auswahlfeld zu initialisieren und mit Optionen zu füllen.
• Das dataEvents-Array wird verwendet, um Ereignishandler an das Auswahlfeld anzuhängen.

Das obige ist der detaillierte Inhalt vonWarum sind die Optionswerte des Status-Auswahlfelds in meinem jqGrid-Bearbeitungsformular falsch?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!