Support

Account

Home Forums General Issues Does ACF have a JS API? Reply To: Does ACF have a JS API?

  • The main problem I’ve found with not traversing the DOM is when it comes to sub fields in repeaters (or flex fields). The only unique identifier there is, is the field key that is stored in ‘data-key’ for a particular field. If you want to get or set a value in a particular row of of a sub field then you need to know the actual field object that needs to be modified. This was extremely important when I was creating a custom ACF field type because I had to know precisely what instance of a field was being added or edited if the field was a sub field.

    Let’s just say that I wanted to use JS to insert a row just before the current row that’s being edited and then insert data into the fields of the new row.

    
    var $row = e.$el.closest('.acf-row');
    $row.find('[data-event="add-row"]').trigger('click');
    var $new_row = $row.prev();
    

    The first line is exactly how ACF finds the current row.

    Now I can find/set each of the fields in the new row by using $new_row.find('[data-key="field_XYZ"] .....

    I could be wrong, but I seriously doubt that there will be extensive changes in the HTML structure of ACF simply because everything in the ACF’s JS files is highly dependent on that structure. A change in structure would likely mean a major rewrite of all the ACF JS code and that would likely mean ACF6. Even then I don’t see it happening.

    Although I am careful to use things that ACF uses, like .acf-row and [data-key...], basically the same things that ACF uses that I don’t think will change, and doing things the same basic way that ACF does them.