# Ergänzung neuer Button für einen "Hard-Reload"

**URL:** <https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649>\
**Category:** Embedded Documents for enaio® und yuuvis®\
**Created:** [21. Januar 2025 um 10:35 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649 "2025-01-21T10:35:05Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![danielstraub](https://ecm.community/user_avatar/ecm.community/danielstraub/32/108_2.png) [@danielstraub](https://ecm.community/u/danielstraub)\
**Post date:** [21. Januar 2025 um 10:35 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/1 "2025-01-21T10:35:05Z")

</div>

Hallo zusammen,

in einigen Fällen hatten wir es bei unseren Kunden gehabt, dass ein Reload von Embedded Documents teilweise Probleme behebt - meist Probleme in Zusammenhang mit dem DMS-Service.  
Dieser Reload ist aktuell nur über die Entwicklerkonsole + STRG + R möglich.

Eventuell wäre es sinnvoll für diesen Reload einen eigenen Button auf der GUI zu ergänzen.

---

<div class="post-metadata">

**Author:** ![rk](https://ecm.community/user_avatar/ecm.community/rk/32/679_2.png) [@rk](https://ecm.community/u/rk)\
**Post date:** [21. Januar 2025 um 11:47 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/2 "2025-01-21T11:47:07Z")

</div>

Hallo @danielstraub, mit enaio 11.0 und neuer ist der Reload bei allen Dashlets von OPTIMAL SYSTEMS mit F5 global ermöglicht worden.

Im Kontext eines Kunden hatten wir die Neuladefunktion bereits einmal als Interceptor vorgesehen. Wäre das für Euch auch eine Option?

---

<div class="post-metadata">

**Author:** ![danielstraub](https://ecm.community/user_avatar/ecm.community/danielstraub/32/108_2.png) [@danielstraub](https://ecm.community/u/danielstraub)\
**Post date:** [21. Januar 2025 um 13:58 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/3 "2025-01-21T13:58:00Z")

</div>

Hallo @rk,

stimmt das wäre ja auch eine Möglichkeit. Das sollte ausreichend sein. Habt ihr hierzu schon ein fertiges Code-Beispiel? Alternativ würden wir so etwas vermutlich auch entwerfen können.

---

<div class="post-metadata">

**Author:** ![rk](https://ecm.community/user_avatar/ecm.community/rk/32/679_2.png) [@rk](https://ecm.community/u/rk)\
**Post date:** [22. Januar 2025 um 06:49 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/4 "2025-01-22T06:49:07Z")

</div>

Hallo @danielstraub, das war damals nicht ich, aber ich frage gerne nach. 🙂

Grundsätzlich braucht es halt einen Button, welcher `location.reload()` aufruft (oder ein aktuelles enaio).

---

<div class="post-metadata">

**Author:** ![rk](https://ecm.community/user_avatar/ecm.community/rk/32/679_2.png) [@rk](https://ecm.community/u/rk)\
**Post date:** [22. Januar 2025 um 15:52 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/5 "2025-01-22T15:52:16Z")

</div>

Hallo zusammen, der Code könnte in etwa so aussehen:

```js
const refreshFile = {
	id: "ed-refresh",
	toolGroup: "default", 
	
	updateEditorConfiguration: async (instance, info, config) => {
		const that = refreshFile;
			
		instance.UI.setHeaderItems((header) => {
			if(!that.exists(header.getHeader(that.toolGroup).getItems())) {
				header.getHeader(that.toolGroup).push(that.getButton(config, () => {
					
					window.location.reload(true);
				}));
			}
		});
	},
	
	getButton(config, onClick = null) {
		const that = refreshFile;
		
		let button = {
			type: 'actionButton',
			id: that.id,
			title: "Aktualisieren",
			img: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" enable-background="new 0 0 64 64"><path d="m53.213 10.786c-11.715-11.715-30.711-11.715-42.426 0-11.716 11.717-11.716 30.71 0 42.427 11.715 11.715 30.711 11.715 42.426 0 11.716-11.717 11.716-30.71 0-42.427m-7.213 42.212l-3.86-4.24c-3.082 1.996-6.623 3.088-10.331 3.088-10.922 0-19.809-9.481-19.809-20.847h7.843c0 7.234 5.368 12.58 11.966 12.58 1.64 0 3.227-.354 4.691-1.016l-3.942-4.33h13.442v14.765m-1.832-21.999c0-6.853-5.36-11.982-11.948-11.982-1.706 0-3.366.357-4.895 1.041l4.207 4.088h-13.532v-13.147l3.456 3.357c3.207-2.084 6.918-3.17 10.764-3.17 10.906 0 19.78 9.041 19.78 19.812h-7.832z" fill="#757575"/></svg>',
		};
		
		if(onClick && typeof onClick == "function") {
			button.onClick = onClick;
		}
		
		return button;
	},
	
	exists(items) {
		const that = refreshFile;
		
		for(let item in items) {
			let tool = items[item];
			
			if (Object.keys(tool).includes('id') && tool.id == that.id) {
				return true;
			}
		}
		
		return false;
	}
};

window.ed.registerInterceptor(refreshFile);

```

---

<div class="post-metadata">

**Author:** ![MaxBitzer](https://ecm.community/user_avatar/ecm.community/maxbitzer/32/723_2.png) [@MaxBitzer](https://ecm.community/u/MaxBitzer)\
**Post date:** [5. September 2025 um 09:38 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/6 "2025-09-05T09:38:30Z")

</div>

Guten Tag,

kann es sein das dieser Interceptor in der Version 2.4.2 nicht mehr funktioniert?

Egal wie ich das Ganze anlege, es erscheint kein Button und damit auch keine Möglichkeit für einen normalen User auf einen einfachen Hard reload.

LG

Max Bitzer

---

<div class="post-metadata">

**Author:** ![uw](https://ecm.community/user_avatar/ecm.community/uw/32/695_2.png) [@uw](https://ecm.community/u/uw)\
**Post date:** [5. September 2025 um 14:01 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/7 "2025-09-05T14:01:55Z")

</div>

Hallo @MaxBitzer,

ich habe gerade auch auf das andere Ticket geantwortet. Möglicherweise gibt es bei Ihnen gerade ein grundsätzliches Problem beim Laden der Interceptoren.

Könnten Sie die DevTools des Browsers/Dashlets öffnen und prüfen welche Meldungen hier angezeigt werden? Relevant sind der Console und Netzwerk Tab.

 ![grafik](https://ecm.community/uploads/default/original/1X/42432db8d06d677db30081fa9bd7b358d50e1bbf.png)

Wenn Sie die DevTools offnen haben, dann zur Sicherheit einfach F5 drücken, um das Dashlet hard neu zu laden.

Wenn Sie den RichClient verwenden:

 ![grafik](https://ecm.community/uploads/default/original/1X/957711544b31762896572c260a247589235960ad.png)

Beim Webclient:  
F12 oder Ctrl+Alt+I drücken.

Grüsse  
Uli

---

<div class="post-metadata">

**Author:** ![MaxBitzer](https://ecm.community/user_avatar/ecm.community/maxbitzer/32/723_2.png) [@MaxBitzer](https://ecm.community/u/MaxBitzer)\
**Post date:** [8. September 2025 um 12:29 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/8 "2025-09-08T12:29:42Z")

</div>

Hallo,

ich habe es inzwischen hinbekommen.

Ich musste den Button in die Nav-Bar Class mit einfügen mit folgendem Code, danach war die Anzeige kein Problem.  
Nicht wundern, ein Druckdialog ist hier auch implementiert, aber noch nicht fertig.

> **Interceptor Code**
>
> ```auto
> // --- 1. Konfiguration ---
> const REFRESH_BUTTON_ID = 'refresh-button';
> const PRINT_BUTTON_ID = 'print-button';
> let styleAdded = false;
> 
> // Füge die Print-Styles in den <head> des Dokuments ein
> const addPrintStyles = () => {
> if (!styleAdded) {
> const style = document.createElement('style');
> style.type = 'text/css';
> style.innerHTML = `
> @media print {
> /* Verstecke die Haupt-Navigationsleiste */
> .ed-header {
> display: none !important;
> }
> /* Verstecke alle Seitenleisten und Panelen */
> .ed-panel-container {
> display: none !important;
> }
> /* Sorge dafür, dass der Haupt-Content-Bereich den gesamten Platz einnimmt */
> body, html, .ed-main-content-container {
> padding: 0 !important;
> margin: 0 !important;
> width: 100% !important;
> height: 100% !important;
> }
> }
> `;
> document.head.appendChild(style);
> styleAdded = true;
> }
> };
> 
> // --- 2. Interceptor für den Druck-Button-Status ---
> // Dieser Interceptor kümmert sich nur darum, den Druck-Button zu de-/aktivieren.
> const printViaEnaioInterceptor = {
> id: "ed-print",
> onState: (instance, info) => {
> const printButton = document.querySelector(`[data-element="${PRINT_BUTTON_ID}"]`);
> if (printButton) {
> if (info.mode === "edit") {
> printButton.disabled = true;
> } else {
> printButton.disabled = false;
> }
> }
> }
> };
> 
> window.ed.registerInterceptor(printViaEnaioInterceptor);
> 
> // --- 3. MutationObserver für die Button-Platzierung ---
> // Diese Funktion fügt beide Buttons direkt ins DOM ein, sobald die Navbar vorhanden ist.
> const addButtonsToNavbar = () => {
> const navbarNav = document.querySelector('.navbar-nav');
>     
> // Prüfen, ob die Navbar existiert und die Buttons nicht schon hinzugefügt wurden
> if (navbarNav && !document.getElementById(REFRESH_BUTTON_ID)) {
>         
> // Button "Aktualisieren" erstellen
> const refreshLi = document.createElement('li');
> refreshLi.classList.add('nav-item');
> refreshLi.id = REFRESH_BUTTON_ID; // Für einfache Identifizierung
> 
> const refreshButton = document.createElement('button');
> refreshButton.classList.add('nav-link');
> refreshButton.innerHTML = "Aktualisieren";
> refreshButton.onclick = () => window.location.reload();
> 
> refreshLi.appendChild(refreshButton);
> 
> // Button "Druck aus enaio" erstellen
> const printLi = document.createElement('li');
> printLi.classList.add('nav-item');
> printLi.id = PRINT_BUTTON_ID; // Für einfache Identifizierung
>         
> const printButton = document.createElement('button');
> printButton.classList.add('nav-link');
> printButton.setAttribute('data-element', PRINT_BUTTON_ID); // Wichtig für Interceptor
> printButton.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-printer" viewBox="0 0 16 16"><path d="M2.5 8a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1"/><path d="M5 1a2 2 0 0 0-2 2v2H2a2 2 0 0 0-2 2v3a2 2 0 0 0 2 2h1v1a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2v-1h1a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-1V3a2 2 0 0 0-2-2zM4 3a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2H4zm1 5a2 2 0 0 0-2 2v1H2a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-1v-1a2 2 0 0 0-2-2zm7 2v3a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1"/></svg>';
> printButton.title = "Druck aus enaio";
> printButton.onclick = () => {
> window.print();
> };
> printLi.appendChild(printButton);
> 
> // Buttons zur Navbar hinzufügen
> navbarNav.appendChild(refreshLi);
> navbarNav.appendChild(printLi);
>         
> addPrintStyles();
> return true;
> }
> return false;
> };
> 
> // Startet die Überwachung des DOM
> const observer = new MutationObserver((mutations, obs) => {
> if (addButtonsToNavbar()) {
> obs.disconnect();
> console.log("Buttons erfolgreich eingefügt.");
> }
> });
> 
> observer.observe(document.body, {
> childList: true,
> subtree: true
> });
> 
> ```
> 
> ![image](https://ecm.community/uploads/default/original/1X/ca86fe3036c33dc3a8edc575fa67038ccb09bbc9.png)

LG

Max Bitzer

---

<div class="post-metadata">

**Author:** ![uw](https://ecm.community/user_avatar/ecm.community/uw/32/695_2.png) [@uw](https://ecm.community/u/uw)\
**Post date:** [9. September 2025 um 14:14 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/9 "2025-09-09T14:14:17Z")

</div>

Hall @MaxBitzer ,

ich könnte eine API für die Interceptoren bereitstellen, um in diese Leiste Buttons ein- und auszublenden. An sich gibt es diese bereits, aber sie ist aus dem Interceptor heraus leider noch nicht gut nutzbar.

Die API könnte dann in etwa so aussehen:

 ![grafik](https://ecm.community/uploads/default/original/1X/ac1fe23b619a7ed5322ff23687fcff9d56ac417f.png)

Wäre es sinnvoll, diese API einzubauen?

Liebe Grüsse  
Uli

---

<div class="post-metadata">

**Author:** ![MaxBitzer](https://ecm.community/user_avatar/ecm.community/maxbitzer/32/723_2.png) [@MaxBitzer](https://ecm.community/u/MaxBitzer)\
**Post date:** [10. September 2025 um 05:48 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/10 "2025-09-10T05:48:10Z")

</div>

Guten Tag @uw

Also praktisch wäre es allemal, da es den Einbau von Buttons deutlich vereinfacht. Speziell den im Thread genannten Anwendungsfall konnte ich aber inzwischen selbst lösen. Lange nicht so elegant, aber es funktioniert.

LG

Max Bitzer

---

<div class="post-metadata">

**Author:** ![uw](https://ecm.community/user_avatar/ecm.community/uw/32/695_2.png) [@uw](https://ecm.community/u/uw)\
**Post date:** [22. September 2025 um 12:58 UTC](https://ecm.community/t/ergaenzung-neuer-button-fuer-einen-hard-reload/649/11 "2025-09-22T12:58:51Z")

</div>

Hallo @MaxBitzer,

Ich habe das Thema als Entwicklungs-Ticket [#14251] mit niedriger Priorität aufgenommen.

Grüsse  
Uli