Woocommerce Question posted in
The official Woocommerce documentation can be found here.

Woocommerce – Autofill checkout inputs based on custom post type match / query

I have recently come across a problem of which I has me a little confused.
Within my WP setup, I have a basic WooCommerce solution, (For the theme I am using the Timber starter theme to make use of twig templating). As well as this, I am using a custom post type named ‘sites’. Sites represent a list of construction sites, not to be confused with websites.

The Sites CPT has X Advanced custom fields ‘fields’, as well as the standard ‘title’, the ACF fields being:

  • PO Number (po_number) -> String -> required / not null
  • Job Number (job_number) -> String -> required / not null
  • Street address (street_address) -> String -> required / not null
  • Office Name (office_name) -> String -> required / not null
  • Town (town) -> String -> required / not null
  • County (county) -> String -> optional / nullable
  • Post Code (post_code) -> String -> required / not null

So most of the above from the admins side are required, so we know the data will be present.

The issue I am having is that, when on the checkout, we would like fields matching the above, as well as an email address field (required) and a contact number field (required).

The purpose being that, when a customer types in their ‘Job Number’ and hits a ‘Find’ button, a query is kicked off matching this Job Number against the Job Number field on the Custom Post Type, and if a match is found, the other fields from that record are filled into the rest of the checkout form.

In terms of trying out a solution, the only thing I could thing of was a database query to match and return the data, but I am fairly new to WP as a whole and there seem to be concepts such as Ajax having a specific use case in WP, the DB structure seems quite complex, so I thought I would ask here and see if anyone had a solution.

As of yet, there is no code to show otherwise I would, and in terms of the WooCommerce templates, they are all standard and have not been modified.

Just to summarise, the goal is:

Customer goes to checkout -> Enters their already known Job Number and hits ‘Find’ -> Some sort of query is ran to match that Job Number against a CPT ACF field of Job Number -> If a match is found, return those fields and fill the Woo Checkout fields in with that data.

Any ideas solution or suggestions are very welcome, thank you in advance.

Tags:

2

Answers


  1. 0

    If you only have a couple of hundred ‘sites’ then just localize a script.

    https://developer.wordpress.org/reference/functions/wp_localize_script/

    Then, when you have that CDATA variable available in the DOM, you can just use jQuery/javascript to find the matching job and fill in the form fields. From there, I recommend using the WC documentation and their hooks/filters to add fields to the checkout AND validate those fields on checkout. Here is a link that explains that process as well.

    https://docs.woocommerce.com/document/tutorial-customising-checkout-fields-using-actions-and-filters/

    Bottom line? If you have a few hundred fields just localize the data in a variable that can be read on the front end. If many more, then you may want to use AJAX. But anything fewer than a couple hundred will actually be less resources used on the server and faster load.

    Login or Signup to reply.
  2. 0

    You can do whatever you want using custom code as well as some of your best logic as below I’m going to explaining to you.

    Follow the logic/step below.

    Create custom field checkout

    first of creating a custom field on checkout page woo-commerce : custom field

    https://wisdmlabs.com/blog/add-custom-fields-woocommerce-checkout-page/

    and also don’t forget to add check button

    create ajax call ( WP-ajax ) and set-up on a button.

    Create ajax call by clicking on a button and get user detail by job id

    You have to write code to get the user data from the job_number on the ajax function that is the returning user that matches the ajax function. ( you )

    get the user by user meta ( you have to store job_number with user meta to get user detail by job_number) get_user_meta : you will get user id from user meta.

    as you will get user id you can easily find the user woocommerce user meta that seems shipping address, billing address, etc. and you suppose to return those data with your custom ajax call and set in the field of woocommerce checkout using jquery.

    I hope you getting an idea from my logic and steps.

    Thanks.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search