Joomla component include JavaScript, pop error

Question

I'm new in Joomla, I have try to build my Joomla component, however, when I try to include Jquery ptTimeSelect library into front end it shows javascript error

Uncaught TypeError: Cannot read property '_doCheckMouseClick' of undefined

I did a lot google, and did change the place of the code, it seems Joomla automatic ignore part of the code cause this problem（maybe it skipping any code with "_"underscore ), and I did try to rename _doCheckMouseClick to doCheckMouseClick, it show the same kind error message.

here are the code pops error

calling function: line 228 in file

 $(document).mousedown(jQuery.ptTimeSelect._doCheckMouseClick);  

define function: line 387 in file

 /**
 * Closes the timePicker popup if user is not longer focused on the
 * input field or the timepicker
 * 
 * @private
 * @param {jQueryEvent} ev -    Event passed in by jQuery
 * @return {undefined}
 */
jQuery.ptTimeSelect._doCheckMouseClick = function(ev){
    if (!$("#ptTimeSelectCntr:visible").length) {
        return;
    }
    if (   !jQuery(ev.target).closest("#ptTimeSelectCntr").length
        && jQuery(ev.target).not("input.isPtTimeSelectActive").length ){
        jQuery.ptTimeSelect.closeCntr();
    }

};// jQuery.ptTimeSelect._doCheckMouseClick

Please help

Answer 1

I believe the issue is tied to the fact the DOM might not be ready by the time the method is called. Another issue is Joomla still uses Mootools for a large portion of the core client side functionality, which also uses the $ as the library entry point. You can use an IIFE (Immediately Instantiated Function Expression) to creatively handle this in combination with the jQuery ready event. First add the jQuery version included with Joomla by executing the following method:

JHtml::_('jquery.framework');

Then wrap your jQuery code like so:

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

        // Insert code here, using $ instead of jQuery

    });
}(jQuery));

This should allow the function to be called.

Answer 2

After few try, I found out Joomla have a bug with include JavaScript library, and I solve this problem by copy the code directly into the view/default template, by using

<?php
$document = JFactory::getDocument();
$document->addScriptDeclaration("
  //300 lines of ptTimeSelect code
")

Hope this help for others who meet the same problem.

Answer 3

I have same problem with Zoo Component in Admin area after updage Joomla to 3.4.8.

I solve this upgdating Zoo jquery library in:

/media/zoo/libraries/jquery