ProcessWire - Dynamic Backend Fields: Unterschied zwischen den Versionen

Aus Wikizone
Wechseln zu: Navigation, Suche
(Die Seite wurde neu angelegt: „How To populate or show fields in backend depending on selection of other fields ? == Field Dependencies in ProcessWire == https://processwire.com/docs/field…“)
 
Zeile 2: Zeile 2:
 
== Field Dependencies in ProcessWire ==
 
== Field Dependencies in ProcessWire ==
 
  https://processwire.com/docs/fields/dependencies/
 
  https://processwire.com/docs/fields/dependencies/
 
+
== Show If und Required If ==
 
=== Show if Dependency ===
 
=== Show if Dependency ===
 
Zeige ein Feld nur dann im Backend an, wenn eine Bedingung erfüllt ist.
 
Zeige ein Feld nur dann im Backend an, wenn eine Bedingung erfüllt ist.

Version vom 15. Dezember 2019, 18:12 Uhr

How To populate or show fields in backend depending on selection of other fields ?

Field Dependencies in ProcessWire

https://processwire.com/docs/fields/dependencies/

Show If und Required If

Show if Dependency

Zeige ein Feld nur dann im Backend an, wenn eine Bedingung erfüllt ist.

Wo stellt man Show if ein ?

1. Auf Feldebene

In den Feldeinstellungen (auch innerhalb eines Templates) unter Visibility / Sichtbarkeit.

2. Über die API auf einem beliebigen Inputfield Objekt oder Module

$inputfield->showIf = "field=value";

3. Über Module (z.B. im Formbuilder)

Require if

Benötigt wenn - funktioniert ähnlich wie show if. Option im Backend bei den Feldeinstellungen wenn man Required bei einem Feld anhakt.

API Zugriff auf require if

$inputfield->required = 1; // must be set
$inputfield->requiredIf = "field=value";

Selectors

Selector string format

field=value

"field" is the name of the field you want to check, "=" is the operator you want to use for comparison, and "value" is the value you want to compare.

  • multiple conditions by separating each field=value condition with a comma, i.e.
fullname!=, items>5

Allowed operators

=   equal
!=  not equal
>   greater than
<   less than
>=  greater than or equal
<=  less than or equal
%=  contains phrase
*=  contains phrase (same as above) 

Beispiele:

categories.count>0, categories.count<3
categories.count=0
first_name!=, last_name=
categories=1234, categories.count=1 // Nützlich bei Page Reference
checkbox=1
checkbox=0

Populate Multiple Select Field depending on Single Select Field

var initChildSelect = function() {

    // THE "PARENT" FIELD
    var thisID         = $(this).attr('id');
    var repeaterID     = thisID.split('_repeater')[1]; // if in repeater?
    var optID         = parseInt($(this).val()); // the selected option


    // THE "CHILD/DEPENDENT" FIELD
    childWorksSelect = $('select[name^="part_select_repeater'+repeaterID+'"]');
    var allOptions = $(childWorksSelect.children()).clone();
    var validOptions = allOptions.filter(function(){
        return $(this).data('parent') == optID;
    });
    childWorksSelect.html(validOptions);

    var options = {};
    if(!optID) {
        var options = {'placeholder': 'No Work Selected'}
    }

    if(optID && !validOptions.length) {
        var options = {'placeholder': 'No Parts For The Selected Work'}
    }

    childWorksSelect.selectize(options);

    // DEAL WITH CHANGES TO THE PARENT FIELD
    $(this).change(function() {
        var optID = parseInt($(this).val());
        var newOptions = allOptions.filter(function(){
            return $(this).data('parent') == optID;
        });
        childWorksSelect[0].selectize.destroy();

        // Re-init the select
        childWorksSelect = $('select[name^="part_select_repeater'+repeaterID+'"]');
         childWorksSelect.html(newOptions);

         var options = {};

        if(!optID) {
            var options = {'placeholder': 'No Work Selected'}
        }
         if(optID && !newOptions.length) {
             var options = {'placeholder': 'No Parts For The Selected Work'}
         }

        childWorksSelect.selectize(options);
        childWorksSelect[0].selectize.open();
    });

}

$(function(){
    $('select[name^="work_select_single"]').each(initChildSelect);

    $(document).on('reloaded opened repeateradd wiretabclick', '.InputfieldPage', function() {
        $(this).find('select[name^="work_select_single"]').each(initChildSelect);
    });

});