Comment soumettre une entrée désactivée dans ASP.NET MVC?

108

Comment soumettre une entrée désactivée dans ASP.NET MVC?

Sanchitos
la source
3
En règle générale, vous devez formuler votre question sous forme de question, puis publier la réponse séparément. Vote de clôture; vous recommandons de déplacer la partie «réponse» vers une réponse réelle.
George Stocker
1
Je crois que le message @Dhaval est exactement la réponse à cause du mot désactivé dans votre question.
QMaster le

Réponses:

160

Tu ne peux pas faire le champ readonly="readonly"au lieu de disabled="disabled"? Une valeur de champ en lecture seule sera soumise au serveur tout en restant non modifiable par l'utilisateur. Une SELECTbalise est cependant une exception.

Darin Dimitrov
la source
1
readonly fonctionne mais ne grise pas le champ. Voici un exemple que j'utilise: <%: Html.TextBoxFor(model => model.p1, new { @readonly = "readonly" }) %>comment puis-je le griser si visuellement il semble qu'il ne soit pas modifiable. Mieux encore, pouvons-nous utiliser quelque chose de similaire à LabelFor, j'ai essayé LabelFor mais il n'obtient que le DisplayName ....
VoodooChild
22
4 ans à faire .net asp et je n'ai jamais su que les entrées désactivées ne récupéraient pas les postes ... comment ça m'a passé? Incluez simplement un champ masqué pour la sélection désactivée et tout est trié (même si les identifiants sont répétés sur le formulaire, ce qui n'est pas autorisé)
Piotr Kula
5
Cela ne fonctionne pas non plus pour les type="checkbox"entrées
Nathan
1
J'essaie de faire la même chose avec les boutons radio mais la lecture seule ne semble pas fonctionner sur eux.
Randy R
38

Merci à tout le monde:

La façon dont j'ai résolu ceci:

document.getElementById("Costo").readOnly = true;
document.getElementById("Costo").style.color = "#c0c0c0";

Remarque:

J'ai eu cette information sur la réponse mais j'ai été modifiée.

Sanchitos
la source
1
Cela n'a pas tout à fait fonctionné pour moi (je l'ai compris grâce à ce lien SO ). Cela a fonctionné: textBox.Attributes.Add("readonly", "readonly");et l'explication est dans le lien
brian-d
C'est bien que vous l'ayez édité car cela a plus de sens pour moi.
Yawar
readonly semble être un chemin à parcourir. Il ne fait pas de choses étranges comme ne pas remettre le contrôle mais ne permet pas de le modifier. Merci beaucoup!
Mariusz
Pour ajouter au commentaire de Michael Brennt, si vous utilisez jQuery, la deuxième ligne devient $("#textBoxId").css("color", "#c0c0c0").
F1Krazy
30

@ppumkin l'a mentionné dans son commentaire sur cette réponse, mais je voulais le souligner car je ne pouvais pas trouver d'autres ressources sur la soumission de données d'un handicapé <select>. Je crois également que cela est pertinent pour la question car les sélections ne sont pas des <input>s mais ce sont des «entrées».

Incluez simplement un champ masqué pour la sélection désactivée et tout est trié.

Exemple:

@Html.DropDownListFor(model => model.SelectedID, ... , new { disabled = "disabled"}) @* Won't be posted back *@
@Html.HiddenFor(model => model.SelectedID) @* Will be posted back *@

Attention: cela mettra deux balises sur la page avec le même identifiant, ce qui n'est pas vraiment du HTML valide et pourrait causer des maux de tête avec javascript. Pour moi, j'ai javascript pour définir la valeur de la liste déroulante par son html id, et si vous mettez le champ caché en premier, le javascript le trouvera à la place du select.

DLeh
la source
20

En règle générale, si j'ai un champ en "lecture seule" mais qui doit être renvoyé au serveur, je rendrai l'affichage désactivé (ou simplement du texte), mais j'ajouterai ensuite un champ caché avec le même nom. Vous devez toujours vous assurer que le champ n'est pas réellement modifié côté serveur - ne le mettez pas à jour à partir du modèle dans votre action - mais l'état du modèle sera toujours précis s'il y a des erreurs.

