I am editing some code from a previous developer for a timetable filtering system. The way I would tackle this myself is using jQuery so I am having a few issues debugging this problem. There seems to be an issue with the Javascript in IE.

Here is the code where the issue is arising:

The Javascript:

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

    xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

    xmlhttp=new ActiveXObject(Microsoft.XMLHTTP);

}

xmlhttp.onreadystatechange=function()

{

    if (xmlhttp.readyState==4 && xmlhttp.status==200)

    {

        document.getElementById(showtimetable).innerHTML=xmlhttp.responseText;

        jQuery('div #moreInfo a').each(function()

{

    var $link = jQuery(this);

    var $dialog = jQuery('<div></div>')

    .load($link.attr('href') + ' #content')

    .dialog

    ({

        autoOpen: false,

        title: $link.attr('title'),

        width: 600

    });



$link.click(function()

{

    $dialog.dialog('open');

    return false;

});

And the markup:

<div id=showtimetable>

<table class=tidytable>

    <thead>

        <tr>

            <th width=20%>

                Venue

            </th>

            <th width=18%>

                Session

            </th>

            <th width=18%>

                Age

            </th>

            <th width=15%>

                <?php echo JText::_('COM_TIMETABLE_HEADING_GROUP'); ?>

            </th>

            <th width=10%>

                <?php echo JText::_('COM_TIMETABLE_HEADING_WEEKDAY'); ?>

            </th>

            <?php /*<th width=13%>

                Activity

            </th>*/ ?>

            <th width=14%>

                Time

            </th>

            <th width=5%>

                Info

            </th>



      </tr>

    </thead>

    <tfoot>

        <tr>

            <td colspan=13>

                <?php //echo $this->pagination->getListFooter(); ?>

            </td>

        </tr>

    </tfoot>

    <tbody>

        <?php foreach($this->items as $i => $item): ?>

            <tr class=row<?php echo $i % 2; ?>>

                <td>                       

                    <?php if($item->centreDescription!=''){echo '<a href='.$item->centreDescription.' >'.$item->centre.'</a>';}

                    else {echo $item->centre;}?>

                </td>                    

                <td>

                    <?php echo $item->class;?>

                </td>

                <td>

                     <?php echo $item->ageRange;?>

                </td>

                <td>

                    <?php echo $item->gn;?>

                </td>

                <td>

                    <?php TimeTablesHelper::getWeekday($item->weekday);?>

                </td>

                <?php /*<td>

                    <?php echo $item->activity; ?>

                </td>*/?>

                <td>

                    <?php echo substr($item->startTime,0,5); ?> - <?php echo substr($item->endTime,0,5); ?>

                </td>

              <td width=5%>

                <?php if($item->bookingInfo!=''){?>

                <div id=moreInfo>

                  <a href=moreinfo.php?id=<?php echo $item->id;?> title=More Details...>+</a>

                </div>      

                <?php }?>     

              </td>                       

            </tr>              

        <?php endforeach; ?>

    </tbody>

</table>

Here is what is in the xml response:

<form action=/component/timetable/ method=post name=adminForm>

<table class=tidytable>

    <thead>

        <tr>

            <th width=20%>

                Venue

            </th>

            <th width=18%>

                Session

            </th>

            <th width=18%>

                Age

            </th>

            <th width=15%>

                Group           </th>

            <th width=10%>

                Weekday         </th>

                        <th width=14%>

                Time

            </th>

            <th width=5%>

                Info

            </th>

        </tr>

    </thead>

    <tfoot>

        <tr>

            <td colspan=13>

            </td>

        </tr>

    </tfoot>

        <tbody>

            <tr class=row0>

                    <td>                       

                        Heywood Civic Centre                     </td>                    

                    <td>

                        50+ Bowls                    </td>

                    <td>

                         Aged 50 plus                    </td>

                    <td>

                        50 Plus                    </td>

                    <td>

                        Thursday                    </td>

                                        <td>

                        13:00 - 16:00                    </td>

                    <td width=5%>

                                        <div id=moreInfo>

                        <a href=/moreinfo.php?id=303 title=More Details...>+</a>

                    </div>      



                    </td>                       

                </tr>              

        </tbody>

    </table>

    <input type=hidden name=task value= />

</form>

This works fine in Firefox and IE9 but in IE8 and below I am recieving a SCRIPT601: unknown runtime error fitness-classes, line 564 character 7 which refers to the line in the javascript with the innerHTML function.

I am unsure as to why this issue may be arising but it is preventing any of the Javascipt from working.

Does anybody have any idea why this would be occurring?

Many thanks in advance!