# Prevent page from refreshing when filtering HubDB

**URL:** <https://community.hubspot.com/t/prevent-page-from-refreshing-when-filtering-hubdb/35532>\
**Category:** CMS Development\
**Tags:** hubdb, javascript\
**Created:** [April 14, 2021, 6:46pm UTC](https://community.hubspot.com/t/prevent-page-from-refreshing-when-filtering-hubdb/35532 "2021-04-14T18:46:13Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![ckingg](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ckingg/32/31184_2.png) [@ckingg](https://community.hubspot.com/u/ckingg)\
**Post date:** [April 14, 2021, 6:46pm UTC](https://community.hubspot.com/t/prevent-page-from-refreshing-when-filtering-hubdb/35532/1 "2021-04-14T18:46:13Z")

</div>

I’m working on a page that has 4 filters. It works just fine for filtering as is and it technically auto filters as you select the options in the avialbe dropdowns and checkboxes.

However, the issue is that the page refreshes after every filter selection in a checkbox or dropdown. I don’t want the page to refresh as users are filtering.

I know I could use Ajax for this but I have no idea how to get started with that or how to use it with HubDB. I looked at the docs and it shows filters, functions, etc., but there are not tutorials or getting started setup guides that I’ve found.

If anyone could help with this or can point me to a tutorial of some sort, I would appreciate it.

---

<div class="post-metadata">

**Author:** ![dennisedson](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/dennisedson/32/28044_2.png) [@dennisedson](https://community.hubspot.com/u/dennisedson)\
**Post date:** [April 15, 2021, 2:27pm UTC](https://community.hubspot.com/t/prevent-page-from-refreshing-when-filtering-hubdb/35532/2 "2021-04-15T14:27:47Z")

</div>

@ckingg

If you want a prebuilt solution, you could look into something like [Isotope](https://isotope.metafizzy.co/) or [Mixitup](https://www.kunkalabs.com/mixitup/).

@Kevin-C could probably offer some advice here as well. Might be a cool tutorial we can create!

---

<div class="post-metadata">

**Author:** ![Kevin-C](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kevin-c/32/34570_2.png) [@Kevin-C](https://community.hubspot.com/u/Kevin-C)\
**Post date:** [April 15, 2021, 2:41pm UTC](https://community.hubspot.com/t/prevent-page-from-refreshing-when-filtering-hubdb/35532/3 "2021-04-15T14:41:20Z")

</div>

Thanks @dennisedson you know this is my favorite hubspot topic!

Hey @ckingg

You could prevent the page refresh on the form change, store the selected filters, on a click append them to the URL using a query param, and then submit the new URL.

The template would also need the HUBL to loop through the filters from the query\_dict to get the correct data.

Busy week, but if I can I’ll follow up with some code.

---

<div class="post-metadata">

**Author:** ![sanyog](https://avatars.discourse-cdn.com/v4/letter/s/7993a0/32.png) [@sanyog](https://community.hubspot.com/u/sanyog)\
**Post date:** [December 11, 2024, 10:59am UTC](https://community.hubspot.com/t/prevent-page-from-refreshing-when-filtering-hubdb/35532/4 "2024-12-11T10:59:16Z")

</div>

Would you please follow up on this with some code?

---

<div class="post-metadata">

**Author:** ![ckingg](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ckingg/32/31184_2.png) [@ckingg](https://community.hubspot.com/u/ckingg)\
**Post date:** [April 16, 2021, 1:44pm UTC](https://community.hubspot.com/t/prevent-page-from-refreshing-when-filtering-hubdb/35532/5 "2021-04-16T13:44:08Z")

</div>

@dennisedson @Kevin-C Thanks for the replies! I endedup going with Isotope and that seems to be working alright. However, an Ajax tutoriol would be helpful for futute projects!

---

<div class="post-metadata">

**Author:** ![ramanverma2005](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ramanverma2005/32/65559_2.png) [@ramanverma2005](https://community.hubspot.com/u/ramanverma2005)\
**Post date:** [January 10, 2022, 8:23am UTC](https://community.hubspot.com/t/prevent-page-from-refreshing-when-filtering-hubdb/35532/6 "2022-01-10T08:23:54Z")

</div>

Hi @Kevin-C but isotope filter the records from the showed records only not from all the records I don’t want to load all the records but filter should be working with all records along with load more options and copepen code will be great thanks in advance
