Foros del Web » Creando para Internet » HTML »

ayuda con formulario

 Estas en el tema de ayuda con formulario en el foro de HTML en Foros del Web. Hice un formulario para reservas de un hotel, funciona en el dreamweaver pero no en IE, cual puede ser el problema Código: <!DOCTYPE html PUBLIC ...
  #1 (permalink)  
Antiguo 19/06/2010, 20:32
 
Fecha de Ingreso: junio-2010
Mensajes: 5
Antigüedad: 13 años, 10 meses
Puntos: 0
ayuda con formulario
Hice un formulario para reservas de un hotel, funciona en el dreamweaver pero no en IE, cual puede ser el problema


Código: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>


<!-- Suma -->
<script type="text/javascript"> 
function Sumar(){ 
interval = setInterval("calcular()",1); 
} 
function calcular(){ 
uno = document.autoSumForm.Simple.value;
dos = document.autoSumForm.Doble.value;
tres = document.autoSumForm.Matrimonial.value;
cuatro = document.autoSumForm.Familiar.value;
cinco = document.autoSumForm.Adicional.value;
seis = document.autoSumForm.Noches.value;
siete = document.autoSumForm.subtotal.value;

document.autoSumForm.subtotal.value = (uno * 30) + (dos * 50) + (tres * 50) + (cuatro * 70) + (cinco * 20); 
document.autoSumForm.total.value = (siete * 1) * (seis * 1); 

} 
function NoSumar(){ 
clearInterval(interval); 
} 
</script> 
<!-- Fin suma -->

<form id="autoSumForm" name="autoSumForm" method="post" action="Reservar.php">
      <h2>Datos Personales </h2>
      <table width="600" border="0" align="center">
        <tr>
          <td align="right">Nombres y Apellidos: </td>
          <td align="left"> <label> 
          
          <input name="nombre" type="text" id="nombre" size="31" />
          
        </label></td>
        </tr>
        <tr>
          <td align="right">Pais de Origen: </td>
          <td align="left"><label> 
          
          <input name="pais" type="text" id="pais" size="31" />
          
        </label></td>
        </tr>
        <tr>
          <td align="right">Documento de identidad: </td>
          <td align="left"> <label> 
          
          <input name="passport" type="text" id="passport" size="31" />
          
        </label></td>
        </tr>
        <tr>
          <td align="right">Fecha de Nacimiento (dd/mm/aaaa): </td>
          <td align="left"><label> 
          
          <input name="nacimiento" type="text" id="nacimiento" size="31" />
          
        </label></td>
        </tr>
        <tr>
          <td align="right">Telefono de Contacto: </td>
          <td align="left"><label> 
          
          <input name="telefono" type="text" id="telefono" size="31" />
          
        </label></td>
        </tr>
        <tr>
          <td align="right">Correo electrónico: </td>
          <td align="left"> <label> 
          
          <input name="email" type="text" id="email" size="31" />
          
        </label></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td align="left">&nbsp;</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td align="left">&nbsp;</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td align="left">&nbsp;</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td align="left">&nbsp;</td>
        </tr>
      </table>
      <h2> 
        
        Datos de Reserva</h2>
      <h5>&nbsp;</h5>
      <table width="600" border="0">
  <tr>
          <td width="150">Habitacion Simple</td>
          <td width="150">Habitacion Doble</td>
          <td width="150">Habitacion Matrimonial</td>
          <td width="150">Habitacion Familiar</td>
          <td width="150">Cama adicional</td>
          <td>Número de noches</td>
    </tr>
  <tr>
          <td><label>
            <select name="Simple" id="Simple" onfocus="Sumar();" onblur="NoSumar();">
              <option>0</option>
              <option>1</option>
              <option>2</option>
              <option>3</option>
              <option>4</option>
              <option>5</option>
              <option>6</option>
              <option>7</option>
              <option>8</option>
              <option>9</option>
              <option>10</option>
              </select>
            </label></td>
    <td> <label>
      <select name="Doble" id="Doble" onfocus="Sumar();" onblur="NoSumar();">
        <option>0</option>
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        <option>5</option>
        <option>6</option>
        <option>7</option>
        <option>8</option>
        <option>9</option>
        <option>10</option>
        </select>
      </label></td>
    <td><label>
      <select name="Matrimonial" id="Matrimonial" onfocus="Sumar();" onblur="NoSumar();">
        <option>0</option>
        <option>1</option>
        <option>2</option>
        <option>3</option>
      </select>
      </label></td>
    <td><label>
      <select name="Familiar" id="Familiar" onfocus="Sumar();" onblur="NoSumar();">
        <option>0</option>
        <option>1</option>
        <option>2</option>
