Foros del Web » Programando para Internet » Javascript »

Seria posible con JavaScript??

 Estas en el tema de Seria posible con JavaScript?? en el foro de Javascript en Foros del Web. Hola a todos de nuevo! Me gustaria saber si atraves de un campo desplegable el usuario puede elegir el numero de "cobros" y no que ...
  #1 (permalink)  
Antiguo 08/08/2006, 08:16
 
Fecha de Ingreso: agosto-2006
Mensajes: 7
Antigüedad: 18 años, 6 meses
Puntos: 0
Seria posible con JavaScript??
Hola a todos de nuevo!

Me gustaria saber si atraves de un campo desplegable el usuario puede elegir el numero de "cobros" y no que se muestren cuatro de golpe....Digamos que me gustaria tener la posibilidad de que se muestren entre 1 y 8 segun elija y no como ahora que salen 4 filas...

os dejo el codigo....

gracias de antemano!

<html>
<head>
<title>Offline database</title>
</head>
<style>
.campo {border-width:1px; border-style: solid; border-color:#828282; font-family:verdana; font-size:8pt}
.etiqueta {font-family: verdana; font-size:9pt}
.campo_numerico{border-width:1px; border-style: solid; border-color:#828282; font-family:verdana; font-size:8pt; text-align:right}
</style>
<body style="background-color:#f7f7f7;">
<table align=center>
<tr><td>
<form name=formulario action=IntroDB.php>
<!-- espacio -->
<table><tr><br></tr></table>
<!-- Cobros -->
<fieldset style="width: 800;">
<LEGEND style="font-family: verdana; font-size:10pt; color:#ff0044">Cobros</LEGEND>
<table width="100%" border="0">
<tr>
<td class=etiqueta>Fecha:</td>
<td><input type=text name=fecha1 class=campo size=12></td>
<td class=etiqueta>Importe:</td>
<td><input type=text name=importe1 class=campo></td>
<td class=etiqueta>Cod. aut. TPV:</td>
<td><input type=text name=tpv1 class=campo></td>
</tr>
<tr>
<td class=etiqueta>Fecha:</td>
<td><input type=text name=fecha2 class=campo size=12></td>
<td class=etiqueta>Importe:</td>
<td><input type=text name=importe2 class=campo></td>
<td class=etiqueta>Cod. aut. TPV:</td>
<td><input type=text name=tpv2 class=campo></td>
</tr>
<tr>
<td class=etiqueta>Fecha:</td>
<td><input type=text name=fecha3 class=campo size=12></td>
<td class=etiqueta>Importe:</td>
<td><input type=text name=importe3 class=campo></td>
<td class=etiqueta>Cod. aut. TPV:</td>
<td><input type=text name=tpv3 class=campo></td>
</tr>
<tr>
<td class=etiqueta>Fecha:</td>
<td><input type=text name=fecha4 class=campo size=12></td>
<td class=etiqueta>Importe:</td>
<td><input type=text name=importe4 class=campo></td>
<td class=etiqueta>Cod. aut. TPV:</td>
<td><input type=text name=tpv4 class=campo></td>
</tr>
</table>
</fieldset>
</form>
</body>
</html>
  #2 (permalink)  
Antiguo 08/08/2006, 09:24
 
Fecha de Ingreso: agosto-2006
Mensajes: 44
Antigüedad: 18 años, 6 meses
Puntos: 1
¿Qué tal así?
Código: 
<html>
<head>
<title>Offline database</title>
</head>
<style>
.campo {border-width:1px; border-style: solid; border-color:#828282; font-family:verdana; font-size:8pt}
.etiqueta {font-family: verdana; font-size:9pt}
.campo_numerico{border-width:1px; border-style: solid; border-color:#828282; font-family:verdana; font-size:8pt; text-align:right}
</style>
<script>
var r=8; //Máximo de filas.
function addRow()
{
  var o=document.getElementById("cobros");
  var t="<table width=\"100%\" border=\"0\">";
  for (var i=1; i<=r; i++)
  {
    if (document.formulario["fecha"+i]==undefined)
    {
      t+="<tr>";
      t+="<td class=\"etiqueta\">Fecha:</td>";
      t+="<td><input type=text name=\"fecha"+i+"\" class=\"campo\" size=\"12\"></td>";
      t+="<td class=\"etiqueta\">Importe:</td>";
      t+="<td><input type=text name=\"importe"+i+"\" class=\"campo\"></td>";
      t+="<td class=\"etiqueta\">Cod. aut. TPV:</td>";
      t+="<td><input type=text name=\"tpv"+i+"\" class=\"campo\"></td>";
      t+=i==r?"":"<td><input type=\"button\" onclick=\"addRow()\" value=\"+\"></td>";
      t+="</tr>";
      break;
    }
    else
    {
      t+="<tr>";
      t+="<td class=\"etiqueta\">Fecha:</td>";
      t+="<td><input type=text name=\"fecha"+i+"\" value=\""+document.formulario["fecha"+i].value+"\" class=\"campo\" size=\"12\"></td>";
      t+="<td class=\"etiqueta\">Importe:</td>";
      t+="<td><input type=text name=\"importe"+i+"\" value=\""+document.formulario["importe"+i].value+"\" class=\"campo\"></td>";
      t+="<td class=\"etiqueta\">Cod. aut. TPV:</td>";
      t+="<td><input type=text name=\"tpv"+i+"\" value=\""+document.formulario["tpv"+i].value+"\" class=\"campo\"></td>";
      t+="</tr>";
    }
  }
  t+="</table>";
  o.innerHTML=t;
}
</script>
<body style="background-color:#f7f7f7;">
<table align="center">
<tr><td>
<form name="formulario" action="IntroDB.php">
<!-- espacio -->
<table><tr><br></tr></table>
<!-- Cobros -->
<fieldset style="width: 800;">
<LEGEND style="font-family: verdana; font-size:10pt; color:#ff0044">Cobros</LEGEND>
<div id="cobros">
<table width="100%" border="0">
<tr>
<td class="etiqueta">Fecha:</td>
<td><input type=text name="fecha1" class="campo" size="12"></td>
<td class="etiqueta">Importe:</td>
<td><input type=text name="importe1" class="campo"></td>
<td class="etiqueta">Cod. aut. TPV:</td>
<td><input type=text name="tpv1" class="campo"></td>
<td><input type="button" onclick="addRow()" value="+"></td>
</tr>
</table>
</div>
</fieldset>
</form>
</body>
</html>
Básicamente rehace la tabla del formulario cada vez que pulsas el botón '+' con un límite de 8 filas.

Saludos,
HA
Última edición por HemeAqui; 08/08/2006 a las 09:27 Razón: Detallito en el código
  #3 (permalink)  
Antiguo 08/08/2006, 09:30
 
Fecha de Ingreso: agosto-2006
Mensajes: 7
Antigüedad: 18 años, 6 meses
Puntos: 0
lo voy a probar!!!

gracias por la respuesta, enseguida te digo que tal!
  #4 (permalink)  
Antiguo 08/08/2006, 09:36
 
Fecha de Ingreso: agosto-2006
Mensajes: 7
Antigüedad: 18 años, 6 meses
Puntos: 0
HemeAqui muy bien! Es lo que estaba buscando, a ver si consigo hacer que reste también! Desdeluego aveces alucino con la facilidad que teneis algunos para la programacion, a mi me cuesta muchísimo!

Gracias una vez mas por tu ayuda!

Yebras
  #5 (permalink)  
Antiguo 08/08/2006, 09:52
 
Fecha de Ingreso: agosto-2006
Mensajes: 7
Antigüedad: 18 años, 6 meses
Puntos: 0
He estado mirando el codigo y en teoria sumaria tambien un numero tanto a las etiquetas como a los " input type" pero cuando genera nueva fila salen todas con el mismo nombre....

Alguna sugerencia?
  #6 (permalink)  
Antiguo 08/08/2006, 13:06
 
Fecha de Ingreso: agosto-2006
Mensajes: 44
Antigüedad: 18 años, 6 meses
Puntos: 1
Cita:
Iniciado por yebras, en PM
Porcierto, me quedó una duda sobre el "for" que creaste, creo que a parte de sumar fila tambien suma numero detras del nombre de cada etiqueta y de cada "input type" para que cada uno sea diferente.
Esto es importante porque en un futuro se comunicara con un php que los introducira en una tabla y estaria bueno que cada fila se llamase diferente.
Cita:
Iniciado por yebras
He estado mirando el codigo y en teoria sumaria tambien un numero tanto a las etiquetas como a los " input type" pero cuando genera nueva fila salen todas con el mismo nombre....

Alguna sugerencia?
Cada fila (Fecha, Importe, TPV) tiene un nombre de variable (atributo 'name') diferente. Para probarlo usa este código PHP.
Código PHP:
<?php
/*
CON ESTE isset SE COMPRUEBA QUE YA SE REALIZÓ EL submit DEL
FORMULARIO
*/
if (isset($_POST["fecha1"]))
{
  $r=8; //Numero máximo de filas
?>
<html>
<head>
<title>Offline database</title>
</head>
<body>
<h1>Datos ingresados</h1>
<fieldset>
<LEGEND style="font-family: verdana; font-size:10pt; color:#ff0044">Cobros</LEGEND>
<table style="border: 1px solid #828282;" width="100%">
<tr>
  <th style="background-color: black; color: white; padding: 4px 12px;">Fecha</th>
  <th style="background-color: black; color: white; padding: 4px 12px;">Importe</th>
  <th style="background-color: black; color: white; padding: 4px 12px;">Cod. aut. TPV</td>
</tr>
<?php
  /*
  ESTE for ES PARA MOSTRAR LOS DATOS INGRESADOS
  */
  for ($i=1; $i<=$r; $i++)
  {
    /*
    CON ESTE isset COMPRUEBAS QUE EXISTA LA FILA, AL COMPROBAR
    QUE EXISTA EL CAMPO fechaX CORRESPONDIENTE (1 <= X <= 8)
    */
    if (isset($_POST["fecha".$i]))
    {
?>
<tr>
  <td><?=$_POST["fecha".$i]?></td>
  <td><?=$_POST["importe".$i]?></td>
  <td><?=$_POST["tpv".$i]?></td>
</tr>
<?php
    }
    else       //SINO EXISTE SALES DEL for
      break;
  }
?>
</table>
</fieldset>
</body>
</html>
<?php
}
else
{
/*
ESTE CÓDIGO HTML ES EL DE MI POST PREVIO.
*/
?>
<html>
<head>
<title>Offline database</title>
</head>
<style>
.campo {border-width:1px; border-style: solid; border-color:#828282; font-family:verdana; font-size:8pt}
.etiqueta {font-family: verdana; font-size:9pt}
.campo_numerico{border-width:1px; border-style: solid; border-color:#828282; font-family:verdana; font-size:8pt; text-align:right}
</style>
<script>
var r=8; //Máximo de filas.
function addRow()
{
  var o=document.getElementById("cobros");
  var t="<table width=\"100%\" border=\"0\">";
  for (var i=1; i<=r; i++)
  {
    if (document.formulario["fecha"+i]==undefined)
    {
      t+="<tr>";
      t+="<td class=\"etiqueta\">Fecha:</td>";
      t+="<td><input type=text name=\"fecha"+i+"\" class=\"campo\" size=\"12\"></td>";
      t+="<td class=\"etiqueta\">Importe:</td>";
      t+="<td><input type=text name=\"importe"+i+"\" class=\"campo\"></td>";
      t+="<td class=\"etiqueta\">Cod. aut. TPV:</td>";
      t+="<td><input type=text name=\"tpv"+i+"\" class=\"campo\"></td>";
      t+=i==r?"":"<td><input type=\"button\" onclick=\"addRow()\" value=\"+\"></td>";
      t+="</tr>";
      break;
    }
    else
    {
      t+="<tr>";
      t+="<td class=\"etiqueta\">Fecha:</td>";
      t+="<td><input type=text name=\"fecha"+i+"\" value=\""+document.formulario["fecha"+i].value+"\" class=\"campo\" size=\"12\"></td>";
      t+="<td class=\"etiqueta\">Importe:</td>";
      t+="<td><input type=text name=\"importe"+i+"\" value=\""+document.formulario["importe"+i].value+"\" class=\"campo\"></td>";
      t+="<td class=\"etiqueta\">Cod. aut. TPV:</td>";
      t+="<td><input type=text name=\"tpv"+i+"\" value=\""+document.formulario["tpv"+i].value+"\" class=\"campo\"></td>";
      t+="</tr>";
    }
  }
  t+="</table>";
  o.innerHTML=t;
}
</script>
<body style="background-color:#f7f7f7;">
<table align="center">
<tr><td>
<form name="formulario" action="yebras.php" method="post">
<!-- espacio -->
<table><tr><br></tr></table>
<!-- Cobros -->
<fieldset style="width: 800;">
<LEGEND style="font-family: verdana; font-size:10pt; color:#ff0044">Cobros</LEGEND>
<div id="cobros">
<table width="100%" border="0">
<tr>
<td class="etiqueta">Fecha:</td>
<td><input type=text name="fecha1" class="campo" size="12"></td>
<td class="etiqueta">Importe:</td>
<td><input type=text name="importe1" class="campo"></td>
<td class="etiqueta">Cod. aut. TPV:</td>
<td><input type=text name="tpv1" class="campo"></td>
<td><input type="button" onclick="addRow()" value="+"></td>
</tr>
</table>
</div>
</fieldset>
<input type="submit">
</form>
</body>
</html>
<?php
}
?>
Anotación. Los nombres de las variables para Fecha van de fecha1 ... fecha8, para Importe de importe1 ... importe8, para TPV de tpv1 ... tpv8

Saludos,
HA
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 14:50.