Display WordPress API XML Queried data on front end with AJAX
Welcome to part 6 of our series on querying an XML API in WordPress! In this video, we'll be using JavaScript and AJAX to display the API data using a button click, and we'll also be fixing the array data from using the SimpleXmlElement function in PHP.
We'll start off by tackling the API challenge at the beginning of the video, and then we'll move on to loading our JavaScript. From there, we'll get form data with JavaScript and learn how to use AJAX in WordPress forms.
We'll also be using the wp_localize_script() function to pass PHP data to JavaScript, and then we'll use AJAX to actually query the API. After that, we'll refactor our PHP XML parser to make it more efficient.
Next, we'll use the each() function in jQuery to handle objects and then display the API results in the DOM. Finally, we'll wrap up the video by discussing what's next in the series.
Thanks for watching!
VIDEO CHAPTERS
00:00 API challenge
00:56 Load JavaScript
03:33 Get form data with JavaScript
06:54 Using AJAX in WordPress Forms
09:20 Pass PHP data to JS using wp_localize_script()
15:30 Use AJAX to query API
17:40 Refactor the PHP XML parser
23:20 Use each() in jQuery to handle objects
24:38 Display API results in DOM
28:00 Next steps
Code sample: https://github.com/YTTechiePress/rest...
HOW TO SUPPORT THE CHANNEL
=============================================
Do you like what I am doing?
Buy me a coffee through https://www.buymeacoffee.com/techiepress
Give via PayPal: https://paypal.me/laurencebahiirwa
Visit https://omukiguy.com/support-my-work/
I am social too:
Facebook: / techiepress-100149655032583
Twitter: / omukiguy
Blog & Newsletter: https://omukiguy.com
Github: https://github.com/yttechiepress
-------------------------------------------------------------------------------
LEARN MORE IN THE WELL CURATED PLAYLISTS BELOW
--------------------------------------------------------------------------------
Learn how to build a plugin from scratch: • Plugins Vs Functions.php - Where shou...
WooCommerce E-Commerce customizations
== Build Free Custom E-commerce Online Shop using WooCommerce - • WooCommerce customizations - Free Wor...
== Build Free Custom Theme for E-commerce Online Shop using WooCommerce -
• Woocommerce Restaurant Shop - Custom ...
====== Build Dynamic Websites with Elementor ======
== Learn the Elementor basics - • Elementor Beginner Tutorials
== Build a custom Elementor Widget from Scratch - • Build Custom Elementor Widgets from s...
====== How to use WordPress Gutenberg Block Editor ======
WordPress 5.4 Gutenberg Blocks Updates
== • WordPress 5.4 Gutenberg Blocks Updates
WordPress Gutenberg blocks for Designers
== • WordPress Basics Training: Gutenberg ...
Gutenberg WordPress Block Editor tutorials for beginners
== • WordPress Basics Training: WordPress ...
Custom WooCommerce Gateway Development from Scratch
== • Build Custom WooCommerce Payment Gateway
WordPress Custom REST API Namespaces, Endpoints and Examples from Scratch
== • Create Custom WordPress REST API POST...
====== WordPress Plugin Development from Scratch ======
Build Most Popular & Most Commented Post Plugin
== • Build WordPress Most Popular & Most C...
Build SMS Plugin with External WordPress API Integration using custom WordPress Databases
== • Build SMS Plugin - External WordPress...
WordPress External APIs Integration Plugin Development
== • WordPress External APIs Integration P...
Convert WordPress to mobile App in Headless WordPress
== Convert WordPress Sports Website into Mobile Application - https://www.youtube.com/playlist?list...
Make GraphQL API endpoints with WordPress Headless CMS WPGraphQL Plugin
== • Make GraphQL API endpoints with WordP...
Customize Your WordPress & ClassicPress
== Build Custom REST API Endpoints with WordPress or ClassicPress - • Build Custom REST API Endpoints with ...
Custom Dashboard Widgets
== • Custom Dashboard Widgets WordPress & ...
Build Custom Admin
== • Custom Admin for WordPress or Classic...
Learn Git
== Git tutorial for writers + software developers for beginners - • Git tutorial for beginners - writers ...
Watch video Display WordPress API XML Queried data on front end with AJAX online without registration, duration hours minute second in high quality. This video was added by user TechiePress 30 December 2022, don't forget to share it with your friends and acquaintances, it has been viewed on our site 1,36 once and liked it 2 people.