Les valeurs des entrées désactivées ne seront pas soumises


224

C'est ce que j'ai trouvé par Firebug dans Firefox.

Est-ce la même chose dans les autres navigateurs?

Si oui, quelle en est la raison?


23
Vous pouvez définir un attribut "en lecture seule". Chrome, par exemple, le rend en tant que champ désactivé, mais le soumet.
peterrus

Réponses:


189

Oui, tous les navigateurs ne doivent pas soumettre les entrées désactivées, car elles sont en lecture seule.

Plus d'informations (section 17.12.1)

Définitions des attributs

désactivé [CI] Lorsqu'il est défini pour un contrôle de formulaire, cet attribut booléen désactive le contrôle pour l'entrée utilisateur. Lorsqu'il est défini, l'attribut désactivé a les effets suivants sur un élément:

  • Les contrôles désactivés ne reçoivent pas le focus.
  • Les contrôles désactivés sont ignorés dans la navigation par tabulation.
  • Les contrôles désactivés ne peuvent pas réussir.

Les éléments suivants prennent en charge l'attribut désactivé: BUTTON, INPUT, OPTGROUP, OPTION, SELECT et TEXTAREA.

Cet attribut est hérité mais les déclarations locales remplacent la valeur héritée.

Le rendu des éléments désactivés dépend de l'agent utilisateur. Par exemple, certains agents utilisateurs "grisent" les éléments de menu désactivés, les étiquettes des boutons, etc.

Dans cet exemple, l'élément INPUT est désactivé. Par conséquent, il ne peut pas recevoir de saisie utilisateur et sa valeur ne sera pas soumise avec le formulaire.

<INPUT disabled name="fred" value="stone">

Remarque. La seule façon de modifier dynamiquement la valeur de l'attribut désactivé est via un script.


86
Solution: ajoutez un <input type="hidden">élément avec le même nom / valeur que l'entrée désactivée.
John Kugelman

des informations sur quel navigateur fonctionne et lequel n'obéit pas
Allisone

82
utilisez readonly = "readonly" à la place :) voir stackoverflow.com/questions/7357256/…
Adrien Be

1
@Allisone: Firefox et Chrome semblent obéir (les entrées désactivées NE SONT PAS soumises). Je n'ai pas essayé sur d'autres navigateurs.
Adrien Be

1
@JohnKugelman pourquoi le même nom? le handicapé ne sera pas soumis de toute façon .. peut aussi bien donner le vrai nom au caché et utiliser un autre pour le handicapé
Arth

286

disabled l'entrée ne soumettra pas de données.

Utilisez l' readonlyattribut:

<input type="text" readonly />

Source ici


@FrankFang, d'accord, mais quand je passe des données au modèle de lame du collectif Laravel. Ça ne marchera pas. ne peut pas envoyer des données de cette façon.
ssi-anik

@ ssi-anik readonlyfonctionne, assurez-vous juste de passer "name" attr à l'entrée.
BenNov

26

Vous pouvez utiliser trois choses pour imiter désactivé:

  1. HTML: readonlyattribut (pour que la valeur présente en entrée puisse être utilisée lors de la soumission du formulaire. L'utilisateur ne peut pas non plus changer la valeur d'entrée)

  2. CSS: 'pointer-events':'none'(empêchant l'utilisateur de cliquer sur l'entrée)

  3. HTML: tabindex="-1"(bloquant l'utilisateur pour accéder à l'entrée depuis le clavier)


22

Ils ne sont pas soumis, car c'est ce qui est indiqué dans la spécification W3C .

17.13.2 Contrôles réussis

Un contrôle réussi est "valide" pour la soumission. [couper]

  • Les contrôles désactivés ne peuvent pas réussir.

En d'autres termes, la spécification indique que les contrôles désactivés sont considérés comme non valides et ne doivent pas être soumis.


2

Disabledles contrôles ne peuvent pas réussir et un contrôle réussi est "valide" pour la soumission. C'est la raison pour laquelle les contrôles désactivés ne sont pas soumis avec le formulaire.


1

Il y a deux attributs, à savoir readonlyet disabled, qui peuvent faire une entrée semi-en lecture seule. Mais il y a une toute petite différence entre eux.

<input type="text" readonly />
<input type="text" disabled />
  • L' readonlyattribut rend votre texte d'entrée désactivé et les utilisateurs ne peuvent plus le modifier.
  • Non seulement l' disabledattribut rendra votre texte d'entrée désactivé (inchangeable), mais il ne pourra pas non plus être soumis .

Approche jQuery (1):

$("#inputID").prop("readonly", true);
$("#inputID").prop("disabled", true);

Approche jQuery (2):

$("#inputID").attr("readonly","readonly");
$("#inputID").attr("disabled", "disabled");

Approche JavaScript:

document.getElementById("inputID").readOnly = true;
document.getElementById("inputID").disabled = true;

PS disabledet readonlysont des attributs html standard. propintroduit avec jQuery 1.6.


0

les contrôles de sélection sont toujours cliquables même en attribut en lecture seule

si vous souhaitez toujours désactiver le contrôle mais que vous souhaitez que sa valeur soit publiée. Vous pourriez envisager de créer un champ masqué. avec la même valeur que votre contrôle.

puis créez un jquery, sur certains changements

$('#your_select_id').change(function () {
    $('#your_hidden_selectid').val($('#your_select_id').val());
});
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.