0

Esto haciendo un sistema donde solicito información por inputs y quiero que imprima los tags de HTML para después solo copiar y pegar ese código.

En la primer pantalla se solicita al usuario cierta información para generar por un for los tags de ul y lipara imprimirlos en la segunda pantalla.

index.php El usuario puede seleccionar entre 1 o 5 elementos a mostrar Imagen del Index

<?php 

$temas = array(
    '1','2','3','4','5'
);

$propositos = array(
    '1','2','3','4','5'
);

$recursos = array(
    '1','2','3','4','5'
);

 ?>

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <title>Agenda</title>
</head>
<body>
    <form action="Agenda_W3.php" method="post">
        <p>Selecciona que materia quieres trabajar:
            <select name="materia" id="">
                <option selected disabled hidden style='display: none' value=''></option>
                <option value="Matemáticas">Matemáticas</option>
                <option value="Física">Física</option>
            </select>
        </p>

        <p>¿Cuantos <strong>"Propositos Especificos"</strong> necesitas para la semana? <select name="no_proposito" id="">
                <option selected disabled hidden style='display: none' value=''></option>
                <?php foreach ($propositos as $proposito) { ?>
                <option value="<?php echo $proposito; ?>"><?php echo $proposito; ?></option>
                <?php } ?>
            </select>
        </p>
        <hr>
        <p>Sección 1</p>
        <p>¿Cuantos <strong>"Temas"</strong> necesitas? <select name="no_tema1" id="">
                <option selected disabled hidden style='display: none' value=''></option>
                <?php foreach ($temas as $tema) { ?>
                <option value="<?php echo $tema; ?>"><?php echo $tema; ?></option>
                <?php } ?>
            </select>
        </p>

        <p>¿Cuantos <strong>"Recursos"</strong> necesitas? <select name="no_recursos1" id="">
                <option selected disabled hidden style='display: none' value=''></option>
                <?php foreach ($recursos as $recurso) { ?>
                <option value="<?php echo $recurso; ?>"><?php echo $recurso; ?></option>
                <?php } ?>
            </select>
        </p>        
        <hr>
        <p>Sección 2</p>
        <p>¿Cuantos <strong>"Temas"</strong> necesitas? <select name="no_tema2" id="">
                <option selected disabled hidden style='display: none' value=''></option>
                <?php foreach ($temas as $tema) { ?>
                <option value="<?php echo $tema; ?>"><?php echo $tema; ?></option>
                <?php } ?>
            </select>
        </p>

        <p>¿Cuantos <strong>"Recursos"</strong> necesitas? <select name="no_recursos2" id="">
                <option selected disabled hidden style='display: none' value=''></option>
                <?php foreach ($recursos as $recurso) { ?>
                <option value="<?php echo $recurso; ?>"><?php echo $recurso; ?></option>
                <?php } ?>
            </select>
        </p>        

        <input type="submit" value="Enviar">
    </form> 

</body>
</html>

Esta es la salida de mi Array en el index.php

Array
(
    [materia] => Física
    [no_proposito] => 5
    [no_tema1] => 2
    [no_recursos1] => 4
    [no_tema2] => 3
    [no_recursos2] => 1
)

