# WooCommerce-termékek a képválasztó mezőben

> Kódpéldák arra, hogyan töltheted fel a képválasztó mezőt WooCommerce-termékekkel és kiemelt képekkel, és hogyan teheted a választott terméket a kosárba.

A WooCommerce termékadatait összekötheted a Gravity Forms űrlapokkal, így az űrlap mezői a termékek nevével és kiemelt képével tölthetők fel. Ez az útmutató egyedi kódrészletekkel mutatja meg, hogyan kérd le a termékeket, és hogyan töltsd fel velük a **Képválasztás** mezőt.

A kódot a téma `functions.php` fájljába, egyedi funkciók bővítményébe vagy kódrészlet-kezelő bővítménybe teheted. A példákban a `123` az űrlap azonosítója, az `1` pedig a képválasztó mező azonosítója: ezeket cseréld a sajátjaidra.

## „Egy választható” képválasztó mező feltöltése

A példa egy **Egy választható** (rádiógomb-szerű) képválasztó mezőt tölt fel a közzétett termékekkel. Minden választási lehetőség képe a termék kiemelt képe, a szövege és az értéke a termék neve. A kép nélküli termékeket kihagyja.

```php
add_filter( 'gform_pre_render_123', 'populate_image_choices' );
add_filter( 'gform_pre_validation_123', 'populate_image_choices' );
add_filter( 'gform_admin_pre_render_123', 'populate_image_choices' );
add_filter( 'gform_pre_submission_filter_123', 'populate_image_choices' );

function populate_image_choices( $form ) {
	$field_id = 1; // A képválasztó mező azonosítója.

	$posts = get_posts(
		array(
			'post_type'      => 'product',
			'post_status'    => 'publish',
			'posts_per_page' => -1,
		)
	);

	$choices = array();

	foreach ( $posts as $post ) {
		$product = wc_get_product( $post->ID );
		if ( ! $product ) {
			continue;
		}

		$image_id  = (int) $product->get_image_id();
		$image_url = $image_id ? wp_get_attachment_url( $image_id ) : '';
		if ( ! $image_url ) {
			continue;
		}

		$choices[] = array(
			'text'          => $product->get_name(),
			'value'         => $product->get_name(),
			'image'         => $image_url,
			'file_url'      => $image_url,
			'attachment_id' => $image_id,
		);
	}

	foreach ( $form['fields'] as &$field ) {
		if ( (int) $field->id === $field_id ) {
			$field->choices = $choices;
			break;
		}
	}

	return $form;
}
```

Négy szűrőre is szükség van: az űrlap megjelenítése előtt, az ellenőrzés előtt, a szerkesztőben és a beküldés előtt is fel kell tölteni a választási lehetőségeket.

## Név és ár a képválasztó mezőben

Ez a változat a termék nevét és formázott árát is a felirat mellé teszi, és csak az első hat terméket kéri le. Az érték itt a termék azonosítója.

```php
add_filter( 'gform_pre_render_123', 'populate_image_choices_with_prices' );
add_filter( 'gform_pre_validation_123', 'populate_image_choices_with_prices' );
add_filter( 'gform_admin_pre_render_123', 'populate_image_choices_with_prices' );
add_filter( 'gform_pre_submission_filter_123', 'populate_image_choices_with_prices' );

function populate_image_choices_with_prices( $form ) {
	$field_id = 1; // A képválasztó mező azonosítója.

	$posts = get_posts(
		array(
			'post_type'      => 'product',
			'post_status'    => 'publish',
			'posts_per_page' => 6,
		)
	);

	$choices = array();

	foreach ( $posts as $post ) {
		$product = wc_get_product( $post->ID );
		if ( ! $product ) {
			continue;
		}

		$image_id  = (int) $product->get_image_id();
		$image_url = $image_id ? wp_get_attachment_url( $image_id ) : '';
		if ( ! $image_url ) {
			continue;
		}

		$price           = wc_format_decimal( $product->get_price(), 2 );
		$name_with_price = $product->get_name() . ' (' . wc_price( $price ) . ')';

		$choices[] = array(
			'text'          => $name_with_price,
			'value'         => (string) $product->get_id(),
			'image'         => $image_url,
			'file_url'      => $image_url,
			'attachment_id' => $image_id,
		);
	}

	foreach ( $form['fields'] as &$field ) {
		if ( (int) $field->id === $field_id ) {
			$field->choices = $choices;
			break;
		}
	}

	return $form;
}
```

