0
muy buenas 
quisiera saber como pasar el valor de una consulta hecha en php a un documento en java script
esta es mi consulta 
esta consulta selecciona de la tabla camion el km actual 

$query4=mysqli_query($mysqli,"SELECT ca_km_act from camion where ca_placa='$placa'");
if (isset($_POST['kilometraje'])) 
{
    $kilometraje=$_POST['kilometraje'];
}
while ($km4_id = mysqli_fetch_array($query4)) 
$asx4=$km4_id['ca_km_act'];

el resultado que otorga es 15000

lo que necesito es pasar el valor de la variable $asx4 que esta en archivo php a un archivo en java script para poder hacer una validación 
mi archivo java script es 

 
 function validar_inspecciones(formulario) 
{
    var x = '<?=$asx4?>';// no muestra el valor que debe ser 15000
if (x>formulario.km.value){
        document.getElementById("errorkm").innerText ="el valor debe ser mayor "+ x;
        formulario.km.focus();
        return false;
    }
}

// como debo hacer para pasar el valor de la variable y lo pueda leer java script agradecería mucho si me pueden ayudar con ese problema o guiarme como podría resolverlo ya que antes tenia todo hecho mediante php hacia la consulta obtenía el valor y preguntaba si km>ca_km_act pasaba a realizar cierta acción, no es la manera correcta de hacerlo ya que el código se hace muy largo ya que se basa solo en toma de decisión en un documento en php

1
  • Una llamada Ajax es lo más usual. O podrías incluir el valor en algún campo del documento html y luego leer ese campo con JavaScript. Saludos el 9 dic. 2021 a las 5:42

2 respuestas 2

0

Es mas fácil de lo que crees.

Opcion 1 : No hace falta Ajax ni nada solo debes cuidar que declares la variable antes de incluir el archivo .js

Recuerda tener en cuenta el scope de las variables en JavaScript y diferencia entre let x y var x.

Solo tienes que incluir la siguiente linea:

$asx4=$km4_id['ca_km_act'];
echo "<script> var x = '$asx4' </script>";

En tu Js ya puedes utilizar esa variable

<script>
console.log(x)
</script>

Opcion 2 : Asigna el valor a un <input> de tipo hidden y luego con getElementById obtienes el valor en javascript.

Algo así:

html

<input type="hidden" id="oculto" value="<?=$asx4?>" />

JavaScript

<script>
  let x = document.getElementById("oculto").value
  console.log(x)
</script>
0

Lo primero, deberías mantener el código JavaScript separado del documento HTML siempre que sea posible. Dicho esto, puedes imprimir un valor que usarás en JS igual que cualquier otro elemento de la página:

<?php

// Este bloque contiene HTML
echo '<h1>Ejemplo</h1>';

// Este bloque contiene JS
// La variable name JS tendrá el valor de la variable PHP $name
// El código muestra una ventana emergente con un mensaje
echo '<script>';
echo 'var name = "' . $name . '"';
echo 'alert("El nombre es: " + name)';
echo '</script>';

// Este bloque contiene HTML
echo '<p>Lorem ipsum</p>';

Y como yo lo hago:

  • El JavaScript en sus propios ficheros. Los cargo en el head del documento HTML en un orden determinado, incluyendo el atributo defer, p.e.:

  • Los valores se "imprimen" en el HTML de la página. Puedes optar por varias soluciones, algunas veces incluso se hace innecesario el JS:

    • Se puede imprimir HTML oculto y mostrarlo en su momento con JS o mediante CSS.

    • Los datos pueden imprimirse en el HTML como valores de campos de tipo hidden o como atributos data-x de elementos HTML a conveniencia.

Con esta última técnica se pueden guardar números, palabras, textos... o incluso JSONs si requieres más datos con algún tipo de estructura. Para recuperar y usar esos datos en JS se cargan los nodos donde se han incluido y se extraen. Para mantener cierta separación entre el HTML destinado a estructurar y visualizar el contenido de la página y el que se usa para almacenar datos, los campos ocultos con atributos data-x son una buena elección.

NOTA: esta forma de trabajo es independiente del lenguaje utilizado en el servidor web, al final el navegaodor esta trabajando con el HTML, JS y CSS que le llega...

Ejemplo (HTML impreso con PHP u otra tecnología de servidor):

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <!-- constructor de nodos DOM -->
    <script defer
        src="https://rawcdn.githack.com/oricis/JS-UI/e467ecb5a515e235cc85bdf9972399ef37fa92cf/src/dom/NodeBuilder.js"></script>

    <!--
        El JS va en los siguientes ficheros, lo pongo en la parte inferior
        del body para poder ejecutarlo en el ejemplo:

        <script defer src="./assets/js/utils/queries.js"></script>
        <script defer src="./assets/js/app.js"></script>
    -->
</head>
<body>
    <header>
        <h1>Ejemplo lista de personas</h1>
    </header>
    <main>
        <input type="hidden" id="people-total" value="2">
        <section id="name-list"
            data-people='[{"name":"Foo","age":21},{"name":"Baz","age":36}]'>
            <h3>Nombres y edades:</h3>
            <ul id="people"></ul>
            <p>Total: <strong class="people-total">0</strong></p>
        </section>
    </main>
    <footer>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
    </footer>

    <script>
        window.onload = () => {

            ////////////////////////////////////////////////////////////
            // Contenido del fichero "queries.js"

            function qs(strSelector) // js node
            {
                return document.querySelector(strSelector);
            }
            function getDataValue(node, strDataName) // string
            {
                return (strDataName
                    && node.nodeType === 1
                    && node.hasAttribute('data-' + strDataName))
                    ? node.getAttribute('data-' + strDataName)
                    : '';
            }

            ////////////////////////////////////////////////////////////
            // Contenido del fichero "app.js"

            const peopleTotal = qs('#people-total').value;
            const peopleDataContent = getDataValue(qs('section#name-list'), 'people');
            const peopleData = JSON.parse(peopleDataContent);

            const ulNode = qs('ul#people');
            for (let index = 0; index < peopleData.length; index++) {
                const personData = peopleData[index];
                const liNode = composeLiNode(
                    personData.name,
                    personData.age
                );
                ulNode.appendChild(liNode);
            }
            qs('strong.people-total').innerText = peopleTotal;


            function composeLiNode(name, age) // js node
            {
                const liText = name + ', ' + age;

                return nodeBuilder.build('li', {}, null, liText);
            }
        };
    </script>
</body>
</html>

En el ejemplo, he incluido un número como valor de un campo oculto, seguidamente lo recupero con JS y lo añado a la página. Se ha incluido un pequeño JSON dentro de un atributo data-people, de un section HTML que se usa para llenar de contenido una lista.

Hay que tener en cuenta, que lo que se imprime como HTML se recupera como string. Si los números se usaran en cálculos hay que convertirlos al primitivo correspondiente, un JSON de datos tambien hay que "parsearlo".

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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