Segunda pantalla uso esa información para generar las viñetas de acuerdo a lo que el usuario seleccionó en el index.php e envió a un segundo formulario. introducir la descripción de la imagen aquí

    $bloques = array(
        'I','II','III','IV','V','VI','VII','VIII','IX','X','XI','XII','XIII'
    );
    /*Almacena el digito en una variable para usarse en un ciclo*/
    $no_proposito = $_POST['no_proposito'];
    $no_tema1 = $_POST['no_tema1'];
    $no_recurso1 = $_POST['no_recursos1'];
    $no_tema2 = $_POST['no_tema2'];
    $no_recurso2 = $_POST['no_recursos2'];
 ?>

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Agenda W3</title>
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
</head>
<body>
    <div class="w3-container agenda">
        <p>Agenda para la materia: <?php printf($materia);?> </p>
        <form action="genera_html.php" method="post" target="_blank">
            <div class="w3-row w3-round bloque">
                <div class="w3-col w3-container ">
                    <p>BLOQUE: 
                        <select name="no_bloque" id=""><!-- El usuario selecciona el bloque -->
                            <option selected disabled hidden style='display: none' value=''></option>
                            <?php foreach ($bloques as $romano) { ?>
                            <option value="<?php printf($romano); ?>"> <?php printf($romano); ?></option>
                            <?php } ?>
                        </select>:<input type="text" name="nombre_bloque" placeholder="Nombre del bloque">
                    </p>
                </div>
            </div>
            <br>
            <div class="w3-row  objetivo">
                <div class="w3-col w3-padding-small w3-container m4 l3 objetivo_tit">
                    <p class="amarillo"><strong>Objetivo</strong></p>
                </div>
                <div class="w3-col w3-container m8 l9 objetivo_content">
                    <p><input type="text" name="titulo_objetivo" placeholder="Objetivo"></p>
                </div>
            </div>
            <br>    
            <div class="w3-row  propositos">
                <div class="w3-col w3-padding-small w3-container m4 l3 propositos_tit">
                    <p class="amarillo"><strong>Propósitos específicos</strong></p>
                </div>
                <div class="w3-col w3-container m8 l9 propositos_content">
                    <?php
                        $html="<ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                        for ($i=1; $i <= $no_proposito; $i++) { /*Se itera sobre la variable para imprimir n cantidad de <li>*/
                            $html.="<li><input type=\"text\" name=\"proposito$i\" placeholder=\"Descripción del proposito\"></li>";
                        }
                        $html.="</ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                        echo $html; /*Imprime la lista contatenada*/
                     ?>
                </div>
            </div>
            <br>
            <div class="w3-row w3-round w3-padding-small tema">
                <div class="w3-col w3-container ">
                    <p><strong>TEMA <select name="numero_tema1" id="">
                        <option selected disabled hidden style='display: none' value=''></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                    </select>:
                    <?php 
                        $html="<ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                        for ($i=1; $i <= $no_tema1; $i++) { /*Se itera sobre la variable para imprimir n cantidad de <li>*/
                            $html.="<li><input type=\"text\" name=\"no_tema$i\" placeholder=\"Descripción del proposito\"></li>";
                        }
                        $html.="</ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                        echo $html; /*Imprime la lista contatenada*/
                     ?>
                    </strong></p>
                </div>
            </div>
            <br>
            <div class="w3-row  actividades">
                <div class="w3-col m6 l8 act_column">
                    <div class="w3-row  w3-padding-small act_tit">
                        <p class="amarillo"><strong>Actividades</strong></p>
                    </div>
                    <div class="w3-row  act_cont">
                        <p><input type="text" name="descripcion1_actividad" placeholder="Descripción de actividad"></p>
                    </div>
                </div>
                <div class="w3-col m6 l4 rec_column">
                    <div class="w3-row  w3-padding-small rec_tit">
                        <p class="amarillo"><strong>Recursos</strong></p>
                    </div>
                    <div class="w3-row  rec_cont">
                        <p>
                            <input type="text" name="descripcion1_recursos" placeholder="Descripción del recurso">
                        </p>
                        <?php /*Genera lista de los recursos para cada materia*/
                            $html="<ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                            for ($i=1; $i <= $no_recurso1; $i++) { /*Se itera sobre la variable para imprimir n cantidad de <li>*/
                                $html.="<li><input type=\"text\" name=\"no_recurso$i\" placeholder=\"Descripción del proposito\"></li>";
                            }
                            $html.="</ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                            echo $html; /*Imprime la lista contatenada*/
                         ?>
                    </div>
                </div>
            </div>
            <br>
            <div class="w3-row w3-round w3-padding-small tema">
                <div class="w3-col w3-container ">
                    <p>
                        <strong>TEMA <select name="numero_tema2" id="">
                            <option selected disabled hidden style='display: none' value=''></option>
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option value="5">5</option>
                            <option value="6">6</option>
                        </select>:
                        <?php 
                            $html="<ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                            for ($i=1; $i <= $no_tema2; $i++) { /*Se itera sobre la variable para imprimir n cantidad de <li>*/
                                $html.="<li><input type=\"text\" name=\"no_tema$i\" placeholder=\"Descripción del proposito\"></li>";
                            }
                            $html.="</ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                            echo $html; /*Imprime la lista contatenada*/
                         ?>
                        </strong>
                    </p>
                </div>
            </div>
            <br>
            <div class="w3-row  actividades">
                <div class="w3-col m6 l8 act_column w3-padding">
                    <div class="w3-row  w3-padding-small act_tit">
                        <p class="amarillo"><strong>Actividades</strong></p>
                    </div>
                    <div class="w3-row  act_cont w3-padding">
                        <p><input type="text" name="descripcion2_actividad" placeholder="Descripción de actividad"></p>
                    </div>
                </div>
                <div class="w3-col m6 l4 rec_column w3-padding">
                    <div class="w3-row  w3-padding-small rec_tit">
                        <p class="amarillo"><strong>Recursos</strong></p>
                    </div>
                    <div class="w3-row  rec_cont w3-padding">
                        <p><input type="text" name="descripcion2_recursos" placeholder="Descripción del recurso"></p>

                        <?php 
                            $html="<ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                            for ($i=1; $i <= $no_recurso2; $i++) { /*Se itera sobre la variable para imprimir n cantidad de <li>*/
                                $html.="<li><input type=\"text\" name=\"no_recursos$i\" placeholder=\"Descripción del proposito\"></li>";
                            }
                            $html.="</ul>"; /*Definimos etiqueta <ul> que se usará para concatenación*/
                            echo $html; /*Imprime la lista contatenada*/
                         ?>

                    </div>
                </div>
            </div>
            <input type="submit" value="Validar datos" >
        </form> 
    </div>

