Support

Account

Home Forums General Issues (admin side) How to add a class to a repeater row without JS?

Solving

(admin side) How to add a class to a repeater row without JS?

  • I have a repeater with a select field.
    On the admin side, on page load, a jQuery each() function checks the value of the select field and applies the corresponding css class to the row.

    This works fine, but I would prefer to have the class to be applied already when the page is first rendered, instead of having to wait for the jQuery function to apply the classes and modify the whole repeater (better for user experience)

    I suppose adding the class via php would do the trick, but I have no idea how to do it.

    Here is my jQuery function, if it matters :

    $(cssrepeater);
    $(“#myrepeater .linetype select”).change(cssrepeater);

    function cssrepeater() {

    var possibletypes = [‘future’,’present’,’past’]

    $(‘#myrepeater .row’).each(function () {
    var linetype = $(this).find(‘linetype select’).val();
    $(this).removeClass(possibletypes).addClass(linetype);
    });
    }

  • There aren’t any filters or actions that can be called to modify the element with class='acf-row'. If that’s the element you mean, there is no “.row” class in ACF. So yes, the only way to do this is using JS.

    The only possibility you have to alter that would be to use 2 acf/render_field actions, one before and one after acf renders the repeater. You could use a PHP output buffer starting the buffer before the repeater is rendered and then getting an altering the buffer contents after. However you’d need to parse the html that ACF outputs and figure out how to update the each row class. Probably possible but potentially an nightmare to do.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.