Using Ajax to run php function

Question

Hi I am trying to create a button that will call a php function to add products to Shopify from web application

First this is my result.php file which is showing amazon products successfully http://codepad.org/MPs4y1Qu

There you will find two important things

first <button type="button">add</button>and

<script type="text/javascript">
    $(document).ready(function(){
        $("button").click(function(){
            $.ajax({
                type: 'POST',
                url: 'create_product.php',
                success: function(data) {
                    prompt(data);
                }
            });
        });
    });
</script>

The problem is when I click on Add Button it shows the HTML of the page but nothing happens on the create_product.php file. I want it to call that function. On the other hand my code on create_product is fine and working 100% separately but not with my web app.

here is my create_product.php code:

http://codepad.org/at7LtcMK

Doesn't look like you are actually passing any data to create_product.php. You need a data key in your $.ajax options containing the info you want to utilize in your PHP script, which will be available via $_POST — Rob M.
– Rob M., Commented Mar 17, 2017 at 17:41
can you please give me a clear point? How do I utilize $_POST via data and what actually should it include? — alex bliss
– alex bliss, Commented Mar 17, 2017 at 17:45
add an error handler to the the Ajax call.Also you should cancel the butotn click — epascarello
– epascarello, Commented Mar 17, 2017 at 17:45
@epascarello Hi after adding error handling on ajax. I get 200 OK message. which means ajax is running fine. what do you mean by cancelling the button click? — alex bliss
– alex bliss, Commented Mar 17, 2017 at 18:03

Kaique Garcia · Accepted Answer · 2017-03-21 12:29:43Z

Your AJAX call will send data by POST or GET, then you can do anything with that and also return something to your script. It's simple like that.

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

Let's work with examples. If you want to make A+B on your server you will need to have a form with inputs like this:

<form id="yourform">
    <div><input name="A" type="text" /></div>
    <div><input name="B" type="text" /></div>
</form>

Then you will program some script to say what your form will do on submit. As you're using jQuery, let's work with jQuery:

$("#yourform").submit(function(e) {
    e.preventDefault();
    $.ajax({
        type: "POST", //or "GET", if you want that
        url: "yourfile.php",
        data: $(this).serializeArray(), //here goes the data you want to send to your server. In this case, you're sending your A and B inputs.
        dataType: "json", //here goes the return's expected format. You should read more about that on the jQuery documentation
        success: function(response) { //function called if your request succeeds
            //do whatever you want with your response json;
            //as you're learning, try that to see on console:
            console.log(response);
        },
        error: function(response) { //function called if your request failed
            //do whatever you want with your error :/
        }
    });
});

But what're you doing on the server? Well, I just want to return my input's, just to check. Here goes my PHP:

<?php
    header("Content-type: application/json; charset=utf-8"); //that's required to return any JSON data
    if(isset($_POST, $_POST['A'], $_POST['B']))
        exit(json_encode($_POST));
    else
        exit("INVALID REQUEST.");
?>

That's the way you can send information with AJAX to execute something on PHP.

liontass · Accepted Answer · 2017-03-17 18:01:38Z

1

You can add the following ajax function into your script.Note that the ajax function sends a data with value triggerPHP to the page that you have the PHP code. So at the .php page that you run the php code you must set a code to "catch" in someway the triggerPHP data via $_POST[] superglobal and the execute whatever you want. EG

if(isset($_POST['triggerPHP'])){
//execute the code here remember to echo  json_encode(data)

}

JQuery ajax :

$(document).ready(function(){
     $("button").click(function(){

     $.ajax({
     type: 'POST',
     data:'triggerPHP',
     dataType: "json",
     url: 'create_product.php',
     success: function(data) {
     prompt(data);
     },
     error: function(XMLHttpRequest, textStatus, errorThrown) {
     alert("some error");
  }  
     });
     });
    });

answered Mar 17, 2017 at 18:01

liontass

74010 silver badges26 bronze badges

4 Comments

alex bliss Over a year ago

Thank you @liontass I have got it. Just one thing //execute the code here remember to echo json_encode(data) on which file will I write this code? create_product or result.php? and what should go inside of it?

liontass Over a year ago

the echo it must be in the create_product.You should have a string, a number an array HTML code or script

alex bliss Over a year ago

I am sorry but I am very unclear, if(isset($_POST['triggerPHP'])){ //execute the code here remember to echo json_encode(data) where it should go and what it should contain? if you have checked my create_product.php file codepad.org/at7LtcMK which has all the code here. it has Title,body_html which must be replaced by my amazon product upon clicking the add button and it should go to my shopify store

Kaique Garcia Over a year ago

Your ajax should have data "triggerPHP=somevalue"

Collectives™ on Stack Overflow

Using Ajax to run php function

2 Answers 2

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related