Question

I’ve code that, depending on the selected item in a drop-down, loads some further controls (separate content for index==0 vs. index >= 1). The initial select’s selected item is pre-set at the server end. I’ve and issue with reload/cache, where the user alters but doesn’t submit a form and then click reload. Originally, I was loading the default start from the server but the browser reload resulted in an incorrect form state as it (esp. IE) remembered the last selected – but not submitted – control vlaues if the user hit refresh. So, I have this code. Works fine in other browsers but in IE, no content is rendered.

$(window).load(function(){
    $.ajaxSetup({cache: false})
    var theProduct = '';
    if ($('#chooseProduct').attr('selectedIndex') > 0) {
        theProduct = '&product=' + $('#chooseProduct').val();
    }
    setEvent($('#chooseProduct').attr('id'), 'product_req');
    $('#productSubselection').load(
        '/netpub/server.np?base&site=ddfa&catalog=catalog&template=regions.np' + theProduct//,
    );
    $(document).ready(function(){ 
        $('#chooseProduct').change(function(Event){
            setEvent($('#chooseProduct').attr('id'), 'product_req');
            $('#productSubselection').load(
                '/netpub/server.np?base&site=ddfa&catalog=catalog&template=regions.np', $(this).serialize()//,
            );
        });
        $('#browseall').click(function(Event){
            deleteCookie('product_req');
        });
    });
});

Using logging/alerts, I can confirm IE is making the call for the right content. If I put the AJAX call’s URL in a normal IE window I get the expected content – well formed HTML – back. Neither IE or any of the other browsers throws any JS errors. I’ve tried putting the initial part of the code inside the ‘ready’ event but it makes no difference. Am I doing something obviously wrong?

Answer 1

Aplogies for the monologue, just giving this answer to tie off the subject. The problem proved to actually be a misencoding (mea culpa) of white space in the theProduct parameter string passed with the load URL. The result was subtle enough not to throw errors where I’d expect them so leading me to assume it was a jQuery/event issue. That sorted, I was able to put everything inside $(document).ready(function() and jQuery worked as originally envisaged. Moral? Remember to be diligent about text encoding when adding strings to GET queries.