Complex pages often need to include many external JavaScript and CSS files. Because each file would cause one extra round trip to the server and back, we should minimize the number of script files by merging them into fewer ones. We should also consider reducing the size of each script file to reduce the network transmission time. There are many tools around to help on these two aspects.

For a page generated by Yii, chances are that some script files are rendered by components that we do not want to modify (e.g. Yii core components, third-party components). In order to minimizing these script files, we need two steps.

First, we declare the scripts to be minimized by configuring the scriptMap property of the clientScript application component. This can be done either in the application configuration or in code. For example,

What the above code does is that it maps those JavaScript files to the URL /js/all.js. If any of these JavaScript files need to be included by some components, Yii will include the URL (once) instead of the individual script files.

Second, we need to use some tools to merge (and perhaps compress) the JavaScript files into a single one and save it as js/all.js.

The same trick also applies to CSS files.

We can also improve page loading speed with the help of Google AJAX Libraries API. For example, we can include jquery.js from Google servers instead of our own server. To do so, we first configure the scriptMap as follows,

By mapping these script files to false, we prevent Yii from generating the code to include these files. Instead, we write the following code in our pages to explicitly include the script files from Google,

to click to a button which is on a container but then an ajax call is done and the content gets updated with new stuff and then when i try to click .button it wont work... nothing will get returned when i click the button.

I have a button onclick of which a jquery dialog appears with two input fields which are jquery datepickers. Whenever the dialog appears, the first fields gets focus automatically, hence the datepicker pops up. I have resolved this for now by adding another dummy input field. Is there a better way ?

Sorry if the question is repeated. I tried searching for one already existing but couldn't get one. Please point me to an existing question if present.

Edit:

Okay my code goes as follows. onClick of a button the jdialog appears and there are 2 datepicker input fields inside the div "select_date_dialog".