Deaktivierte Formulareingaben erscheinen nicht in der Anfrage

Question

Ich habe einige deaktivierte Eingaben in einem Formular und möchte sie an einen Server senden, aber Chrome schließt sie von der Anfrage aus.

Gibt es eine Lösung für dieses Problem, ohne ein verstecktes Feld hinzuzufügen?

<form action="/Media/Add">
    <input type="hidden" name="Id" value="123" />

    <!-- this does not appear in request -->
    <input type="textbox" name="Percentage" value="100" disabled="disabled" /> 

</form>

Answer 1

Elemente mit dem disabled Attribut nicht übermittelt werden, oder Sie können sagen, dass ihre Werte nicht gebucht werden (siehe den zweiten Aufzählungspunkt unter Schritt 3 in die HTML 5-Spezifikation für die Erstellung des Formulardatensatzes ).

D.h.,

<input type="textbox" name="Percentage" value="100" disabled="disabled" /> 

Zu Ihrer Information, per 17.12.1 in der HTML 4-Spezifikation:

1. Deaktivierte Steuerelemente erhalten keinen Fokus.
2. Deaktivierte Steuerelemente werden in der Tabulatornavigation übersprungen.
3. Deaktivierte Kontrollen können nicht erfolgreich gebucht werden.

Sie können verwenden readonly Attribut in Ihrem Fall zu verwenden, können Sie die Daten Ihres Feldes veröffentlichen.

D.h.,

<input type="textbox" name="Percentage" value="100" readonly="readonly" />

Zu Ihrer Information, per 17.12.2 in der HTML 4-Spezifikation:

1. Nur-Lese-Elemente erhalten den Fokus, können aber vom Benutzer nicht geändert werden.
2. Schreibgeschützte Elemente werden in die Tabulatornavigation einbezogen.
3. Nur-Lese-Elemente werden erfolgreich gebucht.

Answer 2

Wenn Sie Jquery verwenden und die Daten mit Ajax senden, können Sie Ihr Problem lösen:

<script>

$('#form_id').submit(function() {
    $("#input_disabled_id").prop('disabled', false);

    //Rest of code
    })
</script>

Answer 3

Um Werte von deaktivierten Eingaben zusätzlich zu den aktivierten Eingaben zu verbuchen, können Sie einfach alle Eingaben des Formulars wieder aktivieren, während es übermittelt wird.

<form onsubmit="this.querySelectorAll('input').forEach(i => i.disabled = false)">
    <!-- Re-enable all input elements on submit so they are all posted, 
         even if currently disabled. -->

    <!-- form content with input elements -->
</form>

Wenn Sie jQuery bevorzugen:

<form onsubmit="$(this).find('input').prop('disabled', false)">
    <!-- Re-enable all input elements on submit so they are all posted, 
         even if currently disabled. -->

    <!-- form content with input elements -->
</form>

Für ASP.NET MVC C# Razor fügen Sie den Submit-Handler wie folgt hinzu:

using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post,
    // Re-enable all input elements on submit so they are all posted, even if currently disabled.
    new { onsubmit = "this.querySelectorAll('input').forEach(i => i.disabled = false)" } ))
{
    <!-- form content with input elements -->
}

Answer 4

Wenn Sie das Feld unbedingt deaktivieren und die Daten weitergeben müssen, können Sie ein Javascript verwenden, um dieselben Daten in ein ausgeblendetes Feld einzugeben (oder einfach das ausgeblendete Feld ebenfalls einstellen). Auf diese Weise könnten Sie das Feld deaktivieren, aber dennoch die Daten übermitteln, obwohl Sie auf eine andere Seite verweisen würden.

Answer 5

Ich aktualisiere diese Antwort, da sie sehr nützlich ist. Fügen Sie einfach readonly zur Eingabe hinzu.

Die Form wird also sein:

<form action="/Media/Add">
    <input type="hidden" name="Id" value="123" />
    <input type="textbox" name="Percentage" value="100" readonly/>
</form>