Confused About Jquery And Script Inclusion Handling

I am totally confused about Yii’s handling of jquery and other javascript file inclusion.

This was working:


<script type="text/javascript">

    jQuery(document).ready(function() {

        jQuery('#Event_recuring_nature, #Event_venue, #Event_expected_attendance, #Event_age_group, #Event_state, #Event_gender, #Event_ethnicity, #Event_exclusivity, #Package_cash_product_sponsorships, #Event_vanue_signature, #Event_logo_on_step_and_repeat, #Event_inclusion_in_press, #Event_ad_space, #Event_inclusion_in_event_materials, #Package_category_exclusivity, #logo_on_signature, #Event_proposed_events_included, #Event_dependant_on_sponsorship, #Event_sponsorship_type, #Event_attendee_professions, #Event_attendee_income').yaselect();

    });

</script>

<script type="text/javascript" src="/js/libs/jquery-ui-datetimepicker.js"></script>

<script type="text/javascript" src="/js/event_create.js"></script>

<script type="text/javascript" src="/js/slider.js"></script>

<script type="text/javascript" src="/js/other_social.js"></script>

<script type="text/javascript" src="/js/package.js"></script>

while this (which supposedly would be better?) does not:


<?php 

Yii::app()->clientScript->registerScript('create-script', "

    $(function()  {

    	  $('body').css('overflow-x','hidden');

        $('#Event_recuring_nature, #Event_venue, #Event_expected_attendance, #Event_age_group, #Event_state, #Event_gender, #Event_ethnicity, #Event_exclusivity, #Package_cash_product_sponsorships, #Event_vanue_signature, #Event_logo_on_step_and_repeat, #Event_inclusion_in_press, #Event_ad_space, #Event_inclusion_in_event_materials, #Package_category_exclusivity, #logo_on_signature, #Event_proposed_events_included, #Event_dependant_on_sponsorship, #Event_sponsorship_type, #Event_attendee_professions, #Event_attendee_income').yaselect();

    });

   

");

?>

<?php Yii::app()->clientScript->registerScriptFile($this->assetsBase.'/js/libs/jquery-ui-datetimepicker.js'); ?>

<?php Yii::app()->clientScript->registerScriptFile($this->assetsBase.'/js/event_create.js'); ?>

<?php Yii::app()->clientScript->registerScriptFile($this->assetsBase.'/js/slider.js'); ?>

<?php Yii::app()->clientScript->registerScriptFile($this->assetsBase.'/js/other_social.js'); ?>

<?php Yii::app()->clientScript->registerScriptFile($this->assetsBase.'/js/package.js'); ?>

I had

<app_dir>/js/ for all javascript and created

<app_dir>/protected/assets/js as suggested in a post on this forum for registerScriptFile

I had of course duplicated files and I am cleaning up.

The layout has this in the header:


        <?php Yii::app()->clientScript->registerCoreScript('jquery')?>

        <?php Yii::app()->clientScript->registerScriptFile($this->assetsBase.'/js/libs/jquery-ui-1.8.20.custom.min.js')?>

        <?php Yii::app()->clientScript->registerScriptFile($this->assetsBase.'/js/libs/jquery.yaselect.min.js')?>

        <?php Yii::app()->clientScript->registerScriptFile($this->assetsBase.'/js/script.js')?>

and I have this in config/main.php:


// application components

	'components'=>array(

		'clientScript'=>array(

					'packages'=>array(

							'jquery'=>array(

									'baseUrl'=>Yii::app()->request->baseUrl . '/js/libs/',

									'js'=>array('jquery-1.7.2.min.js')

					)					

				)

		),

(I know that baseUrl is now pointing to <app_dir>/js, but trying with


'baseUrl'=>Yii::app()->basePath . '/assets/js/libs' 

also did NOT load jquery at all!!!

PLEASE HELP! I am new to Yii and am loosing my mind on this. Thank you.

This is what gets generated for the page:


<script type="text/javascript" src="/js/libs/jquery-1.7.2.min.js"></script>

<script type="text/javascript" src="/assets/ab20866e/jquery.yiiactiveform.js"></script>

<script type="text/javascript" src="/assets/2dfe5520/js/libs/jquery-ui-datetimepicker.js"></script>

<script type="text/javascript" src="/assets/2dfe5520/js/event_create.js"></script>

<script type="text/javascript" src="/assets/2dfe5520/js/slider.js"></script>

<script type="text/javascript" src="/assets/2dfe5520/js/other_social.js"></script>

<script type="text/javascript" src="/assets/2dfe5520/js/package.js"></script>

<script type="text/javascript" src="/assets/2dfe5520/js/libs/jquery-ui-1.8.20.custom.min.js"></script>

<script type="text/javascript" src="/assets/2dfe5520/js/libs/jquery.yaselect.min.js"></script>

<script type="text/javascript" src="/assets/2dfe5520/js/script.js"></script>

To me the jquery.yiiactiveform.js one looks suspicious! Any idea?

Here’s the answer, which I got through crossposting at stackoverflow.com:

The difference is actually here:


jQuery(document).ready(function() {

In the original version you had the line above, which essentially waits until all assets are loaded before executing.

Your second version tries to execute before loading the assets because you don’t have the line above.

Thanks for pointing this out brother, I always wondered what’s the difference there!

I got an issue,jquery loading multiple times.If any body have any solution then please let me know

localhost/projects/test/development/assets/82701a3f/jquery.js

localhost/projects/test/development/assets/82701a3f/jquery.js?_=1383631940296