When to use the ACF JavaScript API?

• csaborio

• December 16, 2020 at 1:48 pm

Hi,

I am having a bit of a hard time wrapping my head around as to when to use the ACF Javascript library. Can someone please share some examples? The documentation page goes straight into details does not offer much guidance on sample scenarios.

Some of the things I usually do is manipulate ACF fields using jQuery by loading a javascript file that adds events to fields so I can update other field values when such events happen. For instance, this is what I am doing display a mixed dog breed based on two select fields that each hold a list of breeds:

   var primaryBreed = $('#primary-breed option:selected').text();
   var secondaryBreed = $('#secondary-breed option:selected').text();
   if ( -1 === primaryBreed.localeCompare(secondaryBreed)  || '' === secondaryBreed || primaryBreed === secondaryBreed ) {
      $('#acf-field_mdr_dog_text_breed_name').val( primaryBreed + ' X ' + secondaryBreed );
   }
   else {
      $('#acf-field_mdr_dog_text_breed_name').val( secondaryBreed + ' X ' + primaryBreed );
   }

Should I be using the Javascript API fro this or would that be overkill?

Thanks!

• [email protected]

• December 28, 2020 at 7:32 am

ACF JS API can be used to manage fields to change ajax query, to interact with action events and filters, manage dynamic relation between fields…

The main advantage is that you can manage fields and group using the same ACF logics as with PHP

• csaborio

• December 28, 2020 at 10:34 am

Thank you @christian-denatorange-fr I am slowly getting into it and understanding its purpose a lot better. Merci! 🙂