Fill field with remote data?

• sporklab

• December 18, 2019 at 7:44 pm

I have a field that I’d like to fill with data that I fetch from a remote URL. For example, one field will have an ID, and I want to fill another field with data I need to fetch from a remote API.

For example: hxxps://example.com/ID/thumb.json

I need to parse the json and pluck a value from it and then stuff that in a field. Is this possible? Not even sure where to start looking…

Thanks,

Charles

• John Huebner

• December 19, 2019 at 1:27 am

To do this on the server you would need to use one of the filters that ACF provides acf/load_field, acf/prepeare_field, or acf/load_value and the you would need to make a CURL or some other type of request to the API to get the result an populated to value.

On the client site you would need to use JavaScript to make the request using AJAX and use the ACF JavaScript API to populate the value.

• etling

• December 19, 2019 at 2:47 pm

@sporklab for a quick and dirty solution to this, I use jQuery and the acf field ID. Here’s an example below where a metabox is added to a certain post type, and when the user enters an ID in a field and fetches data from a remote API, it fills out some ACF fields:

function my_metabox_render() { ?>
  <p>Enter the ID:</p>
  <input type="text" id="the_id_for_remote_api" />
  <button id="my_import_button" class="button button-primary button-large">Import</button>  
 
<script>

    jQuery("#my_import_button").on("click", function(e) {
      e.preventDefault();
      var theID = jQuery("#the_id_for_remote_api").val();
      var apiEndpoint  = "https://some.api.com/someendpoint/" + theID + ".json?api_key=some_nifty_key";
      
      jQuery.get(apiEndpoint, function(data) {
        console.log(data);
        jQuery("input#acf-field_abc123xyz456").val(data.coolInfo);
        jQuery("input#acf-field_zxy987qwe123").val(data.sweetData);
      });
    });
  </script>
<?php }

function register_my_metabox() {

    add_meta_box(
        'my_meta_box_id',
        'Example Metabox Title',
        'my_metabox_render',
        'your_custom_post_type_here',
        'side',
        'default'
    );
}
add_action( 'add_meta_boxes', 'register_my_metabox' );

Like I said, this is just the rough outline. But it works pretty well for the use case you described. Note that I tend to keep the “remote” field separate from ACF, siloed in the metabox, it just simplifies things.

• sporklab

• December 20, 2019 at 10:23 am

@etling – that is pretty cool. Also I like the idea that it’s sort of a one-shot and the user is free to later alter it. Hmmm…

@hube2 – I will look at this as well, I need to think about what approach is easiest for the end user (and also think about how often they might want to override, if ever).

• sporklab

• January 3, 2020 at 6:57 am

Not sure if this is the correct usage, but I hit on “acf/update_value” and that seems to be working well. In the function I created, I only do anything if the value comes in empty. So for a new post, if the user has not opted to paste in a custom URL, I see a blank value and then go and fetch and decode the json from vimeo to get the video’s thumbnail URL and then set it.

Subsequent edits of the page will similarly hit my “is it defined?” check and skip this. If the user wants to force a check for a new thumbnail for some reason they can blank out the URL and hit “submit” and the blank form will trigger another fetch. This seems pretty sane I think?

• sporklab

• January 30, 2020 at 10:59 am

Oh, also just going to post my code in case it’s helpful or if someone wants to yell at me for being wrong:

	// Fetch vimeo thumbnail on save - takes video ID as input
	function rf_acf_update_vimeo_thumb( $value, $post_id, $field ) {
		// only set a new value if the field is empty
		if ( $value == '') {
			// get video here
			$vimeo_video_id = get_field('vimeo_video_id');
			// fetch thumb url(s)
			$vimeo_meta = file_get_contents("https://vimeo.com/api/v2/video/$vimeo_video_id.json");
			$vimeo_meta = json_decode($vimeo_meta);
			$vimeo_thumb = $vimeo_meta[0]->thumbnail_large;
			// set value
			$value = $vimeo_thumb;
			return $value;
		} else {
			return $value;
		}
	}
	
	add_filter('acf/update_value/name=thumbnail_url', 'rf_acf_update_vimeo_thumb', 10, 3);