</body>
</html>

Este es array de mi segundo código. introducir la descripción de la imagen aquí ¿Las variables Undefined, debo de usar isset para que no me envíe ese error?

Lo que no sé es como imprimir los elementos de array ya que puede variar de acuerdo a la información de la primera pantalla. Por ejemplo en la imagen anterior no se están usando las variables no_tema4, no_tema5,etc.

Este es mi tercer código para imprimir la información del array y para que después sea impresa solo el HTML con la etiqueta <pre>

<?php

$no_bloque = $_POST['no_bloque'];
$nombre_bloque = $_POST['nombre_bloque'];
$titulo_objetivo = $_POST['titulo_objetivo'];
$proposito1 = $_POST['proposito1'];
$proposito2 = $_POST['proposito2'];
$proposito3 = $_POST['proposito3'];
$proposito4 = $_POST['proposito4'];
$proposito5 = $_POST['proposito5'];
$numero_tema1 = $_POST['numero_tema1'];
$no_tema1 = $_POST['no_tema1'];
$no_tema2 = $_POST['no_tema2'];
$no_tema3 = $_POST['no_tema3'];
$no_tema4 = $_POST['no_tema4'];
$no_tema5 = $_POST['no_tema5'];
$descripcion1_actividad = $_POST['descripcion1_actividad'];
$descripcion1_recursos = $_POST['descripcion1_recursos'];
$no_recurso1 = $_POST['no_recurso1'];
$no_recurso2 = $_POST['no_recurso2'];
$no_recurso3 = $_POST['no_recurso3'];
$no_recurso4 = $_POST['no_recurso4'];
$no_recurso5 = $_POST['no_recurso5'];
$numero_tema2 = $_POST['numero_tema2'];
$descripcion2_actividad = $_POST['descripcion2_actividad'];
$descripcion2_recursos = $_POST['descripcion2_recursos'];
$no_recursos1 = $_POST['no_recursos1'];
$no_recursos2 = $_POST['no_recursos2'];
$no_recursos3 = $_POST['no_recursos3'];
$no_recursos4 = $_POST['no_recursos4'];
$no_recursos5 = $_POST['no_recursos5'];

/*$no_proposito = $_POST['no_proposito'];*/

if ($_POST) {
    echo '<pre>';
    echo htmlspecialchars(print_r($_POST, true));
    echo count($_POST). " elementos";
    echo '</pre>';
    }
