Foros Club Delphi

Foros Club Delphi (https://www.clubdelphi.com/foros/index.php)
-   PHP (https://www.clubdelphi.com/foros/forumdisplay.php?f=15)
-   -   Obtener el value de un li (https://www.clubdelphi.com/foros/showthread.php?t=90585)

Parsec 16-07-2016 18:44:21

Obtener el value de un li
 
Hola,

de una lista me gustaría poder obtener el valor (value) en una variable de php, por ejemplo si hago clic en la segunda línea me debería devolver el valor '101' en una variable php.
Código PHP:

<ol>
   <
li value="100"><a href="#"></a></li>
   <
li value="101"><a href="#"></a></li>
   <
li value="102"><a href="#"></a></li>
</
ol

¿sería posible?, muchas gracias

kapcomx 16-07-2016 22:24:32

tu elemento li deberia tener un id para que puedas acceder a su valor. con getelementbyid().

Parsec 17-07-2016 00:42:16

Gracias por responder, pero gtElementById o getElementByName se usa con javascript (en el cliente) y yo necesito que sea en PHP (servidor), creo que no me sirve.

No he puesto ni 'id' ni 'name' ni 'onclick', etc. para hacer más sencillo el ejemplo, la cuestión es, ¿cómo puedo capturar el valor de una 'li' con php?

Gracias de nuevo

Delphifandev 24-07-2016 02:43:14

Si quieres solo el value de los Li ¿Por qué no utilizas una función de manipulación de cadena?

Ñuño Martínez 26-07-2016 10:58:57

En principio no puedes capturar el valor de un <li> porque <li> no admite valores per sé.

¿Por qué no usas botones? Vía CSS puedes darles el aspecto que quieras y no andas con cosas raras.

roman 26-07-2016 19:01:57

Cita:

Empezado por Parsec (Mensaje 507019)
getElementByName se usa con javascript (en el cliente) y yo necesito que sea en PHP (servidor), creo que no me sirve.

la cuestión es, ¿cómo puedo capturar el valor de una 'li' con php?

Tú mismo notas que lo que pides es imposible. un "li" vive del lado del cliente, luego entonces no puedes examinarlo desde el servidor hasta que no mandes la información, pero la información se manda via formularios y un "li" no es parte de un formulario. Entonces tendrías que usar javascript para detectar el clic, tomar su valor (con getElementById, por ejemplo, :rolleyes:) y mandarlo con Ajax o asignarlo a algún elemento de un formulario.

Si explicas qué es lo que quieres hacer, podremos ayudarte mejor.

LineComment Saludos

Parsec 01-08-2016 12:30:33

Hola, perdonar la demora pero he estado unos días fuera.

Primero, gracias por contestar más cuando el problema tiene telita y no lo acabo de resolver; como pide Roman voy a intentar mostraros el código más relevante (presentarlo todo sería una locura).

Pretendo que al hacer clic en 'li' guardar '$row["idEmpresa"]' (es un dato de la consulta, se trata del id de una empresa) en la variable de php '$resultado' y abrir una ventana modal que llame a a :'_presentapracticas.php?variable1=<?php echo $resultado?>' para que pueda hacer una consulta con este valor (se trataría de mostrar otros campos de la empresa).

La cuestión es que capturo todo correctamente, '$resultado' se carga con el valor de la empresa pero cuando llamo a #example (div que abre la ventana modal) se pierde el valor.

El archivo php se llama: buscaempresa.php


Este es el 'li':
Código PHP:

                                <li onClick="realizaProceso(('<?php echo $row["idEmpresa"]?>'));return false;" class="seven1" name="dato"><a data-toggle="modal" href="#example"><b><img src=<?php echo $practicas1 ?> alt="" /></b></a></li>

Onclick es un script que captura $row["idEmpresa"], y vuelve a llamar a 'buscaempresa.php' utilizo get porque con post realizó otras funciones:

Código PHP:

 <script>
function 
realizaProceso(datoid){
        var 
parametros = {
                
"datoid" datoid                
        
};
        $.
ajax({
                
data:  parametros,
                
url:   'buscaempresa.php',
                
type:  'get',
                
beforeSend: function () {
                        $(
"#resultado").html("Procesando, espere por favor...");
                },
                
success:  function (response) {
                        $(
"#resultado").html(response);
                                                
                }
        });
                                
        }
</script> 

Compruebo y hasta aquí funciona bien:
Código PHP:

if ($_SERVER["REQUEST_METHOD"] == "GET") {
        
$resultado $_GET['datoid'];
        echo 
'Acabo de cargar GET y este es el valor de Resultado :'.$resultado.'</br>';


Pero cuando llega al div 'example', pierdo el valor de '$resultado':

Código PHP:

<div id="example" class="modal fade" role="dialog" ">
    <div class ="modal-dialog" id="mdialTamanio" >
    <div class ="modal-content" >
    <?php 
    
echo 'Paso por example, AQUI SE PIERDE EL VALOR'.$resultado;
    
    
    
?>
    <div class="modal-header">
        <div class="video">
            <iframe width="640" height="200" src="_presentapracticas.php?variable1=<?php echo $resultado?>" frameborder="0" allowfullscreen></iframe>
        </div>
</div>
    <div class="modal-footer">
        <a href="#" data-dismiss="modal" class="btn">Cerrar</a>
    </div>
        </div>
</div>    
</div>

Espero haberme explicado con claridad. Quedo pendiente, gracias

Parsec 06-08-2016 12:03:22

Hola de nuevo, como no hay respuestas he seguido investigando y estoy mucho más cerca de la solución, pero aún así tengo un problema, os explico:
Primero el código (la página se llama 1.php), está página lo único que pretende es abrir una ventana modal automáticamente si detecta que el método de llamada es 'POST', y lo pretendo hacer de dos formas: por la tradicional con una autollamada de un botón de formulario o mediante un evento onclick asociado a una 'li':
Código PHP:

<html>
<head>
   <meta charset="utf-8">
   <title>Mostrar Ventane Modal de forma Automático</title>


</head>
<body>
<span id="resultado"></span>
<?php
include ("bootstrap.php"); 
if (
$_SERVER["REQUEST_METHOD"] == "POST") {
      echo 
'De la función '.$_POST['datoid'];
      echo
'<script>
      $(document).ready(function()
      {
         $("#mostrarmodal").modal("show");
         alert ("Dentro de la llamada automática");
      });
    </script>'
;
}else{
?> 
    
    <?php 
         $practicas1
="img/no.jpg";
    
?> 
    <form style="width: 905px;"class='form-inline' name="seleccion" id="form" method="post">
   <p> este es el cuerpo </p>
   <li onClick="realizaProceso(('Hola'));return true;" class="seven1" name="dato"><a data-toggle="modal" href="#"><b><img src=<?php echo $practicas1 ?> alt="" /></b></a></li>
</br>  
   <button class="btn btn-info" type="submit" name="submit" >Buscar</button>
   </form>
     
<?php 
    
// fin del else del post
?> 

   <div class="modal fade" id="mostrarmodal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
      <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
              <h3>Cabecera de la ventana</h3>
           </div>
           <div class="modal-body">
              <h4>Texto de la ventana</h4>
              Mas texto en la ventana.    
       </div>
           <div class="modal-footer">
          <a href="#" data-dismiss="modal" class="btn btn-danger">Cerrar</a>
           </div>
      </div>
   </div>
</div>


<script>
function realizaProceso(datoid){
        var parametros = {
                "datoid" : datoid                
        };
        $.ajax({
                data:  parametros,
                url:   '1.php',
                type:  'POST',
                beforeSend: function () {
                        $("#form").html("Procesando, espere por favor...");
//                        alert (datoid);
                },
                success:  function (response) {
                        $("#form").html(response);
                }
        });
        }
</script>
</body>
</html>

El cuerpo de html tiene un 'li' y un boton de formulario:
- 'li' tiene asociado un evento 'onclick' que llama a una función 'realizaproceso' a la que le paso un parámetro por referencia (en este caso es la palabra 'Hola'), esta función llama a la página 1.php con el método POST.
- El botón del formulario realiza la operación estándar de llamar de nuevo a la página 1.php con el método POST.
Bien, pues si observáis al principio pongo el control
Código PHP:

if ($_SERVER["REQUEST_METHOD"] == "POST"

para que ejecute un script solo si el método de llamada a la página es 'POST'; bueno pues el script se pone en marcha si hago click con el botón de formulario pero no funciona si hago click en el 'li' y prácticamente es lo mismo, ¿alguien sabe porqué?, podéis probarlo.
A ver si me podéis ayudar, gracias.

Parsec 06-08-2016 12:17:26

Perdón se me olvidó el contenido de booststrap.php (tiene un include), aquí os lo dejo, tiene muchas más cosas de las necesarias porque lo utilizo de forma estándar.
Código PHP:

<!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" />
<
link rel="stylesheet" href="js/jquery-ui.css" />
<
link rel="stylesheet" href="css/bootstrap.min.css"/>
<
link rel="stylesheet" href="css/jasny-bootstrap.css"/>
<
link rel="stylesheet" href="css/main.css">
<
title>Documento sin título</title>
</
head>

<
body>
<
script src="js/jquery-ui.js"></script>
<script src="js/jquery.autotab.js" type="text/javascript"></script>
<script src="js/bootbox.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/es.js"></script>
<script type="text/javascript" src="js/ajax_class.js"></script>
<script type="text/javascript" src="js/ajax.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="js/jasny-bootstrap.js"></script>
<script type="text/javascript" src="js/jquery-3.1.0.min.js"></script>

</body>
</html> 


Ñuño Martínez 08-08-2016 13:16:34

Sigo insistiendo en que no entiendo por qué usas <li /> y no otra etiqueta.

Es decir, en vez de esto:
Código PHP:

<li id="id12" value="blablabla" onclick="...">...</li

¿Por qué no usas esto?:
Código PHP:

<li><a id="id12" value="blablabla" onclick="..." href="javascript: return false;">...</a></li


Parsec 09-08-2016 13:04:45

Hola Ñuño, acabo de hacer lo que me comentas y funciona igual, te copio el código con tu modificación (para probarlo falta la página bootstrap.php que he copiado más arriba):
Código PHP:

<html>
<head>
   <meta charset="utf-8">
   <title>Mostrar Ventana Modal de forma Automático</title>


</head>
<body>
<span id="resultado"></span>

<?php
echo 'Tipo PHP: '.$_SERVER["REQUEST_METHOD"].'</br>';
include (
"bootstrap.php"); 
if (
$_SERVER["REQUEST_METHOD"] == "POST") {
      echo 
'Valor de RealizaProceso'.$_POST['datoid'].'</br>';
      echo
'<script>
         alert ("Dentro del script");
    </script>'
;
?> 
     <p> este es el cuerpo sólo del POST</p>
         <form style="width: 905px;"class='form-inline' name="seleccion" id="form" method="post">
   <p> este es el cuerpo </p>
   <li ><a data-toggle="modal" onClick="realizaProceso(('Hola'));return true;" class="seven1" name="dato" href="javascript: return false;"><b>CLIK AQUÍ para llamar a la función</b></a></li>
</br>  
   <button class="btn btn-info" type="submit" name="submit" >CLICK AQUÍ Botón normal POST</button>
    <script>
         alert ("Dentro del script del POST");
    </script>

   </form>

<?php 
}else{
    
$practicas1="img/no.jpg";
    
?> 
    <form style="width: 905px;"class='form-inline' name="seleccion" id="form" method="post">
   <p> este es el cuerpo </p>
   <li onClick="realizaProceso(('Hola'));return true;" class="seven1" name="dato"><a data-toggle="modal" href="#"><b>CLIK AQUÍ para llamar a la función</b></a></li>
</br>  
   <button class="btn btn-info" type="submit" name="submit" >CLICK AQUÍ Botón normal</button>
   </form>
     
<?php 
    
// fin del else del post
?> 


<script>
function realizaProceso(datoid){
        var parametros = {
                "datoid" : datoid                
        };
        $.ajax({
                data:  parametros,
                url:   '2.php',
                type:  'POST',
                beforeSend: function () {
                        $("#form").html("Procesando, espere por favor...");
//                        alert (datoid);
                },
                success:  function (response) {
                        $("#form").html(response);
                }
        });
        }
</script>
</body>
</html>

El problema está en que si hago clic en el botón del formulario este script funciona:

Código PHP:

<?php
echo 'Tipo PHP: '.$_SERVER["REQUEST_METHOD"].'</br>';
include (
"bootstrap.php"); 
if (
$_SERVER["REQUEST_METHOD"] == "POST") {
      echo 
'Valor de RealizaProceso'.$_POST['datoid'].'</br>';
      echo
'<script>
         alert ("Dentro del script");
    </script>'
;
?>

pero si hago clic en la etiqueta 'li': pasa por la función realizaproceso, cargo la variable 'datoid' pero no se pone en marcha el script de arriba y es porque en realidad la función realizaproceso no carga la página 2.php como lo hace el botón del formulario.
Este script lo que hace es abrir una ventana modal de bootstrap (para simplificar el ejemplo lo he quitado y he puesto un alert), ¿hay forma de que la función realizaproceso cargue la página de forma que el script funcione?
Si me puedes echar un cable te lo agradecería, estoy parado en este asunto.
Gracias

Ñuño Martínez 09-08-2016 21:01:54

Personalmente, sólo he tenido malas experiencias usando jQuery así que poco te puedo ayudar por ahí.

De todas formas, lo que estás preguntando es cómo obtener información del servidor (vía AJAX) y añadir o sustituir elementos con esta información en la página, ¿no?

roman 09-08-2016 22:25:06

Vamos a ver, esto no tiene nada que ver con el tipo de etiqueta usada sino con una expectativa errónea. Voy a tratar de clarificar con un ejemplo extra resumido que, me parece, refleja la estructura original:

Código PHP:

// Este es el archivo prueba.php

<script type='text/javascript' src='jquery-3.1.0.min.js'></script>
<?php if($_SERVER['REQUEST_METHOD'] == 'POST'): ?>
<script type='text/javascript'>
    $(document).ready(function() {
        alert("<?= $_SERVER['HTTP_USER_AGENT'?>");
    });
</script>
<?php else: ?>
<form method='post'><button type='submit'>Procesar</button></form>
<li onclick='procesar();'>Hola</li>
<?php endif ?>
<script type='text/javascript'>
    function procesar() {
        $.ajax({
            url: 'test.php',
            type: 'POST',
            success: function(response) {
                alert(response);
            }
        });
    }
</script>

Cuando el servidor recibe una petición POST de prueba.php (ya sea mediante el envio normal del formulario o via ajax), llama al ejecutable PHP quien genera un documento HTML:

Código:

<script type='text/javascript' src='jquery-3.1.0.min.js'></script>
<script type='text/javascript'>
        $(document).ready(function() {
                alert("Mozilla/5.0 (Windows NT 10.0; Trident/7.0; rv:11.0) like Gecko");
        });
</script>
<script type='text/javascript'>
        function procesar() {
                $.ajax({
                        url: 'test.php',
                        type: 'POST',
                        success: function(response) {
                                alert(response);
                        }
                });
        }
</script>

que el servidor devuelve al cliente.

Ahora bien, cuando la petición se hace via el formulario, el navegador recibe el documento generado, lo presenta en pantalla y ejecuta el código javascript que contenga.

Pero, si la petición se hace via ajax, el documento generado no se procesa de ninguna forma, simplemente se recibe como texto (lo cual se corrobora con el alert(response)) y ya tendría que ser el código del manejador success el encargado de procesarlo (algo, por cierto, poco recomendable)

LineComment Saludos

mamcx 10-08-2016 01:28:04

Que hariamos sin el codigo spaguetti de PHP!

Si puedes, te recomiendo que uses algún framework que organize la manera de programar en PHP (quienes usen PHP podrian recomendar) porque hacer spaguetti en HTML, en PHP y en JS todo a la vez se vuelve rapidamente engorroso.

------

Lo mas basico es que en el metodo de AJAX de Jquery no recibes los errores, solo asumes que siempre tendra exito. Conecta el evento de error pa que sepas que es lo que pasa.

Segundo, AJAX es ppalmente para pasar DATOS, no HTML. Eso significa que debes separar la llamada que devuelve HTML de la que devuelve DATOS para ajax. Luego debes reemplazar el DOM en el cliente con los datos nuevos.

Parsec 10-08-2016 12:32:05

Gracias Ñuño, Roman y mamcx.

mamcx, me podrías aclara esto con un ejemplo:
Cita:

Significa que debes separar la llamada que devuelve HTML de la que devuelve DATOS para ajax. Luego debes reemplazar el DOM en el cliente con los datos nuevos.
Un saludo

mamcx 10-08-2016 15:30:15

Basicamente, en vez de devolver HTML devuelve un JSON (o similar).

Parsec 11-08-2016 11:51:48

Gracias por contestar mamcx pero sigo sin entenderlo, primero dices:
Cita:

separar la llamada que devuelve HTML de la que devuelve DATOS para ajax
y luego:
Cita:

en vez de devolver HTML devuelve un JSON
.

¿Hay que separar o hay que cambiar?, si pudieses poner un ejemplo con mi código (copiado más arriba) te lo agradecería.

Un saludo

mamcx 11-08-2016 15:58:33

No manejo PHP, pero es tan simple como:

Cita:


funcion RetornoAjax:
...
...
return AJson()

funcion RetornoHTML:
...
...
return AHTML()

Y llamas de acuerdo a la necesidad.

Parsec 20-08-2016 19:18:19

Hola mamcx, no me sirve tu respuesta es demasiado genérica, y dices:
Cita:

No manejo PHP
Estoy en el foro de php si no lo manejas sería mejor que no respondas.

Gracias de todas formas.

mamcx 22-08-2016 21:31:38

Para el HTML/JS le es completamente irrelevante el lenguaje del backend.

Y la tecnica es identica en cualquie lenguaje. Retornar datos de acuerdo a como mejor le sirva al cliente (aqui, JS).


La franja horaria es GMT +2. Ahora son las 11:26:19.

Powered by vBulletin® Version 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Traducción al castellano por el equipo de moderadores del Club Delphi