Foros del Web » Programando para Internet » Javascript »

Pasar el contenido de un div a un campo hiddden

Estas en el tema de Pasar el contenido de un div a un campo hiddden en el foro de Javascript en Foros del Web. Hola, Tengo un formulario el cual tiene un div donde se muestran unas imágenes. Cómo podría hacer para pasar el contenido del div pasarlo a ...
  #1 (permalink)  
Antiguo 27/12/2008, 14:07
Avatar de gabyweb  
Fecha de Ingreso: enero-2002
Ubicación: Lima
Mensajes: 364
Antigüedad: 22 años, 3 meses
Puntos: 0
Pasar el contenido de un div a un campo hiddden

Hola,

Tengo un formulario el cual tiene un div donde se muestran unas imágenes. Cómo podría hacer para pasar el contenido del div pasarlo a un campo hidden y así enviar el formulario?

Código PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Gallery - Image Upload</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="styles.css"/>
    <script language="JavaScript">
    //MultiPowUpload_onComplete. Invoked when the upload or download of single file operation has successfully completed
    function MultiPowUpload_onComplete(type, index, serverResponse)    {

        addThumbnail(serverResponse); 
         
        /*for(var i in Objeto){
            alert('propiedad: '+i+' valor: '+Objeto[i]);
        }  */

    }

    function addThumbnail(source){
        var Img = document.createElement("img");
        Img.style.margin = "5px";

        if(source != "no_image")
            Img.src = source;
        else
            Img.src = "Images/elementitlogo.gif";
        
        document.getElementById("thumbnails").appendChild(Img);
        //document.getElementById("thumbnails").innerHTML +=  "<a href=\"javascript:alert('Portada de Album')\"><img src=\"icon_photoalbum.gif\" border=\"0\"/></a>";        
    }
    </script>
</head>
<body>
<h3>Image Upload Area</h3>
<p> </p>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><form name="upload" id="upload" action="image_upload.php" method="post">
<p> </p>
    <table width="32%" border="0" align="left" cellpadding="5" cellspacing="0">
        <tr>
            <td>Photo Album:</td>
            <td><select name="albums" id="albums">
                <?php
                
include("include/config.php");
                
db_connect();
                
mysql_query("SET NAMES 'utf8'");
                
header('Content-Type: text/html; charset=utf-8' );
                
                
$sql "SELECT album_id, album_name FROM album";
                
$result = @mysql_query$sql ) or die("Error retrieving records: " mysql_error());
                while ( 
$row mysql_fetch_array($result) ){
                    echo(
"<option value=" $row['album_id'] . ">" $row['album_name'] . "</option>");
                }
                
?>
                </select>
            </td>
        </tr>

        <tr>
            <td align="left" colspan="2">
                <div id="MultiPowUpload_holder">You need at least 9 version of Flash player. Download last version 
                    <a target="_blank" href="http://www.adobe.com/shockwave/download/alternates/">here</a>!
                </div>
                <!-- SWFObject home page: http://code.google.com/p/swfobject/ -->
                <script type="text/javascript" src="swfobject.js"></script>
                <script type="text/javascript">
                    var params = {  
                        BGColor: "#F8F6E6"
                    };
                    
                    var attributes = {  
                        id: "MultiPowUpload",  
                        name: "MultiPowUpload"
                    };
                    
                    var flashvars = {
                      //uploadUrl: "FileProcessingScripts/PHP/createthumbnail.php",
                      uploadUrl: "createthumbnail.php",
                      useExternalInterface: "Yes",
                      fileTypes: "JPEG images|*.jpg\;*.jpeg"
                    };
                    
                    swfobject.embedSWF("ElementITMultiPowUpload2.swf", "MultiPowUpload_holder", "450", "350", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
                </script>
            </td>
        </tr>
        
        <tr>
            <td></td>
            <td><input name="submit" type="submit" id="submit" value="Continue" /></td>
        </tr>
        <div id="thumbnails" ></div>
    </table>
    <p/>
</form>
</td>
</tr>
</table>
<p/>
<table>
        <tr>
            <td colspan="2">
                <table width="*" border="0" align="left" cellpadding="3" cellspacing="0" class="bottommenu">
                    <tr>
                        <td class="bottommenu"><a href="index.php">Main Menu</a> | <a href="new_album.php">Create
                    New Album</a> | <a href="gallery.php">View Gallery</a></td>
                    </tr>
                </table>
            </td>
        </tr>
</table>
</body>
</html>
__________________
Gaby :adios:
  #2 (permalink)  
Antiguo 27/12/2008, 15:27
Avatar de gabyweb  
Fecha de Ingreso: enero-2002
Ubicación: Lima
Mensajes: 364
Antigüedad: 22 años, 3 meses
Puntos: 0
Información Respuesta: Pasar el contenido de un div a un campo hiddden

Encontré la solución:

En el formulario creamos un campo hidden sin value:

Código:
<input name="imagen" type="hidden" id="imagen">
Luego en la función Javascript le asignamos el valor con el contenido del DIV:

Código:
//Pasamos el contenido del div al campo hidden
document.getElementById("imagen").value =document.getElementById("thumbnails").innerHTML;
Esa es la solución!!
__________________
Gaby :adios:
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




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