Spring naar de hoofdinhoud

Ontwikkeling

De Zoekopdrachten add-on komt geleverd met een "default" formulier, mocht dit formulier niet voldoen aan jouw wensen dan is het mogelijk eentje custom op maat te (laten) maken.

In de voorbeelden gebruiken we voorbeeld velden, je kunt alle beschikbare velden vinden onder de velden documentatie.

 

Template

Het standaard template van de add-on kun je vinden in onderstaand pad binnen de plugin en kun je eventueel gebruiken als voorbeeld.
/wp-content/plugins/tussendoor-zoekopdracht-addon/templates/public/form.php

Om bovenstaand pad te wijzigen en te verwijzen naar je eigen kan d.m.v. een filter.

add_filter('zoekopdracht_form_path', function($path) {
	return get_stylesheet_directory().'/custom_form.php';
});

In deze template file heb je vervolgens de variabele $zoekopdracht tot je beschiking.

 

Conditionele weergave van velden

Het kan voorkomen dat er specifieke eisen zijn om velden op een bepaalde manier weer te geven, bijvoorbeeld omdat ze afhankelijk zijn van andere velden. Om te voorkomen dat deze logica overal door het thema opnieuw geschreven wordt biedt de plugin een manier om dit voor elkaar te krijgen.

Een veld uit onze plugin is een object en kan naast het terug geven van zijn waarde nog veel meer informatie terug geven. Zo kunnen de volgende methods worden gebruikt:

<div>
	<?= $zoekopdracht->parent_field; ?>
</div>

<div data-show-when="parent_field:SAMPLE_VALUE_A,SAMPLE_VALUE_B,SAMPLE_VALUE_C">
	<!--
		Dit veld komt pas tevoorschijn wanneer parent_field
		"SAMPLE_VALUE_A", "SAMPLE_VALUE_B" of "SAMPLE_VALUE_C" is
	-->
	<?= $zoekopdracht->CHILD_FIELD; ?>
</div>

 

 

Attributen toevoegen/wijzigen

Het is mogelijk extra attributen zoals bijv placeholder, title, aria-* toe te voegen of overschrijven.

echo $zoekopdracht->field->placeholder('My awesome placeholder');
echo $zoekopdracht->field->title('My awesome title');
echo $zoekopdracht->field->aria_hidden('true');
echo $zoekopdracht->field->min(0)->step(10000)->value(200000);

Dit werkt d.mv. magic methods, er is dus geen controle op valide HTML attributen.

Een methode die gebruik maakt van een _ (laag streepje) zal worden vertaald naar een - (koppelstreepje) waardoor bijvoorbeeld aria attributen mogelijk zijn. 

 

Tonen van labels

Je kunt het <label> van een veld tonen d.m.v. de label() method, ook is het mogelijk om e.v.t. je eigen label titel op te geven.

echo $zoekopdracht->field->label();
echo $zoekopdracht->field->label('Custom title');

 

Velden wijzigen

Het is mogelijk om velden te wijzigen naar bijvoorbeeld andere elementen, ook is het bijvoorbeeld mogelijk om de waardes van velden te overschrijven.

add_filter('tussendoor_zoekopdracht_alter_fields', function($fields) {

    // Mogelijke velden (die eventueel te extenden zijn voor custom rendering)
    // Tussendoor\Zoekopdracht\Elements\Element::checkbox('veldnaam');
    // Tussendoor\Zoekopdracht\Elements\Element::email('veldnaam');
    // Tussendoor\Zoekopdracht\Elements\Element::hidden('veldnaam');
    // Tussendoor\Zoekopdracht\Elements\Element::number('veldnaam');
    // Tussendoor\Zoekopdracht\Elements\Element::radio('veldnaam');
    // Tussendoor\Zoekopdracht\Elements\Element::select('veldnaam');
    // Tussendoor\Zoekopdracht\Elements\Element::text('veldnaam');

    $email = Tussendoor\Zoekopdracht\Elements\Element::text('email')->placeholder('E-mailadres');
    $fields['relatie']->persoon->email = $email;

    $zoekgebieden = Tussendoor\Zoekopdracht\Elements\Element::checkbox('zoekgebieden');
    $fields['locaties']->zoekgebieden = $zoekgebieden;

    $fields['woonwens']->koopprijsVanaf->values([
        '' => 'Geen minimum',
        '100000' => '€ 100.000',
        '150000' => '€ 150.000',
        '200000' => '€ 200.000',
        '250000' => '€ 250.000',
        '300000' => '€ 300.000',
        '350000' => '€ 350.000',
        '400000' => '€ 400.000',
        '500000' => '€ 500.000',
    ]);

    return $fields;
});

 

Velden dynamisch vullen

Het is mogelijk om velden dynamisch te vullen of selecteren via bijvoorbeeld een formulier/url van een andere pagina. De plugin leest de globale $_POST en $_GET variabelen uit bij het renderen van het veld. Wanneer de naam van het veld overeenkomt met de key vanuit $_POST of $_GET dan zal het veld automatisch gevuld of geselecteerd worden i.c.m. de value vanuit $_POST of $_GET. Op deze manier kun je een zoekopdracht vanuit bijvoorbeeld een overzichtpagina doorsturen naar de zoekopdracht add-on. De add-on controleert op beide de values en labels en daarbij vrij "losjes" om wanneer mogelijk resultaat te geven.

<!-- Via een url -->
<a href="https://mijnwebsite.nl/zoekopdracht-aanmaken/?zoekgebieden[]=Leeuwarden&zoekgebieden[]=777">
    Wees direct op de hoogte van ons aanbod in Leeuwarden en Amsterdam!
</a>
<a href="https://mijnwebsite.nl/zoekopdracht-aanmaken/?objectsoort=BOUWGROND">
    Wees direct op de hoogte van ons nieuwe bouwgrond aanbod!
</a>

<!-- Of via een formulier -->
<form action="https://mijnwebsite.nl/zoekopdracht-aanmaken/" method="post">
    <select name="zoekgebieden[]" multiple>
        <option value="666">Leeuwarden</option>
        <option value="777">Amsterdam</option>
    </select>
    
    <select name="objectsoort">
        <option value="WOONHUIS_OF_APPARTEMENT">Woonhuis of appartement</option>
        <option value="WOONHUIS">Woonhuis</option>
        <option value="APPARTEMENT">Appartement</option>
        <option value="BOUWGROND">Bouwgrond</option>
        <option value="OVERIGOG">Overig onroerend goed</option>
    </select>

    <button type="submit">Zoekopdracht aanmaken</button>
</form>
Terug naar boven