web-dev-qa-db-fra.com

Les entrées de formulaire désactivées n'apparaissent pas dans la demande

J'ai quelques entrées désactivées dans un formulaire et je souhaite les envoyer à un serveur, mais Chrome les exclut de la demande. 

Existe-t-il une solution de contournement sans ajouter de champ caché? 

<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>
htmlformshttpbrowser
276
hazzik

Les éléments avec l'attribut Désactivé ne sont pas soumis ou vous pouvez dire que leurs valeurs ne sont pas publiées (voir la deuxième puce de l'étape 3 de la spécification pour la construction du jeu de données de formulaire ).

C'est à dire.,

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

Pour votre information,

  1. Les contrôles désactivés ne reçoivent pas le focus.
  2. Les contrôles désactivés sont ignorés dans la navigation par tabulation.
  3. Les contrôles désactivés ne peuvent pas être publiés avec succès.

Vous pouvez utiliser l'attribut readonly dans votre cas, ce qui vous permettra de publier les données de votre champ.

C'est à dire.,

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

Pour votre information,

  1. Les éléments en lecture seule reçoivent le focus mais ne peuvent pas être modifiés par l'utilisateur.
  2. Les éléments en lecture seule sont inclus dans la navigation par tabulation.
  3. Les éléments en lecture seule sont publiés avec succès.
623
AlphaMale

En utilisant Jquery et en envoyant les données avec ajax, vous pouvez résoudre votre problème: 

<script>

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

    //Rest of code
    })
</script>
22
LipeTuga

Pour publier les valeurs des entrées désactivées en plus des entrées activées, vous pouvez simplement réactiver toutes les entrées du formulaire lors de sa soumission.

<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>

Si vous préférez jQuery:

<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>

Pour ASP.NET MVC C # Razor, vous ajoutez le gestionnaire de soumission comme suit:

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 -->
}
6
Tom Blodget

Si vous devez absolument désactiver le champ et transmettre les données, vous pouvez utiliser un javascript pour saisir les mêmes données dans un champ masqué (ou simplement définir le champ masqué également). Cela vous permettrait de le désactiver mais de toujours publier les données même si vous publiez sur une autre page.

6
Chris Pierce

Je mets à jour cette réponse car c'est très utile. Il suffit d'ajouter en lecture seule à l'entrée.

Donc, le formulaire sera:

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

Je trouve que cela fonctionne plus facilement. en lecture seule le champ de saisie, puis appelez-le pour que l’utilisateur final sache qu’il est en lecture seule. les entrées placées ici (à partir de AJAX par exemple) peuvent toujours être soumises, sans code supplémentaire.

<input readonly style="color: Grey; opacity: 1; ">
1
Erik Robinson

Sémantiquement, cela ressemble au comportement correct

Je me demanderais " Pourquoi dois-je soumettre cette valeur? "

Si vous avez une entrée désactivée sur un formulaire, alors vous ne voulez probablement pas que l'utilisateur modifie la valeur directement

Toute valeur affichée dans une entrée désactivée doit être soit

  1. sortie d'une valeur sur le serveur qui a généré le formulaire, ou
  2. si le formulaire est dynamique, calculable à partir des autres entrées du formulaire

En supposant que le serveur qui traite le formulaire soit identique à celui qui le sert, toutes les informations permettant de reproduire les valeurs des entrées désactivées doivent être disponibles lors du traitement.

En fait, pour préserver l’intégrité des données - même si la valeur de l’entrée désactivée a été envoyée au serveur de traitement, vous devriez vraiment la valider.Cette validation nécessiterait le même niveau d'informations que vous auriez besoin de reproduire les valeurs de toute façon!

Je dirais presque que les entrées en lecture seule ne doivent pas être envoyées dans la requête 

Heureux d'être corrigé, mais tous les cas d'utilisation je peux penser à la soumission d'entrées en lecture seule/désactivées ne sont en réalité que des problèmes de style déguisés

1
Arth