Complicaciones con formulario PHP + JS

Marcos071 · #1 (**permalink**) 22/04/2011, 10:47

Estoy complicado con este formulario, porque no hace lo que pretendo.
El formulario sin validaciones JS anda bien. Lo que hace es mostrar una tabla con datos, que al hacer click se cargan los values en los campos, y debajo estan las opciones de Agregar, Eliminar, Modificar... como esta en la imagen

El tema es, que quiero hacer que las validaciones sean distintas para cada boton que presione, es decir:

- si presiono Agregar, valide los campos obligatorios y si se agregó, que confirme que se ha agregado exitosamente.

- si presiono Eliminar, que muestre si en verdad desea eliminar y de las opciones, aceptar o cancelar.

- si presiono Modificar, que pregunte si va a modificar y luego que confirme si se modifico...

eso es precisamente, estaba intentando Eliminar, y dar la opcion de cancelar, pero de igual manera me eliminaba los campos...

Creo que el problema podria estar cuando recarga la misma pagina, porque en la misma pagina procesa todo por medio de php.

Código PHP:

 
<div class="contenedor_inferior" id="mostrar">

    <form id="form_clientes_datos" name="form_clientes_datos" method="post" action="clientes.php<?php echo "?pk_cli=" . $pk_cliente ?>">

      <table width="100%" border="0" cellspacing="0px">

        <tr>

          <td width="33%"><span class="titulo2">General</span></td>

          <td width="33%"><span class="titulo2">Contacto</span></td>

          <td width="33%"><span class="titulo2">Mas Datos</span></td>

        </tr>

        <tr>

          <td>

          <table width="317" border="0">

            <tr>

              <td width="133">Cliente <span class="rojo" title="Campo Obligatorio">(*)</span>:              </td>

              <td width="168"><input type="text" name="select_cliente" value="<?php echo $select_cliente; ?>" /></td>

            </tr>

            <tr>

              <td>Persona de contacto:</td>

              <td><input type="text" name="select_persona_contacto" value="<?php echo $select_persona_contacto; ?>" /></td>

            </tr>

            <tr>

                <td>Tel&eacute;fono 1:</td>

              <td><input type="text" name="select_telefono1" value="<?php echo $select_telefono1; ?>" /></td>

            </tr>

            <tr>

                <td>Tel&eacute;fono 2:</td>

              <td><input type="text" name="select_telefono2" value="<?php echo $select_telefono2; ?>" /></td>

            </tr>

 
          </table>

          <p>&nbsp;</p>

          <p>&nbsp;</p>

          <p>&nbsp;</p></td>

          <td>

              

              <table width="320" border="0">

            <tr>

                <td width="86">Direcci&oacute;n:</td>

              <td width="206"><input type="text" name="select_direccion" value="<?php echo $select_direccion; ?>" /></td>

            </tr>

            <tr>

                <td>C&oacute;digo Postal:</td>

              <td><input type="text" name="select_codigo_postal" value="<?php echo $select_codigo_postal; ?>" /></td>

            </tr>

            <tr>

              <td>Localidad:</td>

              <td><input type="text" name="select_localidad" value="<?php echo $select_localidad; ?>" /></td>

            </tr>

            <tr>

                <td>Pa&iacute;s:</td>

              <td><input type="text" name="select_pais" value="<?php echo $select_pais; ?>" /></td>

            </tr>

            <tr>

              <td>Email 1:</td>

              <td><input type="text" name="select_email1" value="<?php echo $select_email1; ?>" /></td>

            </tr>

            <tr>

              <td>Email 2:</td>

              <td><input type="text" name="select_email2" value="<?php echo $select_email2; ?>" /></td>

            </tr>

            <tr>

              <td>Fax:</td>

              <td><input type="text" name="select_fax" value="<?php echo $select_fax; ?>" /></td>

            </tr>

          </table>

          <p>&nbsp;</p></td>

          <td>

              

              <table width="320" border="0">

            <tr>

              <td width="91">Forma de pago:</td>

              <td width="168"><input type="text" name="select_forma_pago" value="<?php echo $select_forma_pago; ?>" /></td>

            </tr>

            <tr>

              <td>Descuento:</td>

              <td><input type="text" name="select_descuento" value="<?php echo $select_descuento; ?>" /></td>

            </tr>

            <tr>

              <td>Deuda:</td>

              <td><input type="text" name="select_deuda" value="<?php echo $select_deuda; ?>" /></td>

            </tr>

            <tr>

              <td>Fecha de Alta:</td>

              <td><input type="text" name="select_fecha_alta" value="<?php echo $select_fecha_alta; ?>" /></td>

            </tr>

            <tr>

              <td>Notas: </td>

              <td>&nbsp;</td>

            </tr>

            <tr>

              <td colspan="2"><textarea cols="30" rows="6" name="select_nota"><?php echo $select_nota; ?></textarea></td>

            </tr>

          </table></td>

        </tr>

        <tr>

          <td colspan="3">

              <input type="submit" value="Agregar" name="select_agregar"/>

            <input type="submit" value="Eliminar" name="select_eliminar" />

            <input type="submit" value="Guardar" name="select_guardar" />

            <input type="submit" value="Vaciar Campos" name="select_vaciar" /></td>

        </tr>

      </table>

      </form>

