php - Output certain text into DIV using Ajax in Wordpress -

php - Output certain text into DIV using Ajax in Wordpress -

i'm new ajax. through lot of trial error, have basic illustration , i'm looking expand it.

i'm working on custom wordpress page image map of usa , need utilize ajax fill in div info on each state.

when user clicks on map area defined new york href triggered like: href="javascript:getstateinfo('newyork')"

here js function:

function getstateinfo(name) { var name = this.name; jquery.ajax({ type: 'post', url: '/wp-admin/admin-ajax.php', data: { action: name, // php function run }, success: function(data, textstatus, xmlhttprequest) { jquery('#infodiv').html(''); // empty element jquery('#infodiv').append(data); // set our list of links }, error: function(xmlhttprequest, textstatus, errorthrown) { if(typeof console === "undefined") { console = { log: function() { }, debug: function() { }, }; } if (xmlhttprequest.status == 404) { console.log('element not found.'); } else { console.log('error: ' + errorthrown); } } });}

i'm looking info ajax in functions.php file have

function newyork() { echo 'this info on new york state'; die(); } add_action( 'wp_ajax_nopriv_newyork', 'newyork' ); add_action( 'wp_ajax_newyork', 'newyork' );

obviously code doesn't work, , i'm not sure if should writing 50 different functions add_action's each state. if knows of improve way implement this, i'm eager larn how implement efficiently?

this simple , don't need utilize ajax @ this.

however define area maps js can this

$('.state').on('click', function(){ var state = $(this).val(); $('#display').append(state); });

you can add together in $('#display').empty(); clear current info within of #display element before adding in new data.

here code edit load in page text on it

$('.state').on('click', function(){ var state = $(this).val(); $.ajax({ type: "post", url: 'goes here', data: {state : state}, success: function(displaystate){ $('#display').html(displaystate); } )}; });

the page load in written display info depending on state clicked.

php jquery ajax wordpress