A way to merge td's in a table

Question

So I'm trying to create a weekly calendar. I coded a loop in javascript creating the empty table and then afterwards modified the innerHTML of the appropriate td's from values taken from an SQL table using php and javascript. My problem is that when I set the rowspan of the specific td instead of merging with the next td's it is moving them to the end of my table. If I have 2 more reputation points i will post pictures to show my problem.

Here is my code if you want to take a look at it

                // Declare usefull information about the database and host
            $mysql_host = "-host info-";
            $mysql_database = "-database info-";
            $mysql_user = "user";
            $mysql_password = "pass";

            // open the connection
            $link = mysql_connect($mysql_host,$mysql_user,  $mysql_password, $mysql_database);

            // connect to the database
            mysql_select_db($mysql_database, $link) or die('database not selected'. mysql_error());


            // Select * from the table created in the database
            $result = mysql_query("SELECT * FROM Appointment;")
            or die("Could not query:" . mysql_error());

            echo "<script type='text/javascript' > "
                . "var hours = new Array('9:00','9:30','10:00','10:30','11:00','11:30', "
                . "'12:00','12:30','13:00','13:30','14:00','14:30','15:00','15:30');"
                . ""
                . "var days = new Array('Mon','Tue','Wed','Thu','Fri','Sat');"
                . ""
                . "for (  i = 0; i < 14 ; i++ ) "
                . "{"
                . "document.write('<tr id='+hours[i]+':00'+'>');"
                . "document.write('<th>'+ hours[i]+'</th> '); "
                ." for ( k = 0 ; k < 6; k++)"
                ."{"
                . "document.write('<td id='+days[k] +'> </td>'); "
                . "}"
                . "document.write('</tr>');"
                ."}"
                . " </script> ";

                while( $row = mysql_fetch_array( $result ))
                {
                    $timestamp = strtotime($row['Date']);
                    $day = date('D', $timestamp);
                    $from = $row['StartTime'];
                    $to = $row['EndTime'];
                    $rowspan = determinRowSpanBetween($from,$to);

                    echo "<script type='text/javascript'> "
                    . " var divToAddTo = GetElementInsideContainer('".$from."','".$day."');"
                    . "divToAddTo.className = 'busy';"
                    . "divToAddTo.rowspan='".$rowspan."';"
                    . "divToAddTo.innerHTML='Something to do';"


                    . "function GetElementInsideContainer(containerID, childID) {"
                    . " var elm = {};"
                    . "  var elms = document.getElementById(containerID).getElementsByTagName('*');"
                    . "  for (var i = 0; i < elms.length; i++) {"
                    . "   if (elms[i].id === childID) {"
                    . " elm = elms[i];"
                    . " break;"
                    . " }"
                    . "}"
                    . "return elm;"
                    . "}"

                    . " </script>" ;


                }

the function determinRowSpanBetween is created later on in the code.

Answer 1

Having a rowspan > 1 in a td that is only supposed to take up one space (i.e. one that is not merged with other td's) will cause a whole bunch of errors. Make sure you account for every row you add to rowspan.