Ajax url value to pass 'variable' to use in query

Question

I am in the midst of modifying a plugin in which I wish to get a value from a select list and auto-populate a textarea with values based on the selected value.

The php code come from a file named wpf-addusers.php but this file is not directly diplayed. The (absolute)url of the page that displays this information is http://localhost:8888/dev_wordpress/wp-admin/admin.php?page=mfgroups&mingleforum_action=usergroups&do=add_user_togroup.

My javascript (ajax) looks like this:

jQuery(function(jQuery){

jQuery('#usergroup').change(function() {

  jQuery.ajax({
      type: "GET",
      url: "wpf-addusers.php",
      data: { usergroup: jQuery(this).find(':selected').val() }
      }).done(function( results ) {
      console.log( results );
      });

   });


 });

When I use "wpf-addusers.php" I get a 404 error like so: GET http://localhost:8888/dev_wordpress/wp-admin/wpf-addusers.php?usergroup=The+Freedom 404 (Not Found)

The+Freedom is the value I want to use in my php code:

if(function_exists('home_url')){
$usergroups = $mingleforum->get_usergroups();
$team_title = $_GET[ 'usergroup'];
$team_id = $wpdb->get_var( "SELECT ID FROM $wpdb->posts WHERE post_title = '" . $team_title . "'" );
$players = get_users( array (
'meta_key' => 'team-meta',
'meta_value' => $team_id
));

echo "<div class='wrap'>
 <h2><img src='$image'> Add users</h2>";
echo "<form name='add_usertogroup_form' action='admin.php page=mfgroups&mingleforum_action=usergroups' method='post'>
<table class='widefat'>
  <thead>
    <tr>
      <th>User group</th>
      <th>User names </th>
    </tr>
  </thead>
  <tr class='alternate'>

    <td>"; echo "<select name='usergroup' id='usergroup'>
        <option selected='selected' value='add_user_null'>".__("Select User group", "mingleforum")."
        </option>"; 


        foreach($usergroups as $usergroup){
        echo "<option value='". $usergroup->id ."'>" . $usergroup->name . "</option>";

            }
            echo "</select></td>

     <td>"; echo "<textarea name='togroupusers' rows='10' columns='60'>";
            if ( isset($_GET[ 'usergroup'])){
                foreach($players as $player) {
                    echo $player->display_name . ", ";
                }
            }
            echo "</textarea>";

    echo "<br/>
    <i>The above players will be added to the group.</i></td>
  </tr>
  <tr class='alternate'>
    <td colspan='2'><input class='button' name='add_user_togroup' type='submit' value='".__("Add users", "mingleforum")."' /></td>
  </tr>
</table>
</form>
</div>";
}

Does anyone know how I can pass 'usergroup' to my php code?

By the way, My javascript is enqueued properly on the admin side. So I presume I don't a specific handler function for ajax? (That isn't the question just a sidenote)

Answer 1

You say that the page URL is http://localhost:8888/dev_wordpress/wp-admin/admin.php?page=mfgroups&mingleforum_action=usergroups&do=add_user_togroup but you are trying to load http://localhost:8888/tankards_wordpress/wp-admin/wpf-addusers.php?usergroup=The+Freedom. Those don't match is a number of ways, but I am not 100% sure what the relationship between the two is. Your question is not clear in that respect.

However, even if you got that .php file to load via direct access like that-- http://localhost:8888/tankards_wordpress/wp-admin/wpf-addusers.php?usergroup=The+Freedom--, it wouldn't work. If you load the file directly like that WordPress does not load, meaning that WordPress functions will not be defined, and that file depends on WordPress functions.

You should be using the AJAX API for this, as for nearly all AJAX used in a WordPress context-- cases needing extreme performance possibly excluded.

Write your PHP into a callback function like this:

add_action('wp_ajax_my_action', 'my_action_callback');

function my_action_callback() {
    // your PHP
    die(); // this is required to return a proper result
}

And pass my_action as part of your AJAX POST data, like this:

var data = {
    action: 'my_action',
    whatever: 1234
};

// since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
$.post(ajaxurl, data, function(response) {
    alert('Got this from the server: ' + response);
});

(Both example code blocks more or less cribbed from the Codex)