## „Több választható” képválasztó mező feltöltése

Ha a mező **Több választható** típusú, a `choices` mellett az `inputs` tömböt is fel kell tölteni, és minden párnak ugyanaz a `key` értéke kell legyen, így kapcsolja össze őket a Gravity Forms. A példa azokat a képválasztó mezőket tölti fel, amelyeknek a CSS-osztálya `wc_products`, így nem kell mezőazonosítót megadnod.

```php
add_filter( 'gform_pre_render_123', 'populate_image_choices_by_class' );
add_filter( 'gform_pre_validation_123', 'populate_image_choices_by_class' );
add_filter( 'gform_admin_pre_render_123', 'populate_image_choices_by_class' );
add_filter( 'gform_pre_submission_filter_123', 'populate_image_choices_by_class' );

function populate_image_choices_by_class( $form ) {
	foreach ( $form['fields'] as &$field ) {
		if ( false === strpos( $field->cssClass, 'wc_products' ) ) {
			continue;
		}

		$posts = get_posts(
			array(
				'post_type'      => 'product',
				'post_status'    => 'publish',
				'posts_per_page' => -1,
			)
		);

		$choices = array();
		$inputs  = array();
		$index   = 1;

		foreach ( $posts as $post ) {
			$product = wc_get_product( $post->ID );
			if ( ! $product ) {
				continue;
			}

			$image_id  = (int) $product->get_image_id();
			$image_url = $image_id ? wp_get_attachment_url( $image_id ) : '';
			if ( ! $image_url ) {
				continue;
			}

			// A 10 többszörösei foglaltak a Gravity Forms számára, ezeket átugorjuk.
			if ( 0 === $index % 10 ) {
				$index++;
			}

			$name = $product->get_name();
			$key  = wp_generate_password( 14, false, false );

			$choices[] = array(
				'text'          => $name,
				'value'         => $name,
				'image'         => $image_url,
				'file_url'      => $image_url,
				'attachment_id' => $image_id,
				'key'           => $key,
			);

			$inputs[] = array(
				'id'    => $field->id . '.' . $index,
				'label' => $name,
				'name'  => '',
				'key'   => $key,
			);

			$index++;
		}

		$field->choices = $choices;
		$field->inputs  = $inputs;
	}

	return $form;
}
```

A mező CSS-osztály beállításába írd be a `wc_products` értéket.

## A kiválasztott termék kosárba tétele beküldés után

Ez a példa a beküldés után a WooCommerce-kosárba teszi az űrlapon kiválasztott terméket. Az `empty_cart()` sor nem kötelező: ha benne hagyod, a korábbi kosártartalom törlődik. A mező értékének a termék azonosítójának kell lennie, ezért ezt a példát a névvel és árral feltöltött változattal együtt használd.

```php
add_action(
	'gform_after_submission_123',
	function ( $entry ) {
		$product_id = (int) rgar( $entry, '1' ); // A képválasztó mező azonosítója.
		if ( ! $product_id ) {
			return;
		}

		$product = wc_get_product( $product_id );
		if ( ! $product ) {
			return;
		}

		WC()->cart->empty_cart(); // Nem kötelező: törli a korábbi kosártartalmat.
		WC()->cart->add_to_cart( $product_id, 1 );

		do_action( 'woocommerce_add_to_cart', $product_id );
	}
);
```

A beküldés után átirányíthatod a látogatót a pénztár oldalra egy egyedi, **Oldal** típusú visszaigazolással. A visszaigazolásokról a [Visszaigazolások beállításai](https://hub.hellowp.io/hu/plugins/gravityforms/visszaigazolasok-beallitasok/) fejezetben olvashatsz, a képválasztó mezőről a [Több választós és képválasztó mezők](https://hub.hellowp.io/hu/plugins/gravityforms/standard-mezok-tobbvalasztos-es-kepvalasztas/) fejezetben.