Establecer un valor de variable de formulario antes de enviar

Question

Tengo una página donde puede ver la información de un hotel. En esta página hay un pequeño formulario para buscar disponibilidad de habitaciones para la página del hotel en la que se encuentra.

<form id="form1" name="form1" action="search.asp" method="POST"> 
    <input type="hidden" id="Hotel" name="Hotel" value="<%= HotelID %>"> 

    Arrive: <input value="<% strURLBookingDate %>" type="text" id="ArrivalDate" name="ArrivalDate">        
    Depart: <input value="<% strURLBookingDate2 %>" type="text" id="DepartureDate" name="DepartureDate"> 

    <input type="submit" name="btnHotelSearch" value="Search This Hotel"> 
    <input type="submit" name="btnHotelSearchAll" value="Search All Hotels">       
</form> 

Pero también es necesario añadir un botón a la forma que me permita en todos los hoteles si hago clic en él. Para que eso suceda, solo necesito establecer el valor de entrada oculto llamado "Hotel" en 0 cuando se hace clic en el botón.

¿Cómo puedo establecer ese valor oculto antes de enviar el formulario cuando hago clic en btnHotelSearchAll?

Answer 1

Usted puede enlazar el evento click en btnHotelSearchAll y luego rellenar el valor:

document.getElementById("btnHotelSearchAll").onclick = function() { 
    document.getElementById("Hotel").value = "0"; 
}; 

estar absolutamente seguro de que hay nada otro lugar de la página que tiene ya sea la id o name "Hotel", y que no tiene ninguna variable global que haya declarado con ese nombre, porque algunas versiones de IE have bugs combinan los valores name y los nombres de variables globales en el espacio de nombres que usan para document.getElementById. O, alternativamente, haga que el id en el campo oculto sea un poco más único (el name puede permanecer como está, para que no tenga que cambiar el servidor; el id es solo del lado del cliente, el name es lo que se envía al servidor) Por ejemplo, se puede hacer esto:

<input type="hidden" id="HotelField" name="Hotel" value="<%= HotelID %>"> 
          ^

y luego cambiar el código un poco:

document.getElementById("btnHotelSearchAll").onclick = function() { 
    document.getElementById("HotelField").value = "0"; 
    //       ^
}; 

---

actualización:

Tenga en cuenta que el código para conectar el botón debe Ejecute después de el botón se ha puesto en el DOM. Así que con el código anterior, que significa asegurarse de que el bloque de script es el siguiente formulario en la página, así:

<form ...> 
.... 
</form> 
... 
<script> 
... 
</script> 

Si el bloque es script por encima de la tecla, entonces no existirá el botón sin embargo, a partir de cuando se ejecuta el script. Esta es una de las razones por las que a menudo es mejor colocar scripts al final del elemento body, justo antes de la etiqueta de cierre </body> (more here).

Si realmente desea que el botón de la secuencia de comandos anterior , usted tiene que retrasar la llamada por lo que es un manejador de onload evento o ese tipo de cosas. Pero window.onloadmuy muy tarde en el proceso de una carga de página (espera todas las imágenes y otros activos para cargar, por ejemplo), mucho después de que los usuarios puedan interactuar con su formulario, por lo general es mejor hacerlo antes. .

---

fuera de tema: Mi nota estándar que una gran cantidad de este material se hace más temprano y más robusto mediante el uso de una biblioteca JavaScript decente como jQuery, Prototype, YUI, Closure o any of several others. jQuery, por ejemplo, se ocupará de los errores de IE en document.getElementById para que no tenga que preocuparse por el problema de fusión.

Answer 2

Si desea utilizar jQuery, intente lo siguiente.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" ></script> 

<script type="text/javascript" > 
$(function(){ 
    $('#btnHotelSearch').click(function(){ 
    $('#Hotel').val(0); 
    }); 
}); 
</script> 

Answer 3

usando onclick atributo para llamar función javascript que establecerá el valor del campo oculto

<input type="submit" name="btnHotelSearchAll" value="Search All Hotels" onclick="SetHotelID();"> 

<script> 
    function SetHotelID() 
    { 
     $('#Hotel').val('0'); 
    } 
</script> 

Nota estoy usando Jquery

Answer 4

Aquí tiene, hágamelo saber si esto funciona. ..

<form id="form1" name="form1" action="" method="POST"> 
<input type="hidden" id="Hotel" name="Hotel" value="<%= HotelID %>"> 

Arrive: <input value="<% strURLBookingDate %>" type="text" id="ArrivalDate" name="ArrivalDate">        
Depart: <input value="<% strURLBookingDate2 %>" type="text" id="DepartureDate" name="DepartureDate"> 

<input type="submit" name="btnHotelSearch" value="Search This Hotel"> 
<input type="submit" name="btnHotelSearchAll" value="Search All Hotels" onclick='document.getElementById("Hotel").value="0"'>