[Frage] TCA userfunc und jQuery nutzen [Gelöst] TYPO3-Version: 6.0.12

  • ironpfu ironpfu
    R2-D2
    0 x
    99 Beiträge
    1 Hilfreiche Beiträge
    12. 05. 2014, 09:43

    Hallo zusammen,
    Ich arbeite gerade an einer Extension (Extbase/fluid) und
    ich nutze in der TCA eine eigene userfunc um das Eingabefeld entsprechend anzupassen.
    Soweit so einfach.

    Nun benötige ich jQuery um Benutzereingabe besser verarbeiten zu können.
    Ich habe festgestellt, dass hier in einem eigenen Frame "alt_doc" gerendert wird, welche standardmäßig jQuery einbinden sollte:

    1. <!-- TYPO3 Script ID: typo3/alt_doc.php -->
    2.  
    3. -->
    4. /*]]>*/
    5. </style>
    6.  
    7. <script src="contrib/jquery/jquery-1.8.2.min.js" type="text/javascript"></script>
    8. <script type="text/javascript">
    9. /*<![CDATA[*/
    10. var TYPO3 = TYPO3 || {}; TYPO3.jQuery = jQuery.noConflict(true);
    11. /*]]>*/

    Wenn ich nun in meiner userfunc folgenden Code aufrufe:

    1. <script type="text/javascript">
    2. $(function () {
    3. $(".map").maphilight();
    4.  
    5. $("map[name=body_Map] area").click(function () {
    6. alert($(this).attr("part"));
    7. $( "input[name=\"' . $PA['itemFormElName'] . '\"]" ).val($(this).attr("part"));
    8. });
    9. });
    10. </script>

    Kommt es zu folgender Fehlermeldung:

    1. TypeError: $ is undefined

    Nun habe ich folgende Lösungen versucht:
    Eigenes jQuery direkt im code einzubinden (sehr unsauber)
    Das Problem dabei ist, dass nun alles Läuft aber die Typo3 Funktionen gestört/beeinträchtigt werden (wie zB. das Speichern)

    1. <script type="text/javascript" src="'.t3lib_extMgm::extRelPath('pmt').'Resources/Public/BodyMap/jquery-2.1.1.min.js"></script>

    Zweiter Lösungsversuch:
    jQuery im header einzubinden, welches ebenfalls zu einem Konflikt mit der Standardeinbindung führt.

    1. # include own JS
    2. $renderer = t3lib_div::makeInstance('t3lib_PageRenderer');
    3. $renderer->addJsFile(t3lib_extMgm::extRelPath('pmt').'Resources/Public/BodyMap/jquery-1.9.0.js');

    Hat hier jemand Erfahrung bzw. einen Tipp, wich ich jQuery in einer TCA userfunc nutzen kann?

  • jenses jenses
    Flash Gordon
    1 x
    3087 Beiträge
    106 Hilfreiche Beiträge
    14. 05. 2014, 09:27 - Lösung

    Ich sehe gerade, daß es "TYPO3.jQuery" statt "jQuery" heißen muß.

    Ansonsten könntest du dein Script noch kapseln mit z.B. window.onload=function(){SomeJavaScriptCode};

  • Hilfreichster Beitrag

  • 1 x
    19 Beiträge
    1 Hilfreiche Beiträge
    17. 12. 2016, 17:41 - Hilfreichster Beitrag

    Entweder:
    mal schauen was :

    1. JQUERY_NAMESPACE_DEFAULT_NOCONFLICT

    macht ;-)
    [url]https://typo3.org/api/typo3cms/class_t_y_p_o3_1_1_c_m_s_1_1_core_1_1_page_1_1_page_renderer.html#a5aadc370a25af51f60339039da973b90[/url]
    denn das schlimme ist ja beim "jQuery.noConflict(true);" das true, was jQuery komplett "entfernt".
    oder... am anfang von deinem js jQuery wieder zurückmappen...
    1. var jQuery = TYPO3.jQuery;
    2. // nu is jQuery wieder am Start
    3. jQuery(document).ready(function () {
    4. jQuery('#whatever').....
    5. });

    was man nur machen sollte, wenn man jQuery Sachen einbindet, denen man das nicht anders beibringen kann oder will.

    oder du packst es in einen wrapper, wenn du das nur so am rande brauchst:

    1. // wrapper begin
    2. (function ($) {
    3. // nu haste wieder $ wie gewohnt...
    4. $(document).ready(function () {
    5. $('#whatever').....
    6. });
    7. // uuuuuund ende...
    8. }(TYPO3.jQuery));
    9. // wrapper ende


  • 1
  • jenses jenses
    Flash Gordon
    0 x
    3087 Beiträge
    106 Hilfreiche Beiträge
    13. 05. 2014, 08:33

    jQuery läuft (wie man auch sehr schön in dem von dir geposteten Codeschnipsel sehen kann) im noConflict-Mode.
    Schon mal was davon gehört?

    Ersetze in deinem Code alle Vorkommen von "$" durch "jQuery", und alles wird gut.

  • ironpfu ironpfu
    R2-D2
    0 x
    99 Beiträge
    1 Hilfreiche Beiträge
    13. 05. 2014, 11:01

    Danke für deine Antwort. Das mit dem noConflict war mir nicht bewusst. Leider löst dies aber auch nicht mein Problem:
    [code]TypeError: jQuery is undefined
    [/code]
    Wie bereits beschrieben wird jQuery eingebuden, steht aber aus einem mir unerklärlichen Grund in der userFunc nicht zur Verfügung. Andere Idee?

    P.S.: Ich denke es liegt daran, dass die jQuery im Header geladen wird und das javascript aus der userfunc irgendwie zu früh geladen wird?

  • jenses jenses
    Flash Gordon
    1 x
    3087 Beiträge
    106 Hilfreiche Beiträge
    14. 05. 2014, 09:27

    Ich sehe gerade, daß es "TYPO3.jQuery" statt "jQuery" heißen muß.

    Ansonsten könntest du dein Script noch kapseln mit z.B. window.onload=function(){SomeJavaScriptCode};

  • 1 x
    19 Beiträge
    1 Hilfreiche Beiträge
    17. 12. 2016, 17:41

    Entweder:
    mal schauen was :

    1. JQUERY_NAMESPACE_DEFAULT_NOCONFLICT

    macht ;-)
    [url]https://typo3.org/api/typo3cms/class_t_y_p_o3_1_1_c_m_s_1_1_core_1_1_page_1_1_page_renderer.html#a5aadc370a25af51f60339039da973b90[/url]
    denn das schlimme ist ja beim "jQuery.noConflict(true);" das true, was jQuery komplett "entfernt".
    oder... am anfang von deinem js jQuery wieder zurückmappen...
    1. var jQuery = TYPO3.jQuery;
    2. // nu is jQuery wieder am Start
    3. jQuery(document).ready(function () {
    4. jQuery('#whatever').....
    5. });

    was man nur machen sollte, wenn man jQuery Sachen einbindet, denen man das nicht anders beibringen kann oder will.

    oder du packst es in einen wrapper, wenn du das nur so am rande brauchst:

    1. // wrapper begin
    2. (function ($) {
    3. // nu haste wieder $ wie gewohnt...
    4. $(document).ready(function () {
    5. $('#whatever').....
    6. });
    7. // uuuuuund ende...
    8. }(TYPO3.jQuery));
    9. // wrapper ende

  • 1