Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Support Paul Clark

    (@pdclark)

    See classes which exist on the unordered list with the Web Inspector.

    Also note that HTML elements can be selected with things other than classes — there are CSS attribute selectors which will apply based on position and attribute values. For example, if an element has attribute data-info="123", CSS selector [data-info="123"] will match it. There are similar variations for “begins with”, “ends with”, “contains”, and “exists”.

    If a class is absolutely necessary, it’s important to note that modifying the HTML output of Pods fields is non-trivial, because their appearance is managed through compiled React components, which has its own render lifecycle separate from the normal document object model (DOM). For this reason, modifying classes on fields usually involves some combination of https://docs.pods.io/code/dfv-js-api/ to identify fields and their values, then a MutationObserver to monitor the fields as their presentation changes due to user interaction.

    An example of modifying field behavior with DFV and an observer can be found at https://www.ads-software.com/support/topic/set-limit-on-entry-for-repeater-field/#post-17821497. Due to the real-time interaction, it’s a complex technical solution. The relevant vanilla JavaScript method for adding a class to an element is element.classList.add(). Similar class-related methods around class and attribute manipulation can be found at https://youmightnotneedjquery.com

    Thread Starter wireinet

    (@wireinet)

    Thank you, Paul, for this incredible full answer! You real help me! I find. That js in my case is the best choice!

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.