On re-reading my post I see how it may have come across as grumpy. That's wasn't how I meant it to come across.
On re-reading my post I see how it may have come across as grumpy. That's wasn't how I meant it to come across.
Example code of how to do this sort of thing in a single table.
HTML Code:<table border=1> <tr id="row1"> <td class="day" rowspan=3> Monday </td> <td>entry 1</td> </tr> <tr id="row2"> <td>entry 2</td> </tr> <tr id="row3"> <td>entry 3</td> </tr> <tr id="row4"> <td class="day" rowspan=2> Sat </td> <td>entry 4</td> </tr> <tr id="row5"> <td>entry 5</td> </tr> </table> <button onclick="dostuff();">Do it</button> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script> function dostuff() { $('#row1').hide(); var rows = $('#row1 .day').attr('rowSpan'); $('#row1 .day').attr('rowspan', rows-1); $('#row2').prepend($('#row1 .day')); } </script>
The trick is to do three things:
1. Hide the row.
2. Grab the day TD and reduce its rowspan by the right amound.
3. Move it by prepending it to whatever the first row that should be displayed is.
You're on your own for making this more generic, but that's the basic algorithm.
This is the code that I use to generate the output of the table.
There is a gap in there where I am thinking of working out a way of identifying which days are without certain category types, and thus should be removed when other category types are selected.
PHP Code:function mf_timetable_display(){
//Creates output display for timetable - used in shortcode.
global $wpdb;
$table_name = $wpdb->prefix . "mf_timetable";
if(!isset($_GET['category']) OR $_GET['category']=="all"){
$query="SELECT * FROM " . $table_name;
} else {
$query="SELECT * FROM " . $table_name . " WHERE category= '" . $_GET['category']."'";
};
$results = $wpdb->get_results($query);
$mf_table_output .="<table>";
//table start
//$mf_table_output .="<table><thead><tr><th>Day</th><th>Class Name</th><th>Location</th><th>Start Time</th><th>End Time</th><th>Teacher</th><th>Cost</th><th>Category</th></tr></thead>";//Table Headers
$current_day = false;
$no_class_results=$results;//duplicate SQL results for second foreach loop.
foreach($no_class_results as $no_class_results){
//************--TO DO--*************
//Algorythm for determining if any days are without a class type.
//This information is to be passed to a class name on the rows of those days
//Then the jQuery ammended to hide rows where necessary.
//**********************************
}
foreach ($results as $results){
global $current_day;
if ($current_day != $results->day){
$day_output = $results->day;
$sub_table_start = "<td><table><tr class=".$results->category.">";
$sub_table_end = "";
if ($current_day != false){
$sub_table_end = "</table></td></tr>";
}
} else {
$sub_table_start = "";
$day_output = "";
$sub_table_end = "";
}
$mf_table_output .= $sub_table_end;
$mf_table_output .= "<tr>";
if ($day_output!=""){
$mf_table_output .= "<tr><td>".$day_output."</td>";
} else {
$mf_table_output .= "<tr class=".$results->category.">";
}
if ($current_day != $results->day){
$current_day = $results->day;
}
$mf_table_output .= $sub_table_start."<td>".$results->class;
$mf_table_output .= "</td><td>".$results->location;
$mf_table_output .= "</td><td>".$results->start;
$mf_table_output .= "</td><td>".$results->end;
$mf_table_output .= "</td><td>".$results->teacher;
$mf_table_output .= "</td><td>".$results->cost;
$mf_table_output .= "</td><td>".$results->category;
$mf_table_output .= "</td></tr>";
};
$mf_table_output .= "</table></td></tr></table>";
$mf_table_output .= "<br />";
$mf_table_output .= "<a class=\"test\" href=#>Test</a>";
$mf_table_output .= "<form action=\"";
$mf_table_output .= mf_curPageURL();
$mf_table_output .= "\" method=\"GET\">";
$mf_table_output .= "<select name=\"category\">";
if (isset($_GET['category'])){
if ($_GET['category']=="all") {
$mf_table_output .= "<option selected value=\"all\">All</option>";
} else {
$mf_table_output .= "<option value=\"all\">All</option>";
};
if ($_GET['category']=="ballet") {
$mf_table_output .= "<option selected value=\"ballet\">Ballet</option>";
} else {
$mf_table_output .= "<option value=\"ballet\">Ballet</option>";
};
if ($_GET['category']=="modern") {
$mf_table_output .= "<option selected value=\"modern\">Modern</option>";
} else {
$mf_table_output .= "<option value=\"modern\">Modern</option>";
};
if ($_GET['category']=="tap") {
$mf_table_output .= "<option selected value=\"tap\">Tap</option>";
} else {
$mf_table_output .= "<option value=\"tap\">Tap</option>";
};
if ($_GET['category']=="adult") {
$mf_table_output .= "<option selected value=\"adult\">Adult</option>";
} else {
$mf_table_output .= "<option value=\"adult\">Adult</option>";
}
} else{
$mf_table_output .= "<option value=\"all\">All</option>";
$mf_table_output .= "<option value=\"ballet\">Ballet</option>";
$mf_table_output .= "<option value=\"modern\">Modern</option>";
$mf_table_output .= "<option value=\"tap\">Tap</option>";
$mf_table_output .= "<option value=\"adult\">Adult</option>";
}
$mf_table_output .= "<input class=\"mf_timetable_ui\" type=\"submit\" value=\"Filter Results\"/> </form>";
echo $mf_table_output;
//print_r($test_val);
}