Including another php file inside ajax call works but javascript file doesn't load

Question

I have a form wizard phppage and in its related javascript (I'm usign prototype.js btw), I'm updating a div with Ajax.Updater. What's really interesting is external php file is included successfully but the javascript file is not. Here's my code:

wizard.php

<div id="step1" class="tab-pane active">
    <h3 class="block"><?=$core->l("report_selection")?></h3>
    <div class="control-group">
        <label class="control-label"><?=$core->l("report_name")?>
            <span class="required">*</span>
        </label>
        <div class="controls">
            <select id="report_selection" field="report_selection" class="m-wrap span10" appEditor="true">
                <?=combo_creator::render_reports_by_authorization();?>
            </select>
        </div>
    </div>
</div>
<div id="step2" class="tab-pane">
    <!-- Here I show external php file I include in ajax call-->
</div>

wizard.js

reportSelectionChanged: function() {
    switch (this.reportSelection.getValue()) {
        case A:
            new Ajax.Updater(
                    'step2', get_report_type.ajax.php, 
                    {
                        parameters : { 
                            reportSelection:this.reportSelection.getValue()
                        },
                        onComplete : function(){        
                            this.reportLastConsumptionFilter    = new ReportLastConsumptionFilter(this);
                        }
                    });
            break;

And inside ajax which is get_report_type.ajax.php

switch ($report_selection) {
     case A:
        $include_page = "last_cons_report.php";
        break;
}
if (isset($include_page)) {
    echo include $include_page;
}

last_cons_report.php

<!-- Some HTML elements -->
 ...

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

It all works just fine but as you can see I add a javascript. The problem is my main file doesn't seem to include this javascript file, anything else is fine.

Can you see the problem here?

EDIT:Solution

reportSelectionChanged: function() {
    switch (this.reportSelection.getValue()) {
        case A:
            new Ajax.Updater(
                    'step2', get_report_type.ajax.php, 
                    {
                        parameters : { 
                            reportSelection:this.reportSelection.getValue()
                        },
                        onComplete : jQuery.getScript("scripts/reporting/aircomConsumption/reportAircomConsumptionFilterSorting.js", function() {
                                alert("script loaded and executed");
                            });
                        }
                    });
            break;

Answer 1

Ajax not load <script> tags of your file, here is the problem, this line is just ignored by ajax. Consider maybe use a javascript function to import your javascript code.

Here are an good answer to your problem

Using the function loadScript(url, callback), in your code:

reportSelectionChanged: function() {
switch (this.reportSelection.getValue()) {
    case A:
        new Ajax.Updater(
                'step2', get_report_type.ajax.php, 
                {
                    parameters : { 
                        reportSelection:this.reportSelection.getValue()
                    },
                    onComplete : function(){ 
                        loadScript("scripts/reportLastConsumptionFilter.js",function(){
                            // callback code here.
                        })
                        this.reportLastConsumptionFilter    = new ReportLastConsumptionFilter(this);
                    }
                });
        break;