¿Cómo envío una entrada deshabilitada en ASP.NET MVC?

108

¿Cómo envío una entrada deshabilitada en ASP.NET MVC?

Sanchitos
fuente
3
Por lo general, debe formular su pregunta como una pregunta y luego publicar la respuesta por separado. Votación para cerrar; le recomiendo que mueva la parte de 'respuesta' a una respuesta real.
George Stocker
1
Creo que la publicación de @Dhaval es exactamente la respuesta debido a la palabra deshabilitada en su pregunta.
QMaster

Respuestas:

160

¿No puedes hacer el campo en readonly="readonly"lugar de disabled="disabled"? Se enviará un valor de campo de solo lectura al servidor sin que el usuario lo pueda editar. Sin SELECTembargo, una etiqueta es una excepción.

Darin Dimitrov
fuente
1
readonly funciona pero no atenúa el campo. Aquí hay un ejemplo que estoy usando: <%: Html.TextBoxFor(model => model.p1, new { @readonly = "readonly" }) %>¿cómo puedo atenuarlo para que visualmente parezca que no es editable? Mejor aún, ¿podemos usar algo similar a LabelFor? Probé LabelFor pero solo obtiene el DisplayName ...
VoodooChild
22
4 años haciendo .net asp y nunca supe que las entradas deshabilitadas no se devuelven ... ¿cómo me pasó eso? Solo incluya un campo oculto para la selección de discapacitados y todo está ordenado (aunque las identificaciones se repiten en el formulario, lo que no está permitido)
Piotr Kula
5
Esto tampoco funciona para las type="checkbox"entradas
Nathan
1
Estoy tratando de hacer lo mismo con los botones de opción, pero la opción de solo lectura no parece funcionar en ellos.
Randy R
38

Gracias a todos:

La forma en que resolví esto:

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

Nota:

Obtuve esta información sobre la respuesta, pero me editaron.

Sanchitos
fuente
1
Esto no funcionó para mí (lo resolví gracias a este enlace SO ). Esto funcionó: textBox.Attributes.Add("readonly", "readonly");y la explicación está en el enlace
brian-d
Es bueno que lo hayas editado, ya que esto tiene más sentido para mí.
Yawar
readonly parece ser el camino a seguir. No hace cosas raras como no volver a colocar el control, pero no permite editarlo. ¡Muchas gracias!
Mariusz
Para agregar al comentario de Michael Brennt, si está usando jQuery, la segunda línea se convierte en $("#textBoxId").css("color", "#c0c0c0").
F1Krazy
30

@ppumkin mencionó esto en su comentario sobre esta respuesta, pero quería resaltarlo porque no pude encontrar otros recursos sobre el envío de datos de un discapacitado <select>. También creo que es relevante para la pregunta, ya que las selecciones no son <input>s, pero son "entradas".

Solo incluye un campo oculto para la selección deshabilitada y todo está ordenado.

Ejemplo:

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

Precaución: esto colocará dos etiquetas en la página con el mismo ID, que no es HTML realmente válido y podría causar dolores de cabeza con javascript. Para mí, tengo javascript para establecer el valor del menú desplegable por su html id, y si pones el campo oculto primero, el javascript lo encontrará en lugar de select.

DLeh
fuente
20

Por lo general, si tengo un campo que es de "solo lectura" pero debe enviarse de nuevo al servidor, desactivaré la visualización (o simplemente texto), pero luego agregaré un campo oculto con el mismo nombre. Aún debe asegurarse de que el campo no se modifique realmente en el lado del servidor, simplemente no lo actualice desde el modelo en su acción, pero el estado del modelo seguirá siendo preciso si hay errores.

tvanfosson
fuente
Sí, estaba pensando en hacer lo que sugieres. Pero tendría que manejar más variables. Espero que mi publicación aparezca en google y la gente no tenga que sufrir, buscando una solución fácil.
Sanchitos
4
Un problema con su solución es que se rompe si JavaScript está desactivado. Inyectar el campo oculto del lado del servidor no tiene este problema.
tvanfosson
15

También puede usar un código como este antes de que se envíe el formulario:

$(":disabled", $('#frmMain')).removeAttr("disabled");
Dhaval Pankhaniya
fuente
2
Usé esto, no necesito preocuparme por los elementos ocultos, no estoy seguro de si hay alguna desventaja, excepto tal vez un ligero retraso en la publicación debido a la función js
IronHide
2
En contra de muchas de las respuestas que mencionaron el uso de solo lectura en lugar de discapacitados, creo que en muchos casos debemos usar discapacitados, leí alrededor de 15 respuestas en preguntas similares y elegí esto solo con el filtro jQuery propio para seleccionar los elementos apropiados para eliminar el atributo desactivado, excelente Gracias.
QMaster
¿Qué pasa si se envía con Ajax.BeginForm?
Markzzz
use OnBegin " msdn.microsoft.com/en-us/library/… "
Dhaval Pankhaniya
1
parece un poco extraño, pero fue la única solución que funcionó para mí ...
AGuyCalledGerald
8

Por diseño, los navegadores no lo admiten.

Hágalos, lo readonlyque permite enviar valores al servidor o si está tratando con controles que aún se pueden usar con readonlyatributos como Seleccionar, agregue un estilo CSS pointer-events: none;para que no sean interactivos

Es una especie de truco, ¡pero funciona! También funciona cuando envía un formulario directamente con el botón Enviar sin usar javascript. ¡No se requiere trabajo adicional!

P.ej:

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

Puede crear una plantilla de editor como la siguiente

CSS

.disabled {
    background-color:lightgray;
}

Plantilla de editor

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

expandiendo Tasos '(": disabled", $ (' # xxxForm ')). removeAttr ("disabled"); puedes usar:

$("#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
});
sabor
fuente
1

Esto ayudará a enviar los valores del modelo en ASP.net:

$("#iD").attr("style", "pointer-events: none;background-color:rgb(220,220,220)");
Rohan
fuente
1
Por favor, formatear su respuesta . esto lo hace más legible para todos
Tarick Welling
0

Por lo general, uso esta forma para CheckBox o CheckBoxFor porque desactivarlo hace que se pierda el valor. Readonly tampoco funciona en la casilla de verificación.

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

Simplemente coloque este script en @section scripts en su página. esto habilitará las entradas cuando envíe la página, y debe redirigir al usuario a otra página después de enviarla.

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

Simplemente haga que esa propiedad sea [Obligatoria] en el ViewModel vinculado a esa vista.

Kuroge
fuente