Heim > Web-Frontend > js-Tutorial > Hauptteil

Warum zeigt das Bearbeitungsformular in jqGrid beim Bearbeiten von Datensätzen falsche Optionswerte in Auswahlfeldern an?

DDD
Freigeben: 2024-11-01 02:43:28
Original
564 Leute haben es durchsucht

Why does the edit form in jqGrid display incorrect option values in select boxes when editing records?

Falsche Werte für ausgewählte Dropdown-Optionen im Bearbeitungsfeld

Bei der Verwendung der Formularbearbeitung in jqGrid kann es zu falschen Optionswerten in Auswahlfeldern kommen beim Bearbeiten von Datensätzen. Insbesondere beginnen die Werte möglicherweise bei 0 anstelle des korrekten Startwerts.

Problembeschreibung

Stellen Sie sich das folgende Szenario vor:

  • Zwei Auswahl Felder sind vorhanden: Land und Bundesland.
  • Die Optionen im Auswahlfeld „Bundesland“ hängen vom ausgewählten Land ab.
  • Zum Beispiel verfügt „Land: USA (Optionswert=1)“ über Bundeslandoptionen mit Werten beginnend von 1 („Alabama: Optionswert=1“).

Beim Bearbeiten eines Datensatzes, bei dem das Land Großbritannien ist (Optionswert=2) und der Staat Oxford ist (Optionswert=6), wird der Im Bearbeitungsformular werden zunächst das richtige Land und der richtige Bundesstaat angezeigt. Wenn jedoch das Statusauswahlfeld geöffnet wird, sind die Optionswerte falsch und beginnen bei 0. Die korrekten Optionswerte sollten bei 5 beginnen.

Ursache

Die Die Hauptursache liegt darin, dass der Wert der Bearbeitungsoptionen für Auswahlfelder während der Initialisierung nur einmal verwendet wird. In Fällen, in denen Optionen für das zweite Auswahlfeld dynamisch basierend auf dem Wert des ersten Auswahlfelds ausgefüllt werden, müssen die Optionen des zweiten Auswahlfelds manuell aktualisiert werden.

Lösung

Um dieses Problem zu beheben, führen wir die folgenden Schritte aus:

  1. Setzen Sie die anfänglichen Optionswerte des zweiten Auswahlfelds auf eine statische Liste zurück (z. B. alle verfügbaren Zustände).
  2. Wann Wenn sich der Wert des ersten Auswahlfelds ändert, erstellen Sie die Optionen für das zweite Auswahlfeld basierend auf dem ausgewählten Land neu.
  3. Verwenden Sie dataEvents, um Änderungen im ersten Auswahlfeld zu verarbeiten und die Neuerstellung des zweiten Auswahlfelds auszulösen.

Codebeispiel

<code class="javascript">resetStatesValues = function () {
    grid.setColProp('State', { editoptions: { value: states} });
};
grid.jqGrid({
   // ... other configuration options
   editoptions: {
       value: countries,
       dataEvents: [
           {
               type: 'change',
               fn: function(e) {
                   resetStatesValues();

                   var countryId = $(e.target).val();
                   var sc = statesOfCountry[countryId];
                   var newOptions = '';
                   for (var stateId in sc) {
                       newOptions += '<option value="' +
                                  stateId + '">' +
                                  states[stateId] + '</option>';
                   }

                   if ($(e.target).is('.FormElement')) {
                       var form = $(e.target).closest('form.FormGrid');
                       $("select#State.FormElement", form[0]).html(newOptions);
                   } else {
                       var row = $(e.target).closest('tr.jqgrow');
                       var rowId = row.attr('id');
                       $("select#" + rowId + "_State", row[0]).html(newOptions);
                   }
               }
           }
       ]
   }
});</code>
Nach dem Login kopieren

Durch die Implementierung dieser Schritte stellen wir sicher, dass die Optionswerte des zweiten Auswahlfelds immer korrekt sind, basierend auf dem ausgewählten Land in das erste Auswahlfeld.

Das obige ist der detaillierte Inhalt vonWarum zeigt das Bearbeitungsformular in jqGrid beim Bearbeiten von Datensätzen falsche Optionswerte in Auswahlfeldern an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage