Fetch HTML from the WordPress REST API

jQuery script which looks for one or more HTML element/s with the attributes data-fill-from-api and data-api-validation-code, then fills them with HTML from a custom WordPress REST API endpoint.

• data-fill-from-api: Partial path to the REST API endpoint which delivers the required HTML. This will be prefixed with the usual REST API path.
• data-api-validation-code: The result of the API request should only be placed inline if the returned code matches the one specified on the element.

JavaScript

Use the custom events which are triggered when the response completes. Each event corresponds to the appropriate jQuery.ajax result.

Following events are triggered

$(window).trigger('wp-html-from-rest-api/success', data, textStatus, jqXHR);
$(window).trigger('wp-html-from-rest-api/error', jqXHR, textStatus, errorThrown);
$(window).trigger('wp-html-from-rest-api/complete', jqXHR, textStatus);

Example of responding to a custom event

$(window).on('wp-html-from-rest-api/success', function(event, results){
	console.log(results);
});

HTML

<div class="my-api-html-wrapper" data-fill-from-api="markhowellsmead/v1/demo/html/" data-api-validation-code="demo_html_content"></div>

Suggested data response from your custom endpoint

$response = array(
	'code' => 'demo_html_content',
	'data' => array(
		'format' => 'html',
		'result' => $html,
		'status' => 200
	)
);

Changelog

1.1.4 2018-11-09

• Rename erroneous error trigger to wp-html-from-rest-api/error

1.1.3 2018-09-05

• Add varto define JavaScript variable $api_link.

1.1.2 2018-07-30

• Updated README with example of how to use the JavaScript events.

1.1.1 2018-07-30

• Updated README with the JavaScript events which will be triggered when the server has responded.

1.0.0 2018-07-30

• Revised package name to @markhowellsmead/wp-html-from-rest-api.

1.0.0 2018-07-30

• Initial version