AJAX Example with Construct 2

6

Index

Stats

23,915 visits, 72,443 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 14 Sep, 2011. Last updated 19 Feb, 2019

Construct 2 has an AJAX object that will allow you to make a request to a target page in order to return the resultant data to AJAX.LastData where we can use the information collected.

In this tutorial I'm going to show you:

1. How to set up a simple interface that can form as the boilerplate for future tutorials.

2. How to set up a simple php file (we can also use a simple .txt file)

3. How to connect the AJAX object to make a call to our target page then return it to our HTML5 page.

If you are already familiar with Construct 2, you can skip step 1. The AJAX stuff is after building the interface.

Here's an example of what we're going to make:

It's located at:

http://www.jtadeo.com/scirra/ajax/ajaxexample1/

If you click the image, it will do the following:

1. It will make a call to the target page. In our example the page is called ajaxexampleGET.php. It can really be any page that will render output to a browser window. For example, xml, txt or html.

2. When the call to the page is done, the information collected is stuffed into the AJAX.LastData object where we can then consume it in our game.

A critical part about getting data from a page is that there must be data to be collected. For example, if we go to:

http://www.jtadeo.com/scirra/ajax/ajaxexample1/ajaxexampleGET.php

You will notice that it just spits out the following information:

That is basically what we're after and we want that information in our HTML5 page.

This is the same AJAX technique I used to create Cash Roll, a game I originally created for the iPhone and now also available as an HTML5 game.

You can check it out at:

http://www.jtadeo.com/scirra/cashroll/

  • 0 Comments

Want to leave a comment? Login or Register an account!