13 Replies Latest reply on Dec 8, 2015 3:02 AM by pushpendra.paliwal

    $j is not defined

      Im trying to get a simple littel JQuery script to run inside and HTML widget on a social group homepage (so that we can implement the really cool scripts aka Coin Slider.js). But i cant seem to make JQuery play nice.

       

      Heres the HTML

       

      <div id="homepage_get_doc1"></div> 

      <script> 

      $j('#homepage_get_doc1').html("<b>Hello</b>");   

      </script>

       

      And heres the error:

       

      Uncaught ReferenceError: $j is not defined


      Im using Chrome, and Jive for Teams (Cloud)  6+.


      #NFI

        • Re: $j is not defined
          Ryan Rutan

          Could you confirm the jive version?  Are you in a simple HTML Widget?

           

          RR

          • Re: $j is not defined
            phrough

            Have you tried the non shortcut version?

            jQuery('#homepage_get_doc1').html("<b>Hello</b>");


            You can also try wrapping your jquery and make use of the $ shorthand.


            jQuery(document).ready(function($){

                 $('#homepage_get_doc1').html("<b>Hello</b>")

            });

            • Re: $j is not defined
              phrough

              You might also find this document helpful.

              Lessons Learned in Jive 5 Widget Development

              • Re: $j is not defined
                deesteel

                Hi Daniel,

                 

                I just put up a Jive 6 environment and noticed I'm getting the same errors. It looks like HTML widgets are now part of an iframe, and the iframe doesn't have any knowledge of the embedded jQuery that Jive is using.

                 

                I was able to get the widget working, by embedding the generated js file within its HTML, but need to figure out a better way to reference the internal jQuery file.

                 

                Also since its an iframe, the height of the iframe will also be affected, I'm working on a new version of the HTML Widget: How to Create a Content Slider for Jive 6, I'll post it as soon as I can.

                 

                thanks

                  • Re: $j is not defined
                    deesteel

                    Got HTML widgets working with script tags, basically you just have to add the following to the top of your HTML Widget:

                    <script src="/resources/scripts/jquery/jquery.js"></script>

                     

                    Then within your main javascript block, before any jQuery is called add this:

                    var $j = jQuery.noConflict();

                     

                    Since its in an iframe, the HTML height may not be passed back to the dashboard properly, if so you have to increase the height of the HTML widget by doing something like below. Just make sure you change "containerName" to the outermost div, and change the height to a number that is slightly larger then your HTML page height.

                    $j("#containerName").height(500);

                    2 people found this helpful
                      • Re: $j is not defined
                        wigsie

                        OMG, don't know you but I could kiss you!!

                         

                        I don't even want to say how long I've been trying to figure this out.

                         

                        FYI, What you proposed fixed my problem without having to add the following system property:

                         

                             jive.htmlwidget.cleansejavascript  =  false

                         

                        Lots of people seem to try to change that property to fix this kind of issue, but at least for me, the setting of that property had nothing to do with it.

                         

                        I really couldn't figure it out b/c I'm an administrator, and all along, my javascript/jquery was *not* getting stripped out. I could see it on the client.

                         

                        But this fixed it.

                         

                        Thanks so much!!!

                          • Re: $j is not defined
                            deesteel

                            Your welcome glad it helped. Depending on what's in your widget, you may need to have it resize the iframe after jquery actions are performed.

                             

                            You can use this snippet to resize the iframe (it calls an internal jive function, and puts a delay on the call in milliseconds). You may need to tweek the milliseconds to get it to render correctly. J Tran can help you as I've worked with her alot in the past.

                             

                            setTimeout(resizeMe,600);

                            • Re: $j is not defined
                              phrough

                              I believe you've got the wrong system property. The system property you want is: html.widget.safemode.enabled = false

                               

                              As a security precaution, Jive 6 isolates html widgets with javascript in an iframe. This prevents any widget based javascript from manipulating core functionality.

                            • Re: $j is not defined
                              gopi.gorantala

                              Thanks Dave, this resolved my issue.

                               

                              Thanks,

                              -Gopi.