# How to refresh a repeater’s items without reloading a page?

**URL:** <https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927>\
**Category:** Ask the community\
**Tags:** question, code\
**Created:** [February 14, 2020, 2:13pm UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927 "2020-02-14T14:13:40Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![bengenhes](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/bengenhes/32/10446_2.png) [@bengenhes](https://forum.wixstudio.com/u/bengenhes)\
**Post date:** [February 14, 2020, 2:13pm UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/1 "2020-02-14T14:13:40Z")

</div>

I have a repeater, which each of its item (row) includes a button that deletes the corresponding data in the related collection. Despite the successful deletion, I don’t know why the repeater doesn’t refresh itself unless I reload the page.  
How can I refresh the repeater without reloading a page?  
The following is the code I used for doing this

```javascript
export function button10_click(event) {
	// //Add your code for this event here:
	$w("#dataset3").remove()

	$w("#repeater1").forEachItem(($item, itemData, index) => {
		$item("#repeatedImage").src = itemData.img;
		$item("#repeatedText").text = itemData.description;		
		$w('#text3').show()
	});
}

```

---

<div class="post-metadata">

**Author:** ![Shan](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/shan/32/106059_2.png) [@Shan](https://forum.wixstudio.com/u/Shan)\
**Post date:** [February 14, 2020, 4:04pm UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/2 "2020-02-14T16:04:41Z")

</div>

If the repeater is connected to a dataset then [refresh the dataset](https://www.wix.com/corvid/reference/wix-dataset.Dataset.html#refresh) after the removal.

---

<div class="post-metadata">

**Author:** ![tony-brunsman](https://avatars.discourse-cdn.com/v4/letter/t/ea5d25/32.png) [@tony-brunsman](https://forum.wixstudio.com/u/tony-brunsman)\
**Post date:** [February 15, 2020, 1:38am UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/3 "2020-02-15T01:38:48Z")

</div>

Ali, I’m a little surprised that it’s deleting the right record. To get the desired result where it removes the row from the repeater and deletes the dataset record tied to it without re-loading the page, code it like this where it is specifically working with the dataset record of that repeater item:

```javascript
export function button10_click(event) {
    let $item = $w.at(event.context);
    $item("#dataset1").remove();
    $item("#dataset1").refresh()
}

```

You could put the ForEachItem code in an onItemReady function. It’s not going to allow two $item declarations.

---

<div class="post-metadata">

**Author:** ![bengenhes](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/bengenhes/32/10446_2.png) [@bengenhes](https://forum.wixstudio.com/u/bengenhes)\
**Post date:** [February 15, 2020, 3:44pm UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/4 "2020-02-15T15:44:22Z")

</div>

anthonyb, thank you so much for your help.  
Your code just solved the problem.

---

<div class="post-metadata">

**Author:** ![stephenmccall](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/stephenmccall/32/1773_2.png) [@stephenmccall](https://forum.wixstudio.com/u/stephenmccall)\
**Post date:** [September 8, 2020, 7:57am UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/5 "2020-09-08T07:57:01Z")

</div>

@tony-brunsman is this possible without using a dataset? i.e. just with code direct to the repeater?

---

<div class="post-metadata">

**Author:** ![tony-brunsman](https://avatars.discourse-cdn.com/v4/letter/t/ea5d25/32.png) [@tony-brunsman](https://forum.wixstudio.com/u/tony-brunsman)\
**Post date:** [September 8, 2020, 10:12am UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/6 "2020-09-08T10:12:29Z")

</div>

Stephen, I take it you are wondering whether or not this can be done utilizing wixData functions? It can. Here’s some generic code that will give an idea of how to proceed.

```javascript
$w.onReady(function () {
     PopulateRepeater();
});

export function PopulateRepeater(){
   wixData.query("Collection")
   .ascending("title")
   .find()
   .then((results) => {
      $w("#repeater1").data = results.items;
   })
}

export function Button10_click(event) {
 const data = $w("#repeater1").data;
 let itemData = data.find(i => i._id === event.context.itemId);
 // have _id of the repeater item; now remove from the collection.
 wixData.remove("Collection",itemData._id)
 .then((RemovedItem) => {
    // reload the repeater
    PopulateRepeater();
 })
}

export function repeater1_itemReady($item, itemData, index) {
   $item("#text1").text = itemData.title;
}

```

---

<div class="post-metadata">

**Author:** ![syd8uf](https://avatars.discourse-cdn.com/v4/letter/s/df705f/32.png) [@syd8uf](https://forum.wixstudio.com/u/syd8uf)\
**Post date:** [December 22, 2020, 9:36am UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/7 "2020-12-22T09:36:26Z")

</div>

I have a similar issue. While I have refreshed the dataset, it has only solved showing new items that are getting added. If I edit a particular item, it is updating in the collections, but not showing up in the repeater. Any suggestions?

---

<div class="post-metadata">

**Author:** ![admin-23](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/admin-23/32/708_2.png) [@admin-23](https://forum.wixstudio.com/u/admin-23)\
**Post date:** [February 10, 2021, 10:58am UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/8 "2021-02-10T10:58:22Z")

</div>

Generally speaking, setting the .data value of a repeater will refresh its content. For a more detailed explanation click below

> **[data - Velo API Reference - Wix.com](https://www.wix.com/velo/reference/$w/repeater/data)**
>
> Sets or gets the repeater data. A repeater's data is stored as an array of objects. Each object in the array must contain a unique id property which is used to ...

---

<div class="post-metadata">

**Author:** ![yisrael-wix](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/yisrael-wix/32/1107_2.png) [@yisrael-wix](https://forum.wixstudio.com/u/yisrael-wix)\
**Post date:** [February 10, 2021, 12:56pm UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/9 "2021-02-10T12:56:19Z")

</div>

To ensure that the **onItemReady()** function will refresh the **Repeater’s** content completely, you should first clear the **.data** property and then set to the new contents. Like this:

```javascript
$w("#repeater1").data = [];
$w("#repeater1").data = results.items;

```

---

<div class="post-metadata">

**Author:** ![kfamily4164](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/kfamily4164/32/28710_2.png) [@kfamily4164](https://forum.wixstudio.com/u/kfamily4164)\
**Post date:** [June 10, 2021, 11:06pm UTC](https://forum.wixstudio.com/t/how-to-refresh-a-repeater-s-items-without-reloading-a-page/25927/10 "2021-06-10T23:06:27Z")

</div>

In my case repeater was connected to dataset… &  
$w ( “#dataset1” ). refresh (); did the trick for me.