</select>
      </label></td>
    <td> <label>
      <select name="Adicional" id="Adicional" onfocus="Sumar();" onblur="NoSumar();">
        <option>0</option>
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        </select>
      </label></td>
    <td><select name="Noches" id="Noches" onfocus="Sumar();" onblur="NoSumar();">
      <option selected="selected">1</option>
      <option>2</option>
      <option>3</option>
      <option>5</option>
      <option>6</option>
      <option>7</option>
      <option>8</option>
      <option>9</option>
      <option>10</option>
    </select></td>
    </tr>
  <tr>
    <td colspan="2">&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><input name="subtotal" type="text" class="cajon" id="subtotal" /></td>
    <td><input name="total" type="text" class="cajon" id="total" /></td>
  </tr>
  <tr>
    <td colspan="3">&nbsp;</td>
    <td colspan="3">&nbsp;</td>
    </tr>
  <tr>
    <td colspan="3">&nbsp;</td>
    <td colspan="3">&nbsp;</td>
    </tr>
  <tr>
    <td colspan="3">&nbsp;</td>
    <td colspan="3">&nbsp;</td>
  </tr>
  <tr>
    <td colspan="6">&nbsp;</td>
  </tr>
  <tr>
    <td colspan="6"><select name='arrival_day' onchange='triggerDates(document.searchAgain.arrival_day[document.searchAgain.arrival_day.selectedIndex].value, document.searchAgain.arrival_month[document.searchAgain.arrival_month.selectedIndex].value,document.searchAgain.arrival_year[document.searchAgain.arrival_year.selectedIndex].value)'>
      <option value='1'>01</option>
      <option value='2'>02</option>
      <option value='3'>03</option>
      <option value='4'>04</option>
      <option value='5'>05</option>
      <option value='6'>06</option>
      <option value='7'>07</option>
      <option value='8'>08</option>
      <option value='9'>09</option>
      <option value='10'>10</option>
      <option value='11'>11</option>
      <option value='12'>12</option>
      <option value='13'>13</option>
      <option value='14' selected="selected">14</option>
      <option value='15'>15</option>
      <option value='16'>16</option>
      <option value='17'>17</option>
      <option value='18'>18</option>
      <option value='19'>19</option>
      <option value='20'>20</option>
      <option value='21'>21</option>
      <option value='22'>22</option>
      <option value='23'>23</option>
      <option value='24'>24</option>
      <option value='25'>25</option>
      <option value='26'>26</option>
      <option value='27'>27</option>
      <option value='28'>28</option>
      <option value='29'>29</option>
      <option value='30'>30</option>
      <option value='31'>31</option>
    </select>
      <select name='arrival_month' onchange='triggerDates(document.searchAgain.arrival_day[document.searchAgain.arrival_day.selectedIndex].value, document.searchAgain.arrival_month[document.searchAgain.arrival_month.selectedIndex].value,document.searchAgain.arrival_year[document.searchAgain.arrival_year.selectedIndex].value)'>
        <option value='0'>Jan</option>
        <option value='1'>Feb</option>
        <option value='2'>Mar</option>
        <option value='3'>Apr</option>
        <option value='4'>May</option>
        <option value='5' selected="selected">Jun</option>
        <option value='6'>Jul</option>
        <option value='7'>Aug</option>
        <option value='8'>Sep</option>
        <option value='9'>Oct</option>
        <option value='10'>Nov</option>
        <option value='11'>Dec</option>
      </select>
      <select name='arrival_year' onchange='triggerDates(document.searchAgain.arrival_day[document.searchAgain.arrival_day.selectedIndex].value, document.searchAgain.arrival_month[document.searchAgain.arrival_month.selectedIndex].value,document.searchAgain.arrival_year[document.searchAgain.arrival_year.selectedIndex].value)'>
        <option value='2010' selected="selected">2010</option>
        <option value='2011'>2011</option>
        <option value='2012'>2012</option>
        <option value='2013'>2013</option>
      </select></td>
  </tr>
  <tr>
    <td colspan="6">Comentarios adicionales:</td>
  </tr>
  <tr>
    <td colspan="6"><textarea name="mensaje" id="mensaje" rows="5" cols="25"></textarea> </td>
    </tr>
      </table>
      <br>
        <br/> 
        
        
        
        <br />
        <br />
        <label>
          <input type="submit" name="Submit" value="Reservar ahora" /> 
        </label>
      
        </p>
    </form>
</body>
</html>
  #2 (permalink)  
Antiguo 19/06/2010, 21:10
Avatar de Anon722  
Fecha de Ingreso: noviembre-2009
Mensajes: 58
Antigüedad: 14 años, 5 meses
Puntos: 0
Respuesta: ayuda con formulario
El WYSIWYG en realidad no es tal.

Te conviene no confiarte en el display de dreamweaver y seguir las especificaciones del W3C.
  #3 (permalink)  
Antiguo 20/06/2010, 05:28
Avatar de _cronos2
Colaborador
  
Fecha de Ingreso: junio-2010
Mensajes: 2.062
Antigüedad: 13 años, 10 meses
Puntos: 310
Respuesta: ayuda con formulario
Hay errores y hay redundancias, voy a comentarl@s:

Código Javascript: 
Ver original
  1. <script type="text/javascript"> 
  2.  function Sumar(){ 
  3.   interval = setInterval("calcular()",500);//esto va con milisegundos, con medio segundo te vale, si no se ralentiza 
  4.  } 
  5.  function calcular(){ 
  6.   uno = document.autoSumForm.Simple.value;
  7.   dos = document.autoSumForm.Doble.value;
  8.   tres = document.autoSumForm.Matrimonial.value;
  9.   cuatro = document.autoSumForm.Familiar.value;
  10.   cinco = document.autoSumForm.Adicional.value;
  11.   seis = document.autoSumForm.Noches.value;
  12.   siete = document.autoSumForm.subtotal.value;
  13.   document.autoSumForm.subtotal.value = uno * 30 + dos * 50 + tres * 50 + cuatro * 70 + cinco * 20;//todos estos paréntesis sobran 
  14.   document.autoSumForm.total.value = siete *seis ;//¿por qué lo multiplicas por 1? 
  15.  } 
  16.  function NoSumar(){ 
  17.   clearInterval(interval); 
  18.  } 
  19. </script>

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Untitled Document</title>
  6. </head>
  7. <body>
  8. <form id="autoSumForm" name="autoSumForm" method="post" action="Reservar.php">
  9.       <h2>Datos Personales </h2>
  10.       <table width="600" border="0" align="center">
  11.         <tr>
  12.           <td align="right">Nombres y Apellidos: </td>
  13.           <td align="left"> <label> 
  14.           
  15.           <input name="nombre" type="text" id="nombre" size="31" />
  16.           
  17.         </label></td>
  18.         </tr>
  19.         <tr>
  20.           <td align="right">Pa&iacute;s de Origen: </td>
  21.           <td align="left"><label> 
  22.           
  23.           <input name="pais" type="text" id="pais" size="31" />
  24.           
  25.         </label></td>
  26.         </tr>
  27.         <tr>
  28.           <td align="right">Documento de identidad: </td>
  29.           <td align="left"> <label> 
  30.           
  31.           <input name="passport" type="text" id="passport" size="31" />
  32.           
  33.         </label></td>
  34.         </tr>
  35.         <tr>
  36.           <td align="right">Fecha de Nacimiento (dd/mm/aaaa): </td>
  37.           <td align="left"><label> 
  38.           
  39.           <input name="nacimiento" type="text" id="nacimiento" size="31" />
  40.           
  41.         </label></td>
  42.         </tr>
  43.         <tr>
  44.           <td align="right">Tel&eacute;fono de Contacto: </td>
  45.           <td align="left"><label> 
  46.           
  47.           <input name="telefono" type="text" id="telefono" size="31" />
  48.           
  49.         </label></td>
  50.         </tr>
  51.         <tr>
  52.           <td align="right">Correo electr&oacute;nico: </td>
  53.           <td align="left"> <label> 
  54.           
  55.           <input name="email" type="text" id="email" size="31" />
  56.           
  57.         </label></td>
  58.         </tr>
  59.         <tr>
  60.           <td>&nbsp;</td>
  61.           <td align="left">&nbsp;</td>
  62.         </tr>
  63.         <tr>
  64.           <td>&nbsp;</td>
  65.           <td align="left">&nbsp;</td>
  66.         </tr>
  67.         <tr>
  68.           <td>&nbsp;</td>
  69.           <td align="left">&nbsp;</td>
  70.         </tr>
  71.         <tr>
  72.           <td>&nbsp;</td>
  73.           <td align="left">&nbsp;</td>
  74.         </tr>
  75.       </table>
  76.       <h2> 
  77.         
  78.         Datos de Reserva</h2>
  79.       <h5>&nbsp;</h5>
  80.       <table width="600" border="0">
  81.   <tr>
  82.           <td width="150">Habitaci&oacute;n Simple</td>
  83.           <td width="150">Habitaci&oacute;n Doble</td>
  84.           <td width="150">Habitaci&oacute;n Matrimonial</td>
  85.           <td width="150">Habitaci&oacute;n Familiar</td>
  86.           <td width="150">Cama adicional</td>
  87.           <td>N&uacute;mero de noches</td>
  88.     </tr>
  89.   <tr>
  90.           <td><label>
  91.  
  92. <!--necesitas un onchange, para que cada vez que cambie te coja el valor-->
  93. <!---además tienes que darle un value a cada option, sino no sirve de nada sumar--> 
  94.             <select name="Simple" id="Simple" onchange="Sumar();">
  95.               <option>0</option>
  96.               <option>1</option>
  97.               <option>2</option>
  98.               <option>3</option>
  99.               <option>4</option>
  100.               <option>5</option>
  101.               <option>6</option>
  102.               <option>7</option>
  103.               <option>8</option>
  104.               <option>9</option>
  105.               <option>10</option>
  106.               </select>
  107.             </label></td>
  108.     <td> <label>
  109.       <select name="Doble" id="Doble" onchange="Sumar();">
  110.         <option>0</option>
  111.         <option>1</option>
  112.         <option>2</option>
  113.         <option>3</option>
  114.         <option>4</option>
  115.         <option>5</option>
  116.         <option>6</option>
  117.         <option>7</option>
  118.         <option>8</option>
  119.         <option>9</option>
  120.         <option>10</option>
  121.         </select>
  122.       </label></td>
  123.     <td><label>
  124.       <select name="Matrimonial" id="Matrimonial" onchange="Sumar();">
  125.         <option>0</option>
  126.         <option>1</option>
  127.         <option>2</option>
  128.         <option>3</option>
  129.       </select>
  130.       </label></td>
  131.     <td><label>
  132.       <select name="Familiar" id="Familiar" onchange="Sumar();">
  133.         <option>0</option>
  134.         <option>1</option>
  135.         <option>2</option>
  136. </select>
  137.       </label></td>
  138.     <td> <label>
  139.       <select name="Adicional" id="Adicional" onchange="Sumar();">
  140.         <option>0</option>
  141.         <option>1</option>
  142.         <option>2</option>
  143.         <option>3</option>
  144.         <option>4</option>
  145.         </select>
  146.       </label></td>
  147.     <td><select name="Noches" id="Noches" onchange="Sumar();">
  148.       <option selected="selected">1</option>
  149.       <option>2</option>
  150.       <option>3</option>
  151.       <option>5</option>
  152.       <option>6</option>
  153.       <option>7</option>
  154.       <option>8</option>
  155.       <option>9</option>
  156.       <option>10</option>
  157.     </select></td>
  158.     </tr>
  159.   <tr>
  160.     <td colspan="2">&nbsp;</td>
  161.     <td>&nbsp;</td>
  162.     <td>&nbsp;</td>
  163.     <td><input name="subtotal" type="text" class="cajon" id="subtotal" /></td>
  164.     <td><input name="total" type="text" class="cajon" id="total" /></td>
  165.   </tr>
  166.   <tr>
  167.     <td colspan="3">&nbsp;</td>
  168.     <td colspan="3">&nbsp;</td>
  169.     </tr>
  170.   <tr>
  171.     <td colspan="3">&nbsp;</td>
  172.     <td colspan="3">&nbsp;</td>
  173.     </tr>
  174.   <tr>
  175.     <td colspan="3">&nbsp;</td>
  176.     <td colspan="3">&nbsp;</td>
  177.   </tr>
  178.   <tr>
  179.     <td colspan="6">&nbsp;</td>
  180.   </tr>
  181.   <tr>
  182.     <td colspan="6"><select name='arrival_day' onchange='triggerDates(document.searchAgain.arrival_day[document.searchAgain.arrival_day.selectedIndex].value, document.searchAgain.arrival_month[document.searchAgain.arrival_month.selectedIndex].value,document.searchAgain.arrival_year[document.searchAgain.arrival_year.selectedIndex].value)'>
  183.       <option value='1'>01</option>
  184.       <option value='2'>02</option>
  185.       <option value='3'>03</option>
  186.       <option value='4'>04</option>
  187.       <option value='5'>05</option>
  188.       <option value='6'>06</option>
  189.       <option value='7'>07</option>
  190.       <option value='8'>08</option>
  191.       <option value='9'>09</option>
  192.       <option value='10'>10</option>
  193.       <option value='11'>11</option>
  194.       <option value='12'>12</option>
  195.       <option value='13'>13</option>
  196.       <option value='14' selected="selected">14</option>
  197.       <option value='15'>15</option>
  198.       <option value='16'>16</option>
  199.       <option value='17'>17</option>
  200.       <option value='18'>18</option>
  201.       <option value='19'>19</option>
  202.       <option value='20'>20</option>
  203.       <option value='21'>21</option>
  204.       <option value='22'>22</option>
  205.       <option value='23'>23</option>
  206.       <option value='24'>24</option>
  207.       <option value='25'>25</option>
  208.       <option value='26'>26</option>
  209.       <option value='27'>27</option>
  210.       <option value='28'>28</option>
  211.       <option value='29'>29</option>
  212.       <option value='30'>30</option>
  213.       <option value='31'>31</option>
  214.     </select>
  215.       <select name='arrival_month' onchange='triggerDates(document.searchAgain.arrival_day[document.searchAgain.arrival_day.selectedIndex].value, document.searchAgain.arrival_month[document.searchAgain.arrival_month.selectedIndex].value,document.searchAgain.arrival_year[document.searchAgain.arrival_year.selectedIndex].value)'>
  216.         <option value='0'>Jan</option>
  217.         <option value='1'>Feb</option>
  218.         <option value='2'>Mar</option>
  219.         <option value='3'>Apr</option>
  220.         <option value='4'>May</option>
  221.         <option value='5' selected="selected">Jun</option>
  222.         <option value='6'>Jul</option>
  223.         <option value='7'>Aug</option>
  224.         <option value='8'>Sep</option>
  225.         <option value='9'>Oct</option>
  226.         <option value='10'>Nov</option>
  227.         <option value='11'>Dec</option>
  228.       </select>
  229.       <select name='arrival_year' onchange='triggerDates(document.searchAgain.arrival_day[document.searchAgain.arrival_day.selectedIndex].value, document.searchAgain.arrival_month[document.searchAgain.arrival_month.selectedIndex].value,document.searchAgain.arrival_year[document.searchAgain.arrival_year.selectedIndex].value)'>
  230.         <option value='2010' selected="selected">2010</option>
  231.         <option value='2011'>2011</option>
  232.         <option value='2012'>2012</option>
  233.         <option value='2013'>2013</option>
  234.       </select></td>
  235.   </tr>
  236.   <tr>
  237.     <td colspan="6">Comentarios adicionales:</td>
  238.   </tr>
  239.   <tr>
  240.     <td colspan="6"><textarea name="mensaje" id="mensaje" rows="5" cols="25"></textarea> </td>
  241.     </tr>
  242.       </table>
  243.       <br>
  244.         <br/> 
  245.         
  246.         
  247.         
  248.         <br />
  249.         <br />
  250.         <label>
  251.           <input type="submit" name="Submit" value="Reservar ahora" /> 
  252.         </label>
  253.       
  254.         </p>
  255.     </form>
  256. </body>
  257. </html>
  #4 (permalink)  
Antiguo 20/06/2010, 05:29
Avatar de _cronos2
Colaborador
  
Fecha de Ingreso: junio-2010
Mensajes: 2.062
Antigüedad: 13 años, 10 meses
Puntos: 310
Respuesta: ayuda con formulario
PD:(No me cabía en el otro post)
Además, para que no le tengas que poner un value a cada option puedes usar algo como esto (siempre y cuando el value que le quieras dar sea lo mismo que ve el usuario en cada option):
Código Javascript: 
Ver original
  1. function valor(a){
  2.  a.value=a.options[a.selectedIndex].text;
  3. }
Y llamarlo así
Código HTML: 
Ver original
  1. <select name='tuselect' onchange='tufuncion(); valor(this);'>

Saludos (:
  #5 (permalink)  
Antiguo 20/06/2010, 09:50
 
Fecha de Ingreso: junio-2010
Mensajes: 5
Antigüedad: 13 años, 10 meses
Puntos: 0
Respuesta: ayuda con formulario
Gracias por las correcciones, pero aun sigue sin funcionar en IE
  #6 (permalink)  
Antiguo 20/06/2010, 10:33
Avatar de _cronos2
Colaborador
  
Fecha de Ingreso: junio-2010
Mensajes: 2.062
Antigüedad: 13 años, 10 meses
Puntos: 310
Respuesta: ayuda con formulario
¿Pero qué es lo que no funciona?¿Y qué dice la consola de errores?
Saludos (:

Etiquetas: formulario
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 23:11.