0

Can anyone tell me what I am missing here please?

Here is the basic HTML file with a simple "Create" and "Destroy" button that will eventually call an API. The button click with Ajax seems to work, but the PHP function is not being called.

testapi.html

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('.button').click(function(){
        var clickBtnValue = $(this).val();
        var ajaxurl = 'ajax.php',
        data =  {'action': clickBtnValue};
        $.post(ajaxurl, data, function (response) {
            alert("Action performed successfully!");
        });
    });

});
</script>
</head>
<body>
    <input type="submit" class="button" name="create" value="Create" />
    <input type="submit" class="button" name="destroy" value="Destroy" />
</body>
</html>

ajax.php

if (isset($_POST['action'])) {
    switch ($_POST['action']) {
        case 'create':
            create();
            break;
        case 'destroy':
            destroy();
            break;
    }
}
function create() {
    echo "Create function.";
    exit;
}
function destroy() {
    echo "Destroy function.";
    exit;
}
Atomiklan
  • 5,164
  • 11
  • 40
  • 62
  • `else { echo "Not set"; }` add that to your `if` statement; does it go there? – Funk Forty Niner Oct 24 '17 at 18:44
  • [Have you watched the AJAX request / response in the browser's developer tools? Have you included the jQuery library in the project? Are there any errors reported? Are you running this on a web-server?](http://jayblanchard.net/basics_of_jquery_ajax.html) – Jay Blanchard Oct 24 '17 at 18:46
  • Great idea! Did not seem to make a difference. I am not seeing any output. – Atomiklan Oct 24 '17 at 18:46
  • No I have not watched. I forgot I could do that, let me figure out how to bring that up. Yes look in the head of html. Yes, running on a webserver. No errors reported, just no output. – Atomiklan Oct 24 '17 at 18:47
  • BTW, to answer your comment: questions starting like this: *"Can anyone tell me what I am missing here please?"* tend to attract downvotes because telling you what you're missing might require a crystal ball. – Jay Blanchard Oct 24 '17 at 18:52
  • 2
    Case? Your input has `value="Create"`, your code checks for `case 'create':` – brombeer Oct 24 '17 at 18:56
  • Hmm, looking at the console and I see now under the response that I am getting "Create function." which tells me it is working, its just not echoing that to the screen. – Atomiklan Oct 24 '17 at 18:57
  • You don't have anything in your AJAX to echo it to the screen. All you have is an alert. Change that to `alert(response);` and see what happens – Jay Blanchard Oct 24 '17 at 18:59
  • @Kerbholz, you were correct. Correct the case issue and the function is running now. So it was a two part issue. The case was preventing the function from running and apparently I dont yet fully understand ajax. How do I get it to then echo in ajax? – Atomiklan Oct 24 '17 at 19:01
  • Read the link in my comment above - it describes the process for updating the local web page with returned data. – Jay Blanchard Oct 24 '17 at 19:03
  • @Jay Blanchard FIXED! Thanks! – Atomiklan Oct 24 '17 at 19:03
  • Thanks to both of you! Both issues now fixed and the code is running properly! – Atomiklan Oct 24 '17 at 19:04
  • Please post a proper answer and mark as accepted. – Marco Oct 24 '17 at 19:06
  • 1
    Always use a `default:` switch case ;) – Erik Terwan Oct 24 '17 at 19:38

1 Answers1

1

Your case is wrong: the value in your input is Create, while in your code you check for create.

Change

switch ($_POST['action']) {
        case 'create':
            create();
            break;
        case 'destroy':
            destroy();
            break;
    }

to 

switch ($_POST['action']) {
        case 'Create':
            create();
            break;
        case 'Destroy':
            destroy();
            break;
    }
brombeer
  • 8,716
  • 5
  • 21
  • 27