WP Hook + JQuery GET from WP DB

Your save_flashcard_settings2() function (Ajax handler) should echo out the data you want returned to your jQuery caller. If it’s a singleton value you could echo it out directly, but if the data is structured you may need to JSON encode it.

After sending out the data your Ajax handler needs to exit(); or die();

In your jQuery you wouldn’t want to reload the page on successful Ajax call. Instead insert the returned data into the appropriate spot in the DOM.

FWIW, using “save” in function and action hook names is probably not the best choice when you’re getting, not saving. While it will work, it’s confusing and could hamper future code maintenance. I realize you’re just recycling code from earlier, but consider what effect misleading names will have when you need to modify this code after not seeing it for many months ??

Hi (@bcworkz),

Thanks for your input! I tried following your suggestions:

1. I have 2 methods for trying to echo out value from db. In the 2nd method i tried echoing a <h1> with id tag that i reference in the js file.
2. I changed the js file so that upon “success” the code should get the php value echoed out and then set equal to div on html page.

Please let me know if i’m getting close and what changes to make. I have to admit the syntax is a little challenging. I coded my whole site in vanilla js and so am used to that.

Thanks!

Will

function save_flashcard_settings2() {
	global $wpdb;

	//$adaptValueFromDb = intval($_GET['adapt']); 

	$query = "SELECT * FROM MLT_Exam_db";
 
	$result = $wpdb->query($query);

        // METHOD 1
        echo $adaptValueFromDb;

        // METHOD 2
        echo "<h1 id='phpValue'>$adaptValueFromDb </h1>"; 
}



add_action('wp_ajax_save_flashcard_settings2', 'save_flashcard_settings2');
add_action('wp_ajax_nopriv_save_flashcard_settings2', 'save_flashcard_settings2');

// ——— getFromDB.js ——— 

jQuery(document).ready(function ($) {
	var $flashcard_exit_btn2 = $('#getFromDbButtonFxn');

	if ($flashcard_exit_btn2.length !== 0) {
		$flashcard_exit_btn2.on('click', function (e) {
			if(confirm('Warning:')) {
				$.ajax({

					type: 'GET',
					dataType: 'json',
					url: FlashcardApp2.ajaxurl,
					aync: false,
					data: {
					action: 'save_flashcard_settings2',  // RUN PHP SCRIPT:  

					
					
					},
				
					error: function(xhr, textStatus, error) {
						window.location.reload();
					},
					success: function(data) {
		
getPhpValue: document.querySelector('#phpValue').innerHTML;	

getDivValue: document.querySelector('#retrieveAdapt').innerHTML;			

getDivValue: getPhpValue;
				
					}
				});
			
				e.preventDefault();	
			} else {

window.location.reload();

			}
		});
	}
});

After sending out the data your Ajax handler needs to exit(); or die(); I think failing to do so might inhibit output from actually being sent out. IIRC echoed data just sits in a buffer until execution ends.

As printed here, $adaptValueFromDb is undefined. (assignment commented out) I think you meant to use $result in its place. Even if undefined, the other static HTML should still be output once execution is terminated.

$result will be an array, not a singleton value. You cannot directly echo out an array in a way that will be meaningful to jQuery. Either JSON encode it or parse it with PHP to build the desired HTML content string prior to output.

I know it’s now commented out, but you use a value from $_GET. There is no evidence you’ve sent such a value from your jQuery. Perhaps you’ve deleted that element instead of commenting it out?

I’ll assume FlashcardApp2.ajaxurl has a correct URL value. Be sure any URLs used within WP are full, absolute URLs. You want to avoid using relative file references in WP.

I’m not that good with jQuery, but your success: procedure isn’t doing anything with the data returned from the server that’s in data. For now you could just console log it so you can see what was returned.

As an initial effort, making an Ajax request with a singleton value that is simply returned by the server is a good choice. Once you are able to get data to make a successful round trip you’ve won half the battle. Don’t try to do anything fancy like a DB query for now. You first want to get the basic mechanics of Ajax working. Once you get that you can build upon your success with something more meaningful.