after - set value input hidden jquery
Establecer el valor del campo oculto en un formulario usando ".val()" de jQuery no funciona (15)
He intentado establecer el valor de un campo oculto en un formulario usando jQuery, pero sin éxito.
Aquí hay un código de muestra que explica el problema. Si mantengo el tipo de entrada en "texto", funciona sin ningún problema. ¡Pero, cambiar el tipo de entrada a "oculto", no funciona!
<html>
<head>
<script type="text/javascript" src="jquery.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$("button").click(function() {
$("input:text#texens").val("tinkumaster");
});
});
</script>
</head>
<body>
<p>
Name:
<input type="hidden" id="texens" name="user" value="texens" />
</p>
<button>
Change value for the text field
</button>
</body>
</html>
También probé la siguiente solución, estableciendo el tipo de entrada en "texto" y luego usando un estilo "mostrar: ninguno" para el cuadro de entrada. ¡Pero esto también falla! Parece que jQuery tiene algunos problemas para configurar campos de entrada ocultos o invisibles.
¿Algunas ideas? ¿Hay alguna solución para esto que realmente funcione?
.val no funcionó para mí, porque estoy agarrando el lado del servidor del atributo de valor y el valor no siempre se actualizó. entonces usé:
var counter = 0;
$(''a.myClickableLink'').click(function(event){
event.preventDefault();
counter++;
...
$(''#myInput'').attr(''value'', counter);
}
Espero que ayude a alguien.
Alguien más que esté luchando con esto, hay una manera "en línea" muy simple de hacer esto con jQuery:
<input type="search" placeholder="Search" value="" maxlength="256" id="q" name="q" style="width: 300px;" onChange="$(''#ADSearch'').attr(''value'', $(''#q'').attr(''value''))"><input type="hidden" name="ADSearch" id="ADSearch" value="">
Esto establece el valor del campo oculto a medida que el texto se escribe en la entrada visible usando el evento onChange. Útil (como en mi caso) en el que desea pasar un valor de campo a un formulario de "Búsqueda avanzada" y no forzar al usuario a volver a escribir su consulta de búsqueda.
El uso de val() no funcionó para mí. Tuve que usar .attr() todas partes. También tenía diferentes tipos de entradas y tenía que ser bastante explícito en el caso de las casillas de verificación y los menús seleccionados.
Actualizar el campo de texto
$(''#model_name'').attr(''value'',nameVal);
Actualizar imagen al lado de entrada de archivo
$(''#img-avatar'').attr(''src'', avatarThumbUrl);
Actualizar booleano
if (isActive) {
$(''#model_active'').attr(''checked'',"checked");
} else {
$(''#model_active'').attr(''checked'', null) ;
}
Actualizar seleccionar (con número o cadena)
$(''#model_framerate'').children().each(function(i, el){
var v = $(el).val();
if (v === String(framerateVal)) {
$(el).attr(''selected'',''selected'');
} else {
$(el).attr(''selected'',null);
}
}
En mi caso, estaba usando un no-string (integer) como el parámetro de val () que no funciona, el truco es tan simple como
$("#price").val('''' + price);
En realidad, este es un problema continuo. Si bien Andy tiene razón acerca de la fuente descargada, .val (...) y .attr (''valor'', ...) no parecen modificar realmente el html. Creo que este es un problema de JavaScript y no un problema de jquery. Si hubieras usado firebug, incluso tú habrías tenido la misma pregunta. Si bien parece que si envía el formulario con los valores modificados, el html no cambiará. Me encontré con este problema tratando de crear una vista previa de impresión del formulario modificado (haciendo [formulario] .html ()) copia todo bien, incluidos todos los cambios, excepto los cambios de valores. Por lo tanto, mi vista previa de impresión modal es algo inútil ... mi solución puede tener que ser ''compilar'' un formulario oculto que contenga los valores que han agregado, o generar la vista previa de forma independiente y hacer que cada modificación que hace el usuario también modifique la vista previa. Ambos son inóptimos, pero a menos que alguien descubra por qué el comportamiento de configuración de valores no cambia el html (en el DOM que estoy asumiendo) tendrá que hacer.
Estaba teniendo el mismo problema, y descubrí lo que estaba mal. Tenía el HTML definido como
<form action="url" method="post">
<input type="hidden" id="email" />
<form>
<script>
function onsomeevent()
{
$("#email").val("[email protected]");
}
</script>
La lectura de los valores de formulario en el servidor siempre daba como resultado que el correo electrónico estuviera vacío. Después de rascarme la cabeza (y numerosas búsquedas), me di cuenta de que el error no era definir la forma / entrada correctamente. Al modificar la entrada (como se muestra a continuación), funcionó como un encanto
<input type="hidden" id="email" name="email" />
Agregando a este hilo en caso de que otros tengan el mismo problema.
Finalmente, he encontrado una solución y es simple:
document.getElementById("texens").value = "tinkumaster";
Funciona de maravilla. No hay idea de por qué jQuery no recurre a esto.
Otro gotcha aquí perdí algo de mi tiempo, así que pensé que pasaría la punta. Tenía un campo oculto. Di una identificación que tenía. y [] corchetes en el nombre (debido al uso con struts2) y el selector $("#model.thefield[0]") no encontrarían mi campo oculto. Renombrar el ID para no usar los puntos y corchetes hizo que el selector comenzara a funcionar. Así que al final terminé con una identificación de model_the_field_0 y el selector funcionó bien.
Si tiene problemas para establecer el valor de un campo oculto porque le está pasando una identificación, esta es la solución:
En lugar de $("#hidden_field_id").val(id) simplemente haga $("input[id=hidden_field_id]").val(id) . No estoy seguro de cuál es la diferencia, pero funciona.
Tuve el mismo problema curiosamente Google Chrome y posiblemente otros (no estoy seguro) no me gustó
$("#thing").val(0);
input type="hidden" id="thing" name="thing" value="1" />
(ningún cambio)
$("#thing").val("0");
input type="hidden" id="thing" name="thing" value="1" />
(ningún cambio)
pero esto funciona !!!!
$("#thing").val("no");
input type="hidden" id="thing" name="thing" value="no" />
¡CAMBIOS!
$("#thing").val("yes");
input type="hidden" id="thing" name="thing" value="yes" />
¡CAMBIOS!
debe ser una "cosa de cuerda"
Usando ID:
$(''input:hidden#texens'').val(''tinkumaster'');
Usando clase:
$(''input:hidden.many_texens'').val(''tinkumaster'');
:text fallará para una entrada con un valor de tipo hidden . También es mucho más eficiente simplemente usar:
$("#texens").val("tinkumaster");
Los atributos de ID deben ser únicos en una página web, asegúrese de que sean los suyos, ya que esto puede contribuir a cualquier problema que tenga, y especificar un selector más complicado solo ralentiza las cosas y no se ve tan limpio.
Ejemplo en http://jsbin.com/elovo/edit , usando su código de ejemplo en http://jsbin.com/elovo/2/edit
Simplemente use la sintaxis a continuación get y set
OBTENER
//Script
var a = $("#selectIndex").val();
aquí una variable mantendrá el valor de hiddenfield (selectindex)
Lado del servidor
<asp:HiddenField ID="selectIndex" runat="server" Value="0" />
CONJUNTO
var a =10;
$("#selectIndex").val(a);
$(''input[name=hidden_field_name]'').val(''newVal'');
funcionó para mí, cuando ninguno
$(''input[id=hidden_field_id]'').val(''newVal'');
ni
$(''#hidden_field_id'').val(''newVal'');
hizo.
<javascript>
slots=''''; hidden=''''; basket = 0;
cost_per_slot = $("#cost_per_slot").val();
//cost_per_slot = parseFloat(cost_per_slot).toFixed(2)
for (i=0; i< check_array.length; i++) {
slots += check_array[i] + ''/r/n'';
hidden += check_array[i].substring(0, 8) + ''|'';
basket = (basket + parseFloat(cost_per_slot));
}
// Populate the Selected Slots section
$("#selected_slots").html(slots);
// Update hidden slots_booked form element with booked slots
$("#slots_booked").val(hidden);
// Update basket total box
basket = basket.toFixed(2);
$("#total").html(basket);