Search code examples
javascriptjquerycoldfusioncoldfusion-8

jquery in coldfusion window not running on load


The issue I am having is that I have a jQuery function that is called on page load. On the page I have a cfgrid that opens a coldfusion window but the jQuery will not work on that window. I have tried placing the jQuery on both pages and I can't get it to work at all. I know the jQuery is fine, I've run it through the browser and it works as intended. It just will not load in the new window.

The idea is that my grid had names and once clicked, it opens a cfwindow with a list of dates. When the date is clicked, it will show information in the div infodiv for the correct date. This $(document).ready(function(){} does not work in the new window.

jscript/jquery

$(document).ready(function(){
    $('.infodiv').hide();

    $('#record').change(function(){
         var state = $(this).val();
         if(!state) $('infodiv').hide();

         var div= $('#' + state );
         div.removeClass('infodiv');
         $('.infodiv').hide();
         div.addClass('infodiv');

         if ( !div.is(':visible') ) div.fadeIn(500);
    });
});

function selectProfile(button,event){
    var grid = ColdFusion.Grid.getGridObject("myGrid");
    var record = grid.getSelections();
    var key = record[0].data.REF
    var config = new Object();
    // config style details
    config.bodyStyle='font-size:20px; font-family: Arial; color: #ff0000;';
    config.headerStyle ='font-family: Arial; background-color: red; color: white;'; ColdFusion.Window.create("selectProfileWindow","Records","viewrecords.cfm?CFGRIDKEY="+key , config);
    ColdFusion.Window.onHide("selectProfileWindow",cleanup);
    document.getElementById(ColdFusion.Window.getWindowObject("selectProfileWindow").header.id).className = "windowHdr";

}

Here is the ColdFusion Window viewrecords.cfm that pops up on grid (not included) select, which should run the jQuery and hide/show the divs according to my record select box

<td>
    <cfselect name="record" id="record">
        <cfloop query="grabRecords">
                <option value="#sequence#">
                #startDate# - #endDate#
                </option>
        </cfloop>
    </cfselect>
</td>
<td>
    <cfloop query="grabRecords">
                <div id="#sequence#" class="infodiv">
                    #ref# - #Name#
                </div>
    </cfloop>
</td>

edit: using a dated coldfusion 8


Solution

  • For those infamous CF ajax stuff, you need to follow their way of doing things. Check out AjaxOnLoad() on https://wikidocs.adobe.com/wiki/display/coldfusionen/AjaxOnLoad