CODEWITHSUNDEEP
javascriptgoogle-chromefirefoxcalendar
Stuart
Stuart

Reputation: 699

Calendar Pop-Up not working in Firefox & Chrome

I got this pop-up calendar from the internet and I can run it using IE. But when I tried to browse it using Firefox or Chrome, the pop-up calendar is not working.

This is the external js file place in the <head> DL calendar.js:

<script src="../script/calendar.js?d6aa97d33d459ea3670056e737c99a3d" 
     type="text/javascript"></script>

Code in HTML:

<input type="text" readonly="readonly" class="blackcopy" name="txtReadyDate" id="txtReadyDate" size="10" maxlength="10" value="">
<input type="button" name="btnStartShipDate" style="width: 30px; height: 19px" value="..."/>

And I have this javascript code which trigger the click event in the button. It is place at the last part with the rest of the codes:

<script type="text/javascript">
    var sDetector;
    var sStop;

    calendar.set("btnStartShipDate", "txtReadyDate", "left", 130, -20, document.frmObject.txtReadyDate.value);

    function onMouseMove(val) {
        if (sStop == 'stop') {
            return false;
        }
        sDetector = val;
    }

    function sHide() {
        if (sStop == 'stop') {
            sStop = "";
            calendar.hideCalendar()
        }

        if (sDetector == 'hide') {
            calendar.hideCalendar()
            sDetector = "";
        }
    }
</script>

The calendar looks like this when it is working:

enter image description here

Any code there which has conflicts or not compatible with Firefox & Chrome?

Upvotes: 0

Views: 7394

Answers (1)

Stuart
Stuart

Reputation: 699

I found what is worng. Some where in the code of calendar.js you will see a code like this:

var input = document.getElementById(input_id);

which is actually refering to this input:

<input type="button" name="btnStartShipDate" style="width: 30px; height: 19px" value="..."/>

Since getElementById refer to an id you need to put it an id attribute like this:

<input type="button" id="btnStartShipDate" name="btnStartShipDate" style="width: 30px; height: 19px" value="..."/>

The thing is, IE browse can somehow work it out even if the input only has a name attribute. But for the case of Firefox and Chrome, getElementById does not work until there is an id attribute in the control.

Upvotes: 1

Related Questions