JS errors in IE7 & IE8

JavaScript
1

Hi All,

I was wondering if someone could take a quick look at…

Rainwater Harvesting | Kingspan Water for me. It’s not a site I have designed or developed apart from the Quick Quote area on the right hand side which I hurriedly did last night.

The part I am having problems with is the ‘Need help to calculate your roof space? Click here’ functionality. This uses Jquery Tools to produce an overlay and modal window with a form which populates the ‘roof area’ field on the parent page.

It’s working fine in all browsers on my Mac. However, the client says it is not working in Windows with IE7 & IE8.

In IE7, the client says that there is a JS error message, but the modal eventually comes up and works - obviously not correct.

In IE8, the client says nothing happens at all when the link is clicked.

Could someone with Windows with IE7 & IE8 access and a bit of JS knowledge take a look for me as my virtual machine thru Parallels for Mac has just mysteriously died. God knows where my old XP disc is!

The main JS code which I am using here is below but I would never claim to be an JS expert so any advice would be appreciated. Thanks loads in advance.

Pete

<script type="text/javascript">

$(document).ready(function() {
    var triggers = $(".modalInput").overlay({
        // some mask tweaks suitable for modal dialogs
        mask: {
            color: '#000000',
            loadSpeed: 200,
            opacity: 0.8,
        },
        closeOnClick: false
    });
    
    $("#prompt form").submit(function(e) {
        // close the overlay
        triggers.eq(0).overlay().close();
        // get user input
        oFormObject = document.forms['modalForm'];
        var modalFormValue = oFormObject.elements["free"].value;
        if(modalFormValue.length!=0){
            var input = modalFormValue;
        }else if(document.getElementById('roof_size_small').checked) {
            var input = '60';
        }else if(document.getElementById('roof_size_medium').checked) {
            var input = '100';
        }else if(document.getElementById('roof_size_large').checked) {
            var input = '150';
        }else if(document.getElementById('roof_size_xlarge').checked) {
            var input = '200';
        }else{
            var input = "";
        }
        oFormObject = document.forms['quickQuoteForm'];
        oFormObject.elements["promptResults"].value = input;
        // do not submit the form
        return e.preventDefault();
    });
});
</script>
2

In your code i have highlighted in red where the error is occurring…

var triggers = $(".modalInput").overlay({
    // some mask tweaks suitable for modal dialogs
    mask: {
        color: '#000000',
        loadSpeed: 200,
        opacity: 0.8[B][COLOR="Red"],[/COLOR][/B]
    }[color="red"][b],[/b][/color]
    closeOnClick: false
});

Basically what happens in IE is it sees the extra comma and returns an error because unlike other browsers it doesn’t know how to continue/read this. If you simply remove it your code in IE will work fine.

3

You beauty, can’t thank you enough especially for a Friday reply when the client is on my back. Lesson learnt, code during daylight (mostly!).

Thanks again,

Pete