Añadir campos a un formulario con PHP

[Seisler]

Hola tengo un problemilla.

yo tengo ésto:



Y quiero que al darle a añadir imagen me cree tantos campos file como le digo.Tendría que ser en la misma página.

Alguna sugerencia?

[GatorV]

Tema movido desde PHP a Javascript

[Perr0]

ejemplo --> http://perr0.netii.net/exs/subir/s.php

Hola, esto hice un codigo sencillo, solo copy paste
recuerda darle permiso 777 a tu carpeta en tu pagina

lo probe en IE y Opera, debiera funcionar en el resto

salu2

Código HTML:

function elemento_file(x){
    var divele=document.getElementById("elementos");
    var f=document.getElementsByTagName("div").item(0);
    if(x==1){
        if(f.lastChild){
            divele.removeChild(f.lastChild);
            divele.removeChild(f.lastChild);
        }
    } else {
        salto=document.createElement("br");
        ele=document.createElement("input");
        ele.type="file";
        ele.name="mielemento[]";
        divele.appendChild(ele);
        divele.appendChild(salto);
    }
}
</script>
<?
if($_FILES["mielemento"]){
    foreach ($_FILES["mielemento"]["error"] as $clave => $error) {
        if ($error == UPLOAD_ERR_OK) {
            $nombre_tmp = $_FILES["mielemento"]["tmp_name"][$clave];
            $nombre = $_FILES["mielemento"]["name"][$clave];
            if(move_uploaded_file($nombre_tmp, "$nombre")) echo "subido: $nombre<br>";
        }
    }
}
?>
 
<form enctype="multipart/form-data" method="post">
<input type="button" value="A&ntilde;adir" onClick="elemento_file(0)">
<input type="button" value="Quitar"onClick="elemento_file(1)">
<div id="elementos"></div><p>
<input type="submit" value="enviar">
</form>
 

[Perr0]

te dejo la página del ejemplo
y el código mas arriba

http://perr0.netii.net/exs/subir/s.php

salu2

[Seisler]

Perr0 un millón de gracias!

Funciona bien menos el botón de quitar, he estado mirando pero no he estudiado javascript y no se dónde puede estar el error.

Gracias.

[Seisler]

¿Cómo hago para que me pase los resultados de cada file que me crea a otro PHP?

[Perr0]

el boton quitar funciona bien (no entender), si quieres cargar en otra paginaç

agregas en el tag de form action="otrapagina.php"

luego en esa página colocas este codigo

Código PHP:

if($_FILES["mielemento"]){
    foreach ($_FILES["mielemento"]["error"] as $clave => $error) {
        if ($error == UPLOAD_ERR_OK) {
            $nombre_tmp = $_FILES["mielemento"]["tmp_name"][$clave];
            $nombre = $_FILES["mielemento"]["name"][$clave];
            if(move_uploaded_file($nombre_tmp, "$nombre")) echo "subido: $nombre<br>";
        }
    }
}
 

salu2

[Seisler]

solo tenía que poner el código en un PHP. Vaya.

Si pongo echo $nombre me sale solo el nombre del último archivo. Cosa que al subir a la base de datos el campo imagen con el valor $nombre solo me pone la última imagen que he seleccionado. ¿cómo puedo hacer para que me coja todos los nombres?

[Seisler]

Iniciado por Seisler

solo tenía que poner el código en un PHP. Vaya.

Si pongo echo $nombre me sale solo el nombre del último archivo. Cosa que al subir a la base de datos el campo imagen con el valor $nombre solo me pone la última imagen que he seleccionado. ¿cómo puedo hacer para que me coja todos los nombres?

O también ir subiendo foto a foto cada una en un campo de la tabla ejemplo:

subo 2 fotos: foto1.jpg y foto2.jpg.


En la BBDD

id_foto proyecto foto

1 4 foto1.jpg
2 4 foto2.jpg


¿como se haría eso?

Ahora mismo solo me sube la última foto.

Un saludo

[Perr0]

coloca tu código o la página...porque mi bola de cristal esta dañada xD

[Seisler]

Mira he puesto lo que me has dicho al php que sube las fotos a la BBDD.

lo intento hacer así:




Lo que pasa es que ésto solo me sube a la BBDD la última foto que agregué, y agregué 4.

entonces a la bbdd solo me sale

id_foto = 1
proyecto = 4 (ésto es un ejemplo ya que aún no lo he configurado)
foto = foto4.jpg

entonces las fotos 1,2 y 3. No se suben a la BBDD

Siento que sea tan cateto. Mi nivel es bastante pobre. Pero intento aprender.

Un saludo

[Perr0]

ahora si

EASY



salu2

[Seisler]

Funciona! eres un grande! ahora solo me queda arreglar una pequeña cosa y es el botón de borrar, te aseguro que a mi no me funciona.

Otra cosa es que si por ejemplo hago ésto:





Como ves dejo las dos últimas vacías. Sea por lo que sea. En mi caso es porque no puedo quitar campos.

Entonces en la base de datos me agrega filas y las rellena con la última foto que he subido:

id_foto = 0
proyecto = 4
foto = foto1

id_foto = 1
proyecto = 4
foto = foto2

id_foto = 2
proyecto = 4
foto = foto2

id_foto = 3
proyecto = 4
foto = foto2

Gracias de nuevo

[Seisler]

Aquí dejo mi script para ver si ves algo por lo cual no me funcione el botón de borrar:

Código Javascript:

<!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>
 
<link href="file:///C|/DOCUME~1/MARKSC~1/CONFIG~1/css/caleidoscopioprov.css" rel="stylesheet" type="text/css" media="screen" />
<link href="file:///C|OCUME~1/MARKSC~1/CONFIG~1/imagenes/favicon.gif" rel="icon" />
<link href="file:///C|/DOCUME~1/MARKSC~1/CONFIG~1/imagenes/favicon.gif" rel="shortcut icon" type="image/x-icon" />
 
<meta name="keywords" content="caleidoscopio studio, diseo, design, estudio, barcelona, grafico, museo reina sofia, lorena dorta, marta juan, print design, books, salerm, esec, business school, art direction, efren alvarez, davis lisboa, centro de arte santa monica, madrid, art, caleidoscopiostudio.blogspot.com" />
<meta name="description" content="Caleidoscopio Studio is a design team based in Barcelona. We develope art direction projects, video and graphic works, illustrations and all creative ideas that you need." />
<meta name="copyright" content="Copyright (c) 2011 Caleidoscopio Studio" />
 
 
 
<script language="JavaScript" type="text/javascript">
 
function elemento_file(x){
    var divele=document.getElementById("elementos");
    var f=document.getElementsByTagName("div").item(0);
    if(x==1){
        if(f.lastChild){
            divele.removeChild(f.lastChild);
            divele.removeChild(f.lastChild);
        }
    } else {
        salto=document.createElement("br");
        ele=document.createElement("input");
        ele.type="file";
        ele.name="mielemento[]";
        divele.appendChild(ele);
        divele.appendChild(salto);
    }
}
</script>
 
<link href="../css/caleidoscopioprov.css" rel="stylesheet" type="text/css" />
 
 
 
</head>
 
<body>
 
<!-- Contenedor -->
<div id="contenedor">
 
<!-- Cabecera -->
    <div id="cap">
        <a href="">
        <img  src="images/logo.gif" alt="Logo Caleidoscopio Studio" />
        </a>
    </div>
 
<!-- /Cabecera -->
<!-- Separador -->
<div>
      <img src="images/separador.gif" />
    </div>
<!-- /Separador -->
 
<!-- Menu -->
    <div id="menu">
    <span class="izquierda">
      <ul>
            <li><a class="btn_menu" href="" title="elemento menu">estudio</a></li>
            <li><a class="btn_menu" href="" title="elemento menu"> servicios</a></li>
            <li><a class="btn_menu" href="" title="elemento menu">proyectos</a></li>
            <li><a class="btn_menu" href="" title="elemento menu">personal-works</a></li>
            <li><a href="" title="elemento menu" class="btn_menu">contacto</a></li>
           
        </ul>
    </span>
    <span class="derecha">
    <ul>
             <li><a href="http://caleidoscopiostudio.blogspot.com" title="elemento menu" target="_blank" class="btn_menu">blog</a></li>
    </ul>
    </span>
  </div>
<!-- /Menu -->
<!-- Separador -->
<div >
      <img src="images/separador.gif" />
    </div>
<!-- /Separador -->
 
<!-- Contenido principal -->
    
    <div id="principal">
    
    <?php
    if($_FILES["mielemento"]){
    foreach ($_FILES["mielemento"]["error"] as $clave => $error) {
        if ($error == UPLOAD_ERR_OK) {
            $nombre_tmp = $_FILES["mielemento"]["tmp_name"][$clave];
            $nombre = $_FILES["mielemento"]["name"][$clave];
            if(move_uploaded_file($nombre_tmp, "$nombre")) echo "subido: $nombre<br>";
        }
    }
}
    ?>
    
    
    <form  enctype="multipart/form-data" action="conjava.php" method="post">
    <input type="button" value="A&ntilde;adir" onClick="elemento_file(0)">
    <input type="button" value="Quitar" onClick="elemento_file(1)">
    <div id="elementos"> </div><p>
    <input type="submit" value="enviar">
    </form>
                
    
    
   
    
        
        
    </div>
<!-- Separador -->
    <div id="separador" class="espaciosup">
      <img src="images/separador.gif" />
    </div>
 
</body>
 

[Perr0]

ya se
mira
yo puse codigo de mas, no me dedico mucho a depurar salvo al final
y tu modificaste algo

es simple

donde esta el <script></script>

elimina la linea que dice
var f=document.getElementsByTagName("div").item(0);

y reemplaza estas tres f

Código Javascript:

if(f.lastChild){
  f.removeChild(divele.lastChild);
  f.removeChild(divele.lastChild);
 

por divele

Código Javascript:

if(divele.lastChild){
  divele.removeChild(divele.lastChild);
  divele.removeChild(divele.lastChild);
 

saludos y ahora debiera estar ok

[Seisler]

Buala! ya funciona todo. Eres un crac! espero algún día llegar a tu nivel.

Saludos campeón.XD

[Seisler]

Bueno después de un tiempo. He tenido que hacer algo parecido pero en red y no en local. Esto me funcionaba estupendo en local ya que las imágenes y la ruta todo estaba en local. Ahora me viene la duda. Al utilizar este sistema en servidor remoto, el de subir la ruta a la base de datos en vez de la imagen en si (para economizar espacio), al elegir las imágenes, como estas están en el disco duro local no funciona, ya que tendrían que estar en el directorio raíz remoto y por lo tanto antes deberían ser subidas al directorio raíz manualmente. Alguna idea de como se hace ésto?