Login   Register  
PHP Classes
elePHPant
Icontem

File: test_jquery.html

Recommend this page to a friend!
Stumble It! Stumble It! Bookmark in del.icio.us Bookmark in del.icio.us
  Classes of Jo Giraerts  >  cjEvents  >  test_jquery.html  >  Download  
File: test_jquery.html
Role: Auxiliary data
Content type: text/plain
Description: Test JQuery
Class: cjEvents
Handle browser events in PHP
Author: By
Last change:
Date: 2010-08-25 02:14
Size: 2,841 bytes
 

Contents

Class file image Download
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>cjEvents - Test JQuery</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <head>
        <title>cjEvents Test</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
        <script type="text/javascript" src="json2.js"></script>
        <script type="text/javascript" src="events.js"></script>
        
        <script type="text/javascript">
            function callback1()
            {
                var args = new Array();
                var ev = arguments[0];
                
                // we count from 1 because arguments[0] is always the eventname
                for (i=1; i<arguments.length; i++) {
                    args[i-1] = arguments[i];
                }
                $('#event1answer').html('We received a jsevent ('+ev.type+'). The arguments of the event are: '+args.join(', '));
            }

            function callback2()
            {
                var args = new Array();
                var ev = arguments[0];
                
                // we count from 1 because arguments[0] is always the eventname
                for (i=1; i<arguments.length; i++) {
                    args[i-1] = arguments[i];
                }

                $('#event2answer').html('We received a jsevent ('+ev.type+'). The arguments of the event are: '+args.join(', '));
            }

            // Binding the events to their callback
            $(document).ready(function () {
                $(document.body).bind('jsevent1', callback1);
                $(document.body).bind('jsevent2', callback2);

                // Enable if you want to poll for events from the backend (useful for chat-apps, automatic loading of more content, ..)
                // If you know that you'll only get events that are an answer to events you raised in javascript, you don't need to enable this'
                // listenForPHPEvents();
            });
        </script>
    </head>
  <body>
      <h1>cjEvents Jquery Test</h1>
      <div>
          When clicking 1 of the buttons, you will raise an event that gets sent to PHP. We've set up PHP to receive those events and
          raise a <i>jsevent</i> again to answer for it. The <i>jsevent</i> will be captured by the javascript callbacks on this page, 
          and you will see the answer appearing next to the button you clicked.
      </div><br/>
      
      <input type="button" value="Raise phpevent1" onclick="raisePHPEvent('phpevent1', 'arg1-1', 'arg1-2');" /> <span id="event1answer"></span><br/>
      <input type="button" value="Raise phpevent2" onclick="raisePHPEvent('phpevent2', 'arg2-1', 'arg2-2')" /> <span id="event2answer"></span>
  </body>
</html>