How to call php code from button onclick with Ajax?

Question

I'm new into php and I am trying to call code from another file. I try to use ajax to so, because later I would like to add parameters. But unfortunattely for me nothing appen when I click on my button.

I have a button in my file admin.php that is written like this:

<button onclick="clickMe()"> Click </button>

And in the same file I have my ajax code in script balise:

    <script>
                function clickMe() {
                    $.ajax( {
                        url: 'delete.php',
                        type: "POST",
                        success: test() {
                            alert('ok');
                        }
                        error : test(){
                                alert("error");                                  
                            }
                    });
                }
</script>

And here is the code that I'm trying to call in my ajax, the function test in the file delete.php:

<?php

function test() {
    echo "Hello the World! ";
}

?>

I wondering if I maybe need to put the code in delete.php in a function ?

Do you think I need to post the entirety of my admin.php file, even thought a lot of the code is not related to the question ?

EDIT: I forgot to mention; i have require delete file in my admin one:

require 'delete.php';

`test()` is not invoked in the PHP file. `test()` also is undefined in the JS scope. You need to do a bit more research on this. https://learn.jquery.com/ajax/... it would be easier to not use a function in PHP, just output what you want there for testing — user3783243, Sep 29 '22 at 14:14
I forgot to mention, but I have a `require 'delete.php';` higer in my admin.php. Is that what you mean by test is not invoked ? — , Sep 29 '22 at 14:17
No, JS function calls dont relate to PHP calls. PHP runs first then JS and other client processes run. View the page source and you'll see there is not PHP there. Also view the developer console and you should see an error about undefined function. — user3783243, Sep 29 '22 at 14:20
Does this answer your question? [What is the difference between client-side and server-side programming?](https://stackoverflow.com/questions/13840429/what-is-the-difference-between-client-side-and-server-side-programming) — user3783243, Sep 29 '22 at 14:21
Check your browsers developer console. As far as I know, `success: test() { ... }` should throw a syntax error. You're executing `test()` directly there, and you can't add a body to a function call like that (the `{ ... }` after the function call). You're also missing a `,` before the `error:`-parameter. You might need to go through some JS 101 guides to learn JS syntax and basic debugging. — M. Eriksson, Sep 29 '22 at 14:36
Honestly I'm not sure if I understand right, but I getting what I'm trying to do is impossible because server and client side are distinct ? — , Sep 29 '22 at 14:42
Server runs first, client runs second, client can send to server and get a response via AJAX — user3783243, Sep 29 '22 at 18:27

score 0 · Answer 1 · answered Sep 29 '22 at 14:45

I don't know jQuery, but I think your code should look something like this:

<?php
// delete.php
// make somthing
return 'Helo Word';

<script>
function clickMe() {
    $.ajax( {
        url: 'delete.php',
        type: "POST",
        success: response => {
            alert(reponse);
        },
        error: error => {
            alert(error);
        }
    });
}
</script>

score 0 · Answer 2 · answered Sep 29 '22 at 15:38

let's assume that your js code is working(i'm bad with JQuery). The JS code and the PHP code are living in different worlds but can connect by HTTP requests(XML-AJAX) and some others.

You can do a request to a PHP page like my-domain.com/the-page.php?get_param_1=value(GET method), and you can pass the same params(and a little more) by POST method. GET and POST params are looking like : param_name=param_value&param_name=param_value&param_name=param_value

You can't call directly PHP function(like var_dump('123);), but you can do this request with JS my-domain.com/the-page.php?call_func=myFunc123&printIt=HelloMate

to php page

<?php

function myFunc123($printText) { echo $printText; }

if (array_key_exists('call_func', $_GET)) {
   
   $param_callFunc = $_GET['call_func'];
   
   if ($param_callFunc == 'myFunc123') { myFunc123($_GET['printIt']); }
   
}

?>

Yes, you can pass any existing function name and call it, but it's not safe in future usage. Above, i use "page" word because you should do a request, not php file read or access.

score 0 · Accepted Answer · answered Oct 03 '22 at 12:18

Here is how I finally did it :

I gived an id to my button:

<button id="<?php echo $rows['id']; ?>" onclick ="deletedata(this.id)">Delete</button>

I give in deletedata the parameter this.id, it's a way to give the id of the button as parameter, then I use Ajax to call delete:

<script type="text/javascript">
        // Function
            function deletedata(id){
                   $.ajax({
                        // Action
                        url: 'admin',
                        // Method
                        type: 'POST',
                        data: {
                        // Get value
                        id: id,
                        action: "delete"
                        },
                        success:function(response){
                        }
                    });
                };
    </script>

Here is the tricky thing, I didn't use a fonction as I thought I needed. Instead I did this :

 if (isset($_POST["action"])) {
            echo "Hello the World! ";
            // Choose a function depends on value of $_POST["action"]
            if($_POST["action"] == "delete"){
                mysqli_query($conn, "DELETE FROM bdd_sites WHERE id = " . $_POST['id'].";");
            }
            header('Location: '.$_SERVER['REQUEST_URI']);
          }
        ?>

How to call php code from button onclick with Ajax?

3 Answers3