[buddypress-trac] [BuddyPress] #5052: Ajax on group extension page on BP-default child theme returns HTML of referer page instead of data

[buddypress-trac]

#5052: Ajax on group extension page on BP-default child theme returns HTML of
referer page instead of data
--------------------------+-----------------------------
 Reporter:  matom         |      Owner:
     Type:  defect (bug)  |     Status:  new
 Priority:  normal        |  Milestone:  Awaiting Review
Component:  Groups        |    Version:  1.7
 Severity:  normal        |   Keywords:
--------------------------+-----------------------------
 I have a child theme of the BP Default theme and a group extension that
 loads and displays data depending on user selection using AJAX (jQuery).
 This was all working fine in BP 1.5.2 / WP 3.4.1. Since updating to BP
 1.7.2 and WP 3.5.1 this no longer works correctly. Instead of
 loading/displaying the data it supposed to, it loads and displays the full
 html of the admin page again.

 To recreate:

 1. Install WordPress 3.5.1 and Buddypress 1.7.2
 2. Create a child theme of BP default
 3. Add this code into the functions.php file of the child theme:

 {{{

 <?php

 if ( class_exists( 'BP_Group_Extension' ) ) :
     class My_Group_Extension extends BP_Group_Extension {

         function __construct() {
             $this->name = 'My Group Extension';
             $this->slug = 'my-group-extension';

             $this->create_step_position = 21;
             $this->nav_item_position = 31;
         }

         function edit_screen() {
             if ( !bp_is_group_admin_screen( $this->slug ) )
                 return false; ?>

             <h2><?php echo esc_attr( $this->name ) ?></h2>
             <a href="#" id="test-link">Click to load AJAX Data.</a>
             <div id="test-result">My Result</div>
             <?php
             wp_nonce_field( 'groups_edit_save_' . $this->slug );
         }

     }

     bp_register_group_extension( 'My_Group_Extension' );

 endif; // class_exists( 'BP_Group_Extension' )


 function my_display_test(){
         die("Hello World!");
 }
 add_action('wp_ajax_my_display_test', 'my_display_test');

 function my_scripts() {
         wp_enqueue_script( 'main-js', get_stylesheet_directory_uri() .
 '/main.js', array('jquery'));
 }
 add_action( 'wp_enqueue_scripts', 'my_scripts' );
 ?>
 }}}

 4. Add this code into a main.js file in the child theme:

 {{{
 var $ = jQuery.noConflict();

 $(function(){
         $('#test-link').click(function(){
                  $.post( ajaxurl, {
                                   action: 'my_display_test'
                           },
                           function(response) {
                                 $('#test-result').html(response);
                           }
                   );
                  return false;
         });
 });
 }}}

 5. Create a new group and go the the "My Group Extension" admin page.
 6. Click on the "Click to load AJAX Data." link

 This will return the full HTML of the referer page into the #test-result
 DIV instead of "Hello World!".

 Using the same code as above in a non-BP theme (ie. twentytwelve) returns
 the "Hello World!" correctly.

 I've also found out that it is somehow related to the URL of the referer
 page. If I copy the the full generated HTML of the group extension admin
 page into the groups/single/home.php file of the default BP theme
 (replacing all code), I get the following results:

 - on /groups/my-group/ it returns "Hello World!" correctly
 - on /groups/my-group/admin/edit-details it returns "Hello World!"
 correctly
 - on /groups/my-group/admin/my-group-extension/ it returns the incorrect
 data (the full HTML of the current page)

--
Ticket URL: <https://buddypress.trac.wordpress.org/ticket/5052>
BuddyPress <http://buddypress.org/>
BuddyPress