If exact search for a product then automatically add to cart

[pprosch41]

Hi there,
first I want to say I’m a happy long-time user of your plugin.

For QuickOrder purpose I use the code-snippet for adding a add-to-cart-button to the search results (for simple products or product variations)..
This works perfect for years now …

Now I want to get a barcode-scanning solution done with your plugin.

For example:
If the search result is getting 1 result only and “Enter” is pressed (exact match for a custom field “ean_code”), then the simple product (or product variation) should be instantly added to cart.
After that empty the search input field and “activate” it for a next search.

1.) Count search results
2a.) Check if only one search result
2b.) Check if product is a simple product or a product variation
2c.) Check if the result comes from a product (or product variation) custom field “ean_code”)
2d.) Check if user has pressed Enter

If all of the above is true, then instantly add the the product(variation) to the cart!

Can you please help me with that?
I think that perhaps could be real cool feature for your plugin!
If not possible at your team, perhaps you can help me with custom snippet …

Thanks.

[Ernest Marcinko]

Hi,

I wish I could suggest a code snippet to this, but it is a bit more complicated.

I can however point you to the right direction of how I would start off. First, I would use the advanced content field to print some custom HTML with the EAN code. This HTML code can be used on the front-end to check if the product should be added.
Something like:
{descriptionfield}[<div class="ean_exists">{ean_code}</div>]

Then using the asp_search_end hook to check if that ean is in the results, an exactly only once:

add_action('wp_footer', 'asp_add_to_cart_handler', 999999);
function asp_add_to_cart_handler() {
	?>
	<script>
	let asp_add_to_cart_handler = function(e) {
		let id = e.detail[0],
		    instance = e.detail[1],
			phrase = e.detail[2],
			data = e.detail[3],
			results_with_ean = document.querySelectorAll( '.asp_r_' + id + '_' + instance + ' .ean_exists' );
		if ( results_with_ean.length == 1 ) {
			document.querySelectorAll( '.asp_r_' + id + '_' + instance + ' .button' ).click();
		}
	}
	document.querySelectorAll('.asp_m').forEach(function(node) {
		node.addEventListener('asp_search_end', asp_add_to_cart_handler);
	});
	</script>
	<?php
}

This does not handle enter key press etc.., but should be a very good start to a possible solution.

[pprosch41]

You cannot access this content.

[Ernest Marcinko]

You cannot access this content.

[pprosch41]

You cannot access this content.

[Ernest Marcinko]

Sure!

It basically executes, whenever a search is finished, it finds the first result, and if an element with the “button” class exists (which is the add to cart button), then clicks it.

[pprosch41]

Hi Ernest,

I have “rethinked” my (old) request, after trying your suggestion but did not get it to work …

Perhaps you can provide me a code snippet to automatically add cart if an exact search (only 1 search result) exists.
Without the relying on a custom field like ean-code …

It is then a more general use for your plugin too.

Perhaps a solution for that is much/a little simlpler and you can help me with that!?

Thanks again.

[Ernest Marcinko]

Hi,

Of course. I am not sure how simpler it might get, but this should be very close to an actual solution:

add_action('wp_footer', 'asp_add_to_cart_handler', 999999);
function asp_add_to_cart_handler() {
	?>
	<script>
	let asp_add_to_cart_handler = function(e) {
		let id = e.detail[0],
		    instance = e.detail[1],
			phrase = e.detail[2],
			data = e.detail[3],
			results = document.querySelectorAll( '.asp_r_' + id + '_' + instance + ' .item' );
		if ( results.length == 1 ) {
			document.querySelectorAll( '.asp_r_' + id + '_' + instance + ' .button' ).click();
		}
	}
	document.querySelectorAll('.asp_m').forEach(function(node) {
		node.addEventListener('asp_search_end', asp_add_to_cart_handler);
	});
	</script>
	<?php
}

[Author]

Posts