</div>

laratik · #2 (**permalink**) 22/04/2011, 11:16

Veo que no estas utilizando javascript dentro del html, si fuera asi tendrias que hacer esto:

Código HTML:

<html> 
<head>
<script>
function eliminar() {
	if(confirm("Deseas eliminar los datos")) {
		return true;
	} else {
		return false;
	}
}
</script>
</head> 
 
<body> 
<form action="#" method="post">
<input type="submit" value="eliminar" onclick="return eliminar()" />
</form>
</body> 
</html>

Pero como al parecer no es tu caso, no deberías tener mayor problema, aunque siempre debes recordar retornar true o false para controlar el envio o no del formulario:

Código Javascript:

Ver originalfunction eliminar() {
    if(confirm("Deseas eliminar los datos")) {
        return true;
    } else {
        return false;
    }
}
 
function cargar() {
    document.getElementsByName("select_eliminar").item(0).onclick = eliminar;
}
 
window.onload = cargar;

Marcos071 · #3 (**permalink**) 22/04/2011, 11:31

Cita:

Iniciado por laratik

Veo que no estas utilizando javascript dentro del html,

No puse nada de JS porque tenia muchos errores.

Ahora bien! gracias por tu aporte, tenia errores en los return.

Marcos071 · #4 (**permalink**) 22/04/2011, 11:50

otra cosita que voy teniendo en el camino...
Como ves hice uso de tu funcion pero necesito agregarle algo mas, como lo verás:

Código:

function esta_vacio(q) {
        for ( i = 0; i < q.length; i++ ) {
                if ( q.charAt(i) != " " ) {
                        return true
                }
        }
        return false
}

function eliminar() {
    if(esta_vacio(document.form_clientes_datos.select_cliente.value)){
       alert("Debes seleccionar algun Cliente para Eliminarlo.");
       return false;
    }else{
             if(confirm("Deseas eliminar el Cliente "+document.form_clientes_datos.select_cliente.value+"?")) {
		return true;
                alert("Se ha eliminado el Cliente "+document.form_clientes_datos.select_cliente.value);
             } else {
		return false;
	}
    }
}

De igual manera esta_vacio me da falso, por lo que siempre pasa al confirm

en que estoy errado?

laratik · #5 (**permalink**) 22/04/2011, 12:51

corrigeme si me equivoco, pero esta_vacio valida que no hayan espacios en una cadena, por que no utilizas expresiones regulares del tipo: !/^\w*$/.test(q), así se puede validar que lo ingresado solo sean caracteres alfanuméricos, aparte de esto, la linea alert("Se ha eliminado el Cliente "+document.form_clientes_datos.select_cliente.valu e); nunca se va a poder ejecutar ya que esta después de un return, para ejecutarla debería esta al contrario, el resultado:

Código Javascript:

Ver originalfunction esta_vacio(q) {
    return !/^\w*$/.test(q)||q=="";
}
 
function eliminar() {
    if(esta_vacio(document.form_clientes_datos.select_cliente.value)){
       alert("Debes seleccionar algun Cliente para Eliminarlo.");
       return false;
    }else if(confirm("Deseas eliminar el Cliente "+document.form_clientes_datos.select_cliente.value+"?")){
        alert("Se ha eliminado el Cliente "+document.form_clientes_datos.select_cliente.value.value);
        return true;
        } else {
            return false;
        }
}