echo '<hr>';
?>
<div class="w3-container agenda">
        <div class="w3-row w3-round bloque">
            <div class="w3-col w3-container ">
                <p>BLOQUE <?php printf($no_bloque); ?>:  <?php printf($nombre_bloque); ?></p>
            </div>
        </div>
        <br>
        <div class="w3-row  objetivo">
            <div class="w3-col w3-padding-small w3-container m4 l3 objetivo_tit">
                <p class="amarillo"><strong>Objetivo.</strong></p>
            </div>
            <div class="w3-col w3-container m8 l9 objetivo_content">  
                <p><?php printf($titulo_objetivo); ?></p>
            </div>
        </div>
        <br>
        <div class="w3-row  propositos">
            <div class="w3-col w3-padding-small w3-container m4 l3 propositos_tit">
                <p class="amarillo"><strong>Propósitos específicos</strong></p>
            </div>
            <div class="w3-col w3-container m8 l9 propositos_content">  
                <ul>

                </ul>
            </div>
        </div>
        <br>
        <div class="w3-row w3-round w3-padding-small tema">
            <div class="w3-col w3-container ">
                <p><strong>TEMA I: Las mátemáticas en la historia</strong></p>
            </div>
        </div>
        <br>
        <div class="w3-row  actividades">
            <div class="w3-col m6 l8 act_column">
                <div class="w3-row  w3-padding-small act_tit">
                    <p class="amarillo"><strong>Actividades</strong></p>
                </div>
                <div class="w3-row  act_cont">
                    <p>Actividades Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sit sequi possimus quia impedit qui quibusdam asperiores culpa, optio excepturi quo nostrum ad ipsa nihil ullam dignissimos, ab obcaecati odit voluptatum.</p>
                </div>
            </div>
        <div class="w3-col m6 l4 rec_column">
            <div class="w3-row  w3-padding-small rec_tit">
                <p class="amarillo"><strong>Recursos</strong></p>
            </div>
            <div class="w3-row  rec_cont">
                <p>Recursos Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sit sequi possimus quia impedit qui quibusdam asperiores culpa, optio excepturi quo nostrum ad ipsa nihil ullam dignissimos, ab obcaecati odit voluptatum.</p>
                <ul>
                    <li>Objetivo de de esta agenda semanal</li>
                    <li>Este es otro objetivo semanal</li>
                    <li>Este es el tercer objetivo semanal</li>
                    <li>Este es el tercer objetivo semanal</li>
                </ul>
            </div>
          </div>
        </div>
        <br>
        <div class="w3-row w3-round w3-padding-small tema">
            <div class="w3-col w3-container ">
                <p><strong>TEMA II: Las mátemáticas en la historia</strong></p>
            </div>
        </div>
        <br>
        <div class="w3-row  actividades">
            <div class="w3-col m6 l8 act_column w3-padding">
                <div class="w3-row  w3-padding-small act_tit">
                    <p class="amarillo"><strong>Actividades</strong></p>
                </div>
                <div class="w3-row  act_cont w3-padding">
                    <p>Actividades Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sit sequi possimus quia impedit qui quibusdam asperiores culpa, optio excepturi quo nostrum ad ipsa nihil ullam dignissimos, ab obcaecati odit voluptatum.</p>
                </div>
            </div>
            <div class="w3-col m6 l4 rec_column w3-padding">
                <div class="w3-row  w3-padding-small rec_tit">
                    <p class="amarillo"><strong>Recursos</strong></p>
                </div>
                <div class="w3-row  rec_cont w3-padding">
                    <p>Recursos Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sit sequi possimus quia impedit qui quibusdam asperiores culpa, optio excepturi quo nostrum ad ipsa nihil ullam dignissimos, ab obcaecati odit voluptatum.</p>
                        <ul>
                            <li>Objetivo de de esta agenda semanal</li>
                            <li>Este es otro objetivo semanal</li>
                            <li>Este es el tercer objetivo semanal</li>
                            <li>Este es el tercer objetivo semanal</li>
                        </ul>
                </div>
            </div>
        </div>
    </div>

PD: Aun me hace falta imprimir los tags de HTML. PD: Soy nuevo programando en PHP.

10
  • 1
    pon ejemplos para que quede más claro
    – Sr1871
    el 19 oct. 2018 a las 18:21
  • 1
    Quisiera imprimir la información de la segunda pantalla usando las etiquetas HTML, investigando un poquito veo que debo de usar la etiqueta <pre> pero no se como atraer los valores del array ya que pueden variar. el 19 oct. 2018 a las 18:26
  • 1
    La pregunta se entiende, pero si pusieras un ejemplo de como queda el array actualmente y otro ejemplo de como quisieras que quedara se podría observar de mejor manera
    – Sr1871
    el 19 oct. 2018 a las 18:30
  • 1
    Ah ok, dame un segundo para editar mi información. el 19 oct. 2018 a las 18:36
  • 1
    Listo @Sr1871, espero no confundirte. el 19 oct. 2018 a las 19:10

2 respuestas 2

1

simplemente haz un foreach a $_POST en lugar de imprimir todo con un post

if (!empty($_POST)):?>
  <pre>
     <?php foreach($_POST as $key => $value){
         echo '<li>'.$key.' es '.$value.'</li>';
     }?>
  </pre>
  <hr>
<?php endif?>
1

Creo que no me funciona porque me va imprimir todo el array en etiquetas li. Creo que tendré que almacenar los valores en diferentes arrays para aplicar tu sugerencia. Intentaré guardar en arrays diferentes

1
  • 1
    por favor revisa Cómo responder y no ocupes la zona de respuestas para colocar comentarios o aclaraciones
    – user75901
    el 19 oct. 2018 a las 20:18

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.