Ejecute la función PHP con onclick


92

Estoy buscando una solución simple para llamar a una función PHP solo cuando se hace clic en una etiqueta .

PHP:

function removeday() { ... }

HTML:

<a href="" onclick="removeday()" class="deletebtn">Delete</a>

ACTUALIZACIÓN: el código html y PHP están en el mismo archivo PHP


5
HTML ejecuta funciones de Javascript, que se ejecutan en el cliente. PHP se ejecuta en el servidor. Necesita aprender sobre AJAX.
— Barmar

pero ¿por qué AJAX? todo el código está en el mismo archivo PHP.
— Mike

1
¿Por qué AJAX? Bueno, para averiguarlo, simplemente puede ejecutar cualquier script php y ver el código de su ejecución. Nuevamente, Ajax es la única forma en que puede hacer eso .
— Yang

2
La respuesta marcada funcionará como un botón si usa <a role="button" href="?action=removeday" class="debatebtn">Delete</a>donde se detecta la acción y ejecuta la función removeday () similar a if($action == 'removeday'){ removeday(); }. Sé que es tarde, pero creo que aún podría ayudar a alguien con este problema. C§
— CSS

Respuestas:


142

Primero, comprenda que tiene tres idiomas trabajando juntos:

  • PHP: solo lo ejecuta el servidor y responde a solicitudes como hacer clic en un enlace (GET) o enviar un formulario (POST).

  • HTML y JavaScript: solo se ejecuta en el navegador de alguien (excepto NodeJS).

Supongo que su archivo se parece a:

<!DOCTYPE HTML>
<html>
<?php
  function runMyFunction() {
    echo 'I just ran a php function';
  }

  if (isset($_GET['hello'])) {
    runMyFunction();
  }
?>

Hello there!
<a href='index.php?hello=true'>Run PHP Function</a>
</html>

Debido a que PHP solo responde a las solicitudes (GET, POST, PUT, PATCH y DELETE a través de $ _REQUEST), así es como debe ejecutar una función PHP aunque estén en el mismo archivo. Esto le brinda un nivel de seguridad, "¿Debo ejecutar este script para este usuario o no?".

Si no desea actualizar la página, puede realizar una solicitud a PHP sin actualizar a través de un método llamado Asynchronous JavaScript and XML (AJAX).

Sin embargo, eso es algo que puedes buscar en YouTube. Solo busca "jquery ajax"

Recomiendo Laravel a cualquier persona nueva para comenzar bien: http://laravel.com/


3
Solo para mencionar, supongo que eres bastante nuevo en PHP, me gustaría recomendar laravel.com como marco. Personalmente, me hubiera encantado omitir todo el "aprendizaje de php genérico" e ir directamente a un marco potente. Este es el que también uso ahora.
— Michael J. Calkins

5
Hombre, muchas gracias, tu respuesta no solo me ayudó con esta duda, ¡sino que también me hizo entender php mucho mejor! ¡Gracias de nuevo!
— Feel The Noise

Gracias estoy buscando esto. ¿Cómo puedo implementar esto con wordpress?
— Firefog

1
Gracias, empezaré a concentrarme en laravel por tu mención.
— Mohamed Abulnasr

1
If you don't want to refresh the page, you can make a request to PHP without refreshing via a method called Asynchronous JavaScript and XML (AJAX).Bueno, sí lo incluyó onclicken la pregunta, por lo que está bastante claro que el objetivo es realizar una acción sin actualizar. ¬_¬
— Synetech

38

En javascript, crea una función ajax,

function myAjax() {
      $.ajax({
           type: "POST",
           url: 'your_url/ajax.php',
           data:{action:'call_this'},
           success:function(html) {
             alert(html);
           }

      });
 }

Luego llama desde html,

<a href="" onclick="myAjax()" class="deletebtn">Delete</a>

Y en tu ajax.php,

if($_POST['action'] == 'call_this') {
  // call removeday() here
}

Solo para aclarar: typedebe usarse en jQuery anterior a 1.9.0, mientras que methodes un alias y debe usarse en versiones más nuevas.
— Alejandro Nava

1
La misma solución también proporcionada en Vanilla JavaScript ayuda mucho mejor a los principiantes. Digo esto como un usuario más experimentado de JavaScript que una vez fue un principiante completo pero competente en PHP.
— Ken Ingram

11

Tendrá que hacer esto a través de AJAX . Te recomiendo ENCARECIDAMENTE que uses jQuery para facilitarte esto ...

$("#idOfElement").on('click', function(){

    $.ajax({
       url: 'pathToPhpFile.php',
       dataType: 'json',
       success: function(data){
            //data returned from php
       }
    });
)};

http://api.jquery.com/jQuery.ajax/


