Shopify Question posted in
The Shopify help center can be found here.

Using Ajax to run php function – Shopify

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

Tags:

2

Answers


  1. 0

    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");
  }  
     });
     });
    });
    Login or Signup to reply.
  2. 0

    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.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search