# Plugin: Einkaufswelt-Element mit eigener ExtJS Komponente

**URL:** <https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494>\
**Category:** Programmierung\
**Created:** [24. November 2015 um 16:28 UTC](https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494 "2015-11-24T16:28:45Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![oli](https://avatars.discourse-cdn.com/v4/letter/o/2bfe46/32.png) [@oli](https://forum.shopware.com/u/oli)\
**Post date:** [24. November 2015 um 16:28 UTC](https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494/1 "2015-11-24T16:28:45Z")

</div>

Hallo, ich versuche gerade per Plugin ein Einkaufswelt-Element mit eigener ExtJS Komponente zu erstellen, allerdings endet das ganze in einem Javascript-Error sobald man das Element bearbeiten will. Shopware 5.0.2 [code]Bootstrap.php\<?php class Shopware\_Plugins\_Backend\_BlogEmotionComponent\_Bootstrap extends Shopware\_Components\_Plugin\_Bootstrap  
{  
const VERSION = ‚1.0.0‘;

```
public function getLabel()
{
    return 'Emotion-Element: Blogeinträge';
}

public function getVersion()
{
    return self::VERSION;
}

public function install()
{
    $this->createEmotionComponents(); return true; } private function createEmotionComponents() { $component = $this-\>createEmotionComponent(array( 'cls' =\> 'emotion-blog-integration', 'name' =\> 'Blog-Integration', 'template' =\> 'emotion-blog-integration', 'xtype' =\> 'emotion-blog-integration' )); // einige settings mit $component-\>createTextField() .. } } [/code] [code] Views/emotion\_components/backend/emotion\_blog\_integration.js Ext.define('Shopware.apps.Emotion.view.components.BlogIntegration', { extend: 'Shopware.apps.Emotion.View.components.Base', alias: 'widget.emotion-blog-integration', initComponent: function() { var me = this; me.callParent(arguments); } }); [/code] Nach der Installation habe ich alle Caches geleert und das Backend neu gestartet. In der Designer-Ansicht der Einkaufswelt taucht mein Element auf und ich kann es ins Grid ziehen. Sobald ich es bearbeiten will fliegt folgender Fehler (inkl. Stacktrace): [code] Uncaught TypeError: Cannot read property 'substring' of undefined Ext.ClassManager.parseNamespace @ ext-all-debug.js?201507160826:4493 Ext.ClassManager.get @ ext-all-debug.js?201507160826:4601 Ext.ClassManager.instantiate @ ext-all-debug.js?201507160826:4839 Ext.ClassManager.instantiateByAlias @ ext-all-debug.js?201507160826:4821 Ext.apply.widget @ ext-all-debug.js?201507160826:5098 Ext.define.create @ ext-all-debug.js?201507160826:44907 Ext.define.lookupComponent @ ext-all-debug.js?201507160826:75477 Ext.define.prepareItems @ ext-all-debug.js?201507160826:75449 Ext.define.add @ ext-all-debug.js?201507160826:75500 Ext.define.initItems @ ext-all-debug.js?201507160826:75344 Base.implement.callParent @ ext-all-debug.js?201507160826:3735 Ext.define.initItems @ ext-all-debug.js?201507160826:91915 Ext.define.initComponent @ ext-all-debug.js?201507160826:75328 Base.implement.callParent @ ext-all-debug.js?201507160826:3735 Ext.define.initComponent @ ext-all-debug.js?201507160826:91905 Base.implement.callParent @ ext-all-debug.js?201507160826:3735 Ext.define.initComponent @ ext-all-debug.js?201507160826:92206 Base.implement.callParent @ ext-all-debug.js?201507160826:3735 Ext.override.initComponent @ base?file=bootstrap&loggedIn=1448378636:1273 Base.implement.callParent @ ext-all-debug.js?201507160826:3735 Ext.define.initComponent @ ext-all-debug.js?201507160826:110583 Base.implement.callParent @ ext-all-debug.js?201507160826:3735 Ext.define.initComponent @ base?file=bootstrap&loggedIn=1448378636:1657 Base.implement.callParent @ ext-all-debug.js?201507160826:3735 Ext.define.initComponent @ /backend/Emotion/load/?f=m/Emotion|m/EmotionElement|m/Component|m/Field|m/Attribute|m/BannerSlider|…:2400 Ext.define.constructor @ ext-all-debug.js?201507160826:45265 Base.implement.callParent @ ext-all-debug.js?201507160826:3735 Ext.define.constructor @ ext-all-debug.js?201507160826:57622 constructor @ ext-all-debug.js?201507160826:4334 (anonymous function) @ VM16752:3 Ext.ClassManager.instantiate @ ext-all-debug.js?201507160826:4876 (anonymous function) @ ext-all-debug.js?201507160826:1840 Ext.apply.create @ ext-all-debug.js?201507160826:3311 Ext.define.onOpenSettingsWindow @ /backend/Emotion/load/?f=m/Emotion|m/EmotionElement|m/Component|m/Field|m/Attribute|m/BannerSlider|…:5141 Ext.util.Event.Ext.extend.fire @ ext-all-debug.js?201507160826:8638 Ext.override.dispatch @ base?file=bootstrap&loggedIn=1448378636:657 Ext.override.fireEvent @ ext-all-debug.js?201507160826:58383 Ext.define.onOpenSettingsWindow @ /backend/Emotion/load/?f=m/Emotion|m/EmotionElement|m/Component|m/Field|m/Attribute|m/BannerSlider|…:1774 me.getEl.on.click.fn @ /backend/Emotion/load/?f=m/Emotion|m/EmotionElement|m/Component|m/Field|m/Attribute|m/BannerSlider|…:1382 (anonymous function) @ VM17084:7 wrap @ ext-all-debug.js?201507160826:9260 [/code] Wie man sieht habe ich schon auf ext-all-debug.js umgestellt um dem Fehler auf die Schliche zu kommen. Der vierte Eintrag im Stacktrace zeigt, dass Ext versucht, die Komponente nach alias zu instantiieren: Ext.ClassManager.instantiateByAlias @ ext-all-debug.js?201507160826:4821 In der entsprechenden Map ist meine Komponente allerdings nicht gelistet, obwohl sie geladen wurde (verifiziert indem ich die Responses vom Shop beim Laden beobachtet habe, hier wird eine Datei geladen, die u.A. auch meine Komponente enthält) Hat das schon mal jemand gehabt oder kann mir einen Tip geben?
```

---

<div class="post-metadata">

**Author:** ![wontfix](https://avatars.discourse-cdn.com/v4/letter/w/b19c9b/32.png) [@wontfix](https://forum.shopware.com/u/wontfix)\
**Post date:** [8. Dezember 2015 um 11:05 UTC](https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494/2 "2015-12-08T11:05:01Z")

</div>

jou, die debug info von extjs ist ziemlich nutzlos, und die aussage “Uncaught TypeError: Cannot read property ‘substring’ of undefined” hilft überhaupt nicht weiter. aber nach trial-und-error habe ich herausgefunden das die extjs-ding dateiname darf nicht “-” erhalten… also probiere mal mit “emotion\_blog\_integration.js” und “‘template’ =\> ‘emotion\_blog\_integration’” ich hoffe deine nächste nuztlose extjs error wird nicht “unexpected token :” sein 😜

---

<div class="post-metadata">

**Author:** ![wontfix](https://avatars.discourse-cdn.com/v4/letter/w/b19c9b/32.png) [@wontfix](https://forum.shopware.com/u/wontfix)\
**Post date:** [8. Dezember 2015 um 11:19 UTC](https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494/3 "2015-12-08T11:19:21Z")

</div>

[quote=“wontfix”]ich hoffe deine nächste nuztlose extjs error wird nicht “unexpected token :” sein ;P[/quote] und wieder nach trial-und-error ist die lösung dafür: die erste zeile in der extjs-ding datei muss ne kommentar sein! (inhalt der kommentart ist wohl wurst…) :wtf:

---

<div class="post-metadata">

**Author:** ![wontfix](https://avatars.discourse-cdn.com/v4/letter/w/b19c9b/32.png) [@wontfix](https://forum.shopware.com/u/wontfix)\
**Post date:** [8. Dezember 2015 um 11:39 UTC](https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494/4 "2015-12-08T11:39:08Z")

</div>

(…)

---

<div class="post-metadata">

**Author:** ![oli](https://avatars.discourse-cdn.com/v4/letter/o/2bfe46/32.png) [@oli](https://forum.shopware.com/u/oli)\
**Post date:** [10. Dezember 2015 um 14:18 UTC](https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494/5 "2015-12-10T14:18:11Z")

</div>

Hallo, danke für deine Antwort. Leider hat das Ersetzen der „-“ durch „\_“ nichts gebracht, ich bekomme immer noch den identischen Fehler.

---

<div class="post-metadata">

**Author:** ![Heiner\_Lohaus](https://avatars.discourse-cdn.com/v4/letter/h/b5a626/32.png) [@Heiner\_Lohaus](https://forum.shopware.com/u/Heiner_Lohaus)\
**Post date:** [14. Dezember 2015 um 14:33 UTC](https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494/6 "2015-12-14T14:33:58Z")

</div>

Hallo, das Backend-Element muss diesen Datei-Namen haben: ` Views/emotion\_components/backend/blog\_integration.js `Er leitet sich vom ExtJS-Element ab: `Ext.define('Shopware.apps.Emotion.view.components.BlogIntegration', { ` Und ein paar fertige Bespiele findet man auch am Ende des Wiki-Artikels: [http://community.shopware.com/\_detail\_1459.html](http://community.shopware.com/%5C_detail%5C_1459.html) Gruß Heiner

---

<div class="post-metadata">

**Author:** ![oli](https://avatars.discourse-cdn.com/v4/letter/o/2bfe46/32.png) [@oli](https://forum.shopware.com/u/oli)\
**Post date:** [15. Dezember 2015 um 15:17 UTC](https://forum.shopware.com/t/plugin-einkaufswelt-element-mit-eigener-extjs-komponente/32494/7 "2015-12-15T15:17:11Z")

</div>

Danke für den Hinweis. Leider hat er auch nicht zum Erfolg geführt. Habe schon einen anderen Entwickler drüberschauen lassen weil ich langsam an meinem Versant zweifle, allerdings kann er den Fehler auch nicht ausmachen… Noch irgendwelche Tipps?