1
¿Por qué AJAX? sería el mismo archivo PHP (actualicé mi pregunta)
— Mike

3
Por lo que explicó @Barmar, no funciona así. Querrá colocar el php en un archivo separado, luego hacer referencia a ese archivo en su solicitud AJAX.
— AO

1
El parámetro "url:" hace referencia a un archivo php externo, ¿cómo puedo hacer referencia a la función php en el mismo archivo?
— Joe Doe

2
@JoeDoe no puede, coloque la función en un archivo externo
— AO

11

Se puede hacer y con php bastante simple si este es tu botón

<input type="submit" name="submit>

y este es tu código php

if(isset($_POST["submit"])) { php code here }

se llama al código get cuando se publica enviar get, lo que ocurre cuando se hace clic en el botón.


1

Intenta hacer algo como esto:

<!--Include jQuery-->
<script type="text/javascript" src="jquery.min.js"></script> 

<script type="text/javascript"> 
function doSomething() { 
    $.get("somepage.php"); 
    return false; 
} 
</script>

<a href="#" onclick="doSomething();">Click Me!</a>

1

Solución sin recargar la página

<?php
  function removeday() { echo 'Day removed'; }

  if (isset($_GET['remove'])) { return removeday(); }
?>


<!DOCTYPE html><html><title>Days</title><body>

  <a href="" onclick="removeday(event)" class="deletebtn">Delete</a>

  <script>
  async function removeday(e) {
    e.preventDefault(); 
    document.body.innerHTML+= '<br>'+ await(await fetch('?remove=1')).text();
  }
  </script>

</body></html>

0

Ésta es la forma más sencilla posible. Si el formulario se publica a través de una publicación, haga la función php. Tenga en cuenta que si desea realizar la función de forma asincrónica (sin la necesidad de volver a cargar la página), necesitará AJAX.

<form method="post">
    <button name="test">test</button>
</form>

    <?php
    if(isset($_POST['test'])){
      //do php stuff  
    }
    ?>

Note that if you want to perform function asynchronously (without the need to reload the page), then you'll need AJAX.Bueno, el onclickindicaría que eso es exactamente lo que quiere. ¬_¬
— Synetech

0

Aquí hay una alternativa con AJAX pero sin jQuery, solo JavaScript normal:

Agregue esto a la primera página php / principal, desde donde desea llamar a la acción, pero cámbielo de una aetiqueta potencial (hipervínculo) a un buttonelemento, para que ningún bot o aplicación maliciosa (o lo que sea) haga clic en él.

<head>
<script>
  // function invoking ajax with pure javascript, no jquery required.
  function myFunction(value_myfunction) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        document.getElementById("results").innerHTML += this.responseText; 
        // note '+=', adds result to the existing paragraph, remove the '+' to replace.
      }
    };
    xmlhttp.open("GET", "ajax-php-page.php?sendValue=" + value_myfunction, true);
    xmlhttp.send();
  }

</script>
</head>

<body>

  <?php $sendingValue = "thevalue"; // value to send to ajax php page. ?> 

  <!-- using button instead of hyperlink (a) -->
  <button type="button" onclick="value_myfunction('<?php echo $sendingValue; ?>');">Click to send value</button>

  <h4>Responses from ajax-php-page.php:</h4>
  <p id="results"></p> <!-- the ajax javascript enters returned GET values here -->

</body>

Cuando buttonse hace clic en el, onclickusa la función de javascript del encabezado para enviar $sendingValuevía ajax a otra página php, como muchos ejemplos antes de este. La otra página, ajax-php-page.phpbusca el valor GET y regresa con print_r:

<?php

  $incoming = $_GET['sendValue'];

  if( isset( $incoming ) ) {
    print_r("ajax-php-page.php recieved this: " . "$incoming" . "<br>");
  } else {
    print_r("The request didn´t pass correctly through the GET...");
  }

?>

La respuesta de print_rluego se devuelve y se muestra con

document.getElementById("results").innerHTML += this.responseText;

Los +=puebla y se suma a los elementos HTML existentes, eliminando los +cambios justos y reemplaza el contenido existente del HTML pelemento "results".


-3

Prueba esto, funcionará bien.

<script>
function echoHello(){
 alert("<?PHP hello(); ?>");
 }
</script>

<?PHP
FUNCTION hello(){
 echo "Call php function on onclick event.";
 }

?>

<button onclick="echoHello()">Say Hello</button>

2
Eso no funciona (incluso si lo limpia), pero además, no puede funcionar. El código PHP se procesa previamente cuando se carga; no se ejecuta en tiempo de ejecución.
— Synetech

O no leyó la pregunta o no probó su código, ya que esto no funcionaría.
— Mr PizzaGuy
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.