Skip to content

Instantly share code, notes, and snippets.

@igorbenic
Created June 3, 2022 15:19
Show Gist options
  • Save igorbenic/4094c3b522d1ccc60e8e7d8318720df2 to your computer and use it in GitHub Desktop.
Save igorbenic/4094c3b522d1ccc60e8e7d8318720df2 to your computer and use it in GitHub Desktop.
ACF Repeater Fields - Filter by Price
(function($){
$(function(){
$(document.body).on( 'change', '#min_price, #max_price', function(){
var minPrice = parseFloat( $('#min_price').val() );
var maxPrice = parseFloat( $('#max_price').val() );
$('.item-list li').each(function(){
var price = parseFloat( $(this).attr('data-price') );
var hide = false;
if ( minPrice && price < minPrice ) { hide = true; }
if ( maxPrice && price > maxPrice ) { hide = true; }
if ( hide ) {
$(this).hide();
} else {
$(this).show();
}
});
});
});
})(jQuery);
<?php
$repeater_values = get_field( 'repeater_field_key', $post_id );
?>
<input type="number" value="0" placeholder="Min Price" id="min_price" />
<input type="number" value="10000" placeholder="Max Price" id="max_price" />
<ul class="item-list">
foreach ( $repeater_values as $repeat_item ) {
?>
<li data-price="<?php echo esc_attr( $repeat_item['price'] );?>">
<?php echo $repeat_item['title']; ?>
</li>
<?php
}
?>
</ul>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment