The Codex includes a useful page on AJAX in plugins which outlines how to send and receive an ajax request.
The code below covers how you would trigger an event when the select field is changed and fire off the ajax request. Make sure you’re getting and setting a nonce value.
/**
* Only execute after jQuery is loaded
*/
jQuery(document).ready(function ($) {
/**
* Trigger an event when the select field is changed.
*/
$( 'select[name="field_5481bc1472b1d"]' ).change( function() {
/**
* The data you will send via ajax. Action
* needs to be a unique slug you will use
* to identify and respond to the call.
* An nonce will be needed to verify the
* authenticity of the call.
*/
var data = {
'action': 'customslug-action-name',
'selected': $(this).val(),
'nonce': YOUR_NONCE_VALUE,
};
$.get( ajaxurl, data, function( r ) {
if ( r.success ) {
// do your thing
} else {
// there was some error
}
});
});
});
Then on the server side, you would receive and respond to the call by hooking into the authenticated and unauthenticated ajax hooks associated with your action:
add_action( 'wp_ajax_customslug-action-name', 'my_action_callback_for_logged_in_users' );
add_action( 'wp_ajax_nopriv_customslug-action-name', 'my_action_callback_for_logged_out_users' );
Make sure you are using check_ajax_referrer() to verify the nonce. You can generate an nonce with wp_nonce_field() or pass it directly to JavaScript with wp_create_nonce.