---
title: "[Frage] Jquery Plugin im Backend korrekt einbinden"
url: "https://www.typo3.net/d/125647-frage-jquery-plugin-im-backend-korrekt-einbinden"
source: "typo3.net"
tags: ["Extensions","Entwicklung","Frage","JavaScript & AJAX","TYPO3 7"]
created: "2017-01-30"
last_reply: "2017-01-30"
replies: 1
solved: false
page: 1
pages: 1
lang: "de"
---

# [Frage] Jquery Plugin im Backend korrekt einbinden

Extensions › Entwicklung · 1 Antwort · gestartet 2017-01-30

## Eröffnungsbeitrag

**KatzenDrache** · 2017-01-30 · [Beitrag #1](https://www.typo3.net/d/125647-frage-jquery-plugin-im-backend-korrekt-einbinden/1)

Hallo,

ich habe schon meherer Frontend-Plugins geschriben, nun ist es aber an der Zeit die sache auch im Backend zu verwalten.

Dabei bin ich aber auf ein Problem gestoßen

Jquery Plugins werden anscheinend nicht geladen.

Ich habe es schon wie folgt versucht:

```javascript
TYPO3.jQuery(document).ready(function () {

	TYPO3.jQuery(document.body).on('click', '.toogle', function(e){
		e.preventDefault();
		TYPO3.jQuery(this).siblings().toggleClass('active');
	});
	
	

	// ist "not a function"
        TYPO3.jQuery('.input-group-type-color').colorpicker();

        // diese varianten gehen auch nicht
        jQuery('.input-group-type-color').colorpicker();
        $('.input-group-type-color').colorpicker();
	
	
});
```

Dabei includiere ich das Script aber wie folgt:

```html
<f:be.pageRenderer
	loadJQuery="true"
	jQueryNamespace="none"
		includeCssFiles="{
			0:'{f:uri.resource(path:\'Lib/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css\')}'
			1:'{f:uri.resource(path:\'Css/Backend/BackendLayout/input.css\')}'
		}"
	includeRequireJsModules="{
			1:'{f:uri.resource(path: \'Js/Backend/BackendLayout/input.js\')}',
			0:'{f:uri.resource(path: \'Lib/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js\')}'			
		}"
/>
```

weiss jemand was es noch zu beachten gibt wenn man Jquery Plugins von Dritten benutzt?

## Antworten

### [#2](https://www.typo3.net/d/125647-frage-jquery-plugin-im-backend-korrekt-einbinden/2) · KatzenDrache · 2017-01-30

Hallo,

ich konnte das Problem lösen, indem ich mein JS wie folgt nun wrappe:

```javascript
require(["jquery"], function($) {
	
	$(document).ready(function () {

		$(document.body).on('click', '.toogle', function(e){
			e.preventDefault();
			$(this).toggleClass('active');
			$(this).siblings().toggleClass('active');
		});
		
		
		$('.input-group-type-color').colorpicker();	
		
		
	});
});
```

anscheinend reicht da ein require(["jquery"], function($) {.....});

---

Quelle: „[Frage] Jquery Plugin im Backend korrekt einbinden“, typo3.net, https://www.typo3.net/d/125647-frage-jquery-plugin-im-backend-korrekt-einbinden
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.