Tvanfosson
la source
Oui, je pensais faire ce que vous proposez. Mais je devrais gérer plus de variables. J'espère que mon message apparaîtra sur Google et que les gens n'auront pas à souffrir, à la recherche d'une solution simple.
Sanchitos
4
Un problème avec votre solution est qu'elle se brise si javascript est désactivé. L'injection du champ caché côté serveur n'a pas ce problème.
tvanfosson
15

Vous pouvez également utiliser un code comme celui-ci avant l'envoi du formulaire:

$(":disabled", $('#frmMain')).removeAttr("disabled");
Dhaval Pankhaniya
la source
2
J'ai utilisé ceci, pas besoin de s'inquiéter des éléments cachés, je ne sais pas s'il y a des inconvénients, sauf peut-être un léger retard de retour en raison de la fonction js
IronHide
2
Contre de nombreuses réponses mentionnant l'utilisation de la lecture seule plutôt désactivée, je pense que dans de nombreux cas, nous devons utiliser désactivé, j'ai lu environ 15 réponses à des questions similaires et j'ai choisi cela avec son propre filtre jQuery pour sélectionner les éléments appropriés pour supprimer l'attribut désactivé, super Merci.
QMaster le
Et si vous soumettez avec Ajax.BeginForm?
markzzz
utiliser OnBegin " msdn.microsoft.com/en-us/library/... "
Dhaval Pankhaniya
1
semble un peu étrange, mais c'était la seule solution qui a fonctionné pour moi ...
AGuyCalledGerald
8

De par leur conception, les navigateurs ne prennent pas en charge cela.

Soit faites-les readonlyce qui permet de soumettre des valeurs au serveur, soit si vous avez affaire à des contrôles qui sont toujours utilisables avec des readonlyattributs tels que Select, ajoutez un style csspointer-events: none; pour les rendre non interactifs

Une sorte de hack, mais ça marche! Cela fonctionne également lorsque vous soumettez le formulaire directement avec le bouton Soumettre sans utiliser javascript. Aucun travail supplémentaire requis!

Par exemple:

<select asp-for="TypeId" 
   asp-items="@(new SelectList(await TypeRepository.FetchTypesAsync(), "TypeId", "Name"))"
   class="form-control form-control-sm" 
   readonly 
   style="pointer-events: none;">
</select>
Dave
la source
6

Vous pouvez créer un modèle d'éditeur comme celui ci-dessous

CSS

.disabled {
    background-color:lightgray;
}

Modèle d'éditeur

@model string
@Html.TextBoxFor(x => x,new {@class="disabled", @readonly=true })
Joetinger
la source
1

expansion de Tasos '(": disabled", $ (' # xxxForm ')). removeAttr ("disabled"); vous pouvez utiliser:

$("#xxxForm").submit(function (e) {
    e.preventDefault();
    var form = this;
    $('#Field1')[0].disabled = false;
    $('#Field2')[0].disabled = false;
    ...
    $('#FieldN')[0].disabled = false;
    form.submit(); // submit bypassing the jQuery bound event
});
flavior
la source
1

Cela aidera à soumettre des valeurs de modèle dans ASP.net:

$("#iD").attr("style", "pointer-events: none;background-color:rgb(220,220,220)");
Rohan
la source
1
Veuillez formater votre réponse . cela le rend plus lisible pour tout le monde
Tarick Welling
0

J'utilise généralement cette méthode pour CheckBox ou CheckBoxFor, car le désactiver entraîne la perte de la valeur. Readonly ne fonctionne pas non plus avec la case à cocher.

@Html.DisplayFor(m => m.Order.Transfer)
@Html.HiddenFor(m => m.Order.Transfer)
Mehmet Taha Meral
la source
0

Mettez simplement ce script dans les scripts @section de votre page. cela activera les entrées lorsque vous soumettez la page, et vous devez rediriger l'utilisateur vers une autre page après la soumission.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js">
$("form").submit(function () {
                    if ($('form').valid()) {
                        $("input").removeAttr("disabled");
                    }
                });
</script>

Ahmed Mahmoud AbdElbaset
la source
-3

Rendez simplement cette propriété [Obligatoire] dans le ViewModel liée à cette vue.

